You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Small secondary button: padding left and right equals 12px (10px padding + 2px border) in Boosted instead of 15px (13px padding + 2px border) in ODS
Large secondary button: padding left and right equals 22px (20px padding + 2px border) in Boosted instead of 20px (18px padding + 2px border) in ODS
⚠️Not true anymore (=> see Update below): After talking about that with Cyriaque Billard, it appears that buttons with icon + label don't exist in 3 sizes in the Orange Design System, so those components shouldn't be uses in this context. See Issue Docs > Components > Buttons > With icon: Add "not in ODS" alert message #1125 - Closed because no more needed (see below)
⚠️⚠️True "but" (=> see Update below): update with info given by Cyriaque Billard (March 1st 2022):
I gave a wrong information to you regarding the sizes that we provide for some buttons in the Web UI Kit. The correct info is:
Button with label, button with icon+label are provided in Small, Medium, and Large sizes in the Web UI Kit. But it is not reflected in the DSM and in Zeplin. We will correct that. In the meantime I can give you the specifications. => Issue Docs > Components > Buttons > With icon: Add "not in ODS" alert message #1125 no more need and therefore closed
Other buttons are provided at Medium size only.
Specifications:
All the values for the typo are identical to the buttons without icons.
⚠️⚠️⚠️Update with last info given by Cyriaque Billard (November 10th 2022):
The changes that have to be made are :
set icon size in small buttons to 15px instead of 16px (1rem) and change comment above (icons sizes are always a multiple of 5)
set horizontal padding for small buttons to 13px instead of currently 10px - and not 15px (because in sketch horizontal padding in buttons includes 2px border). This has to be done for small buttons with or without icons
set horizontal padding for large buttons to 18px instead of currently 20px - and not 20px (because in sketch horizontal padding in buttons includes 2px border). This has to be done for large buttons with or without icons
slightly lower small buttons padding (try 1px lower). This has to be done for small buttons with or without icons
do not change anything else because it already seems ok
Reduced test cases
NA
What operating system(s) are you seeing the problem on?
Windows, macOS
What browser(s) are you seeing the problem on?
Chrome, Firefox
What version of Boosted are you using?
v5.1.0
The text was updated successfully, but these errors were encountered:
I updated this card description (see "Update" part) which make the point possible to fix.
Regarding the button's label, you're totally right and yes the labels have to be changed. 2 possibilities for that:
1- replacing "Secondary" by "Primary"
2- replacing "Secondary" respectively by "Small button", "Medium button" and "Large button" as it is done in the "Sizes" paragraph even though we are not in this paragraph.
I tend to prefer this 2nd solution... I you have an opinion...
isabellechanclou
changed the title
Docs > Components > Buttons > With icon: Fix horizontal padding (small + large sizes)
Docs > Components > Buttons > With icon: Fix horizontal padding (small + large sizes) + labels
Mar 21, 2022
I have checked the vertical positioning of the labels for Buttons with Icons and Labels across all three sizes using the example on the Boosted page ( https://boosted.orange.com/docs/5.2/components/buttons/#with-icon ).
I measured the distance between the baseline of the label to the bottom of the button and they are the same as the Web UI kit sizes. No changes are needed for the vertical positioning of the labels on these buttons.
Prerequisites
Describe the issue
Buttons with icon have a different padding than the one indicated on Orange Design System (https://system.design.orange.com/0c1af118d/p/278ebc-standard-buttons/b/247486). Concerned :
Small secondary button: padding left and right equals 12px (10px padding + 2px border) in Boosted instead of 15px (13px padding + 2px border) in ODS
Large secondary button: padding left and right equals 22px (20px padding + 2px border) in Boosted instead of 20px (18px padding + 2px border) in ODS
The changes that have to be made are :
Reduced test cases
NA
What operating system(s) are you seeing the problem on?
Windows, macOS
What browser(s) are you seeing the problem on?
Chrome, Firefox
What version of Boosted are you using?
v5.1.0
The text was updated successfully, but these errors were encountered: