Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(button): set default button heights #1719

Merged
merged 3 commits into from
Feb 6, 2019
Merged

fix(button): set default button heights #1719

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
98bae99
fix(button): set default button heights
emyarod Feb 1, 2019
c7bf161
refactor(button): use $button-height variable
emyarod Feb 1, 2019
78d8dbf
Merge branch 'master' into 1691-set-default-button-height
tw15egan Feb 6, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/components/button/_button.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -305,7 +305,7 @@

.#{$prefix}--btn--sm {
@include letter-spacing;
height: auto;
height: rem(32px);
Copy link
Contributor

@jendowns jendowns Feb 1, 2019 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just pointing out that this is a bit different than how height is applied to small buttons in the non-experimental theme:
https://github.com/IBM/carbon-components/blob/98bae993a38f43dc45e6a23b5302f882926a0ab1/src/components/button/_button.scss#L163

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the output is identical (2rem) as our base font size is 16px, unless I am mistaken. Please correct me if that's not the case

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yup, it's the same. Just pointing it out for consistency 👍

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yeah I figured I would use the rem conversion function to be consistent with the rest of the experimental styles

padding: $button-padding-sm;
}

Expand Down
2 changes: 1 addition & 1 deletion src/components/button/_mixins.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,7 @@
flex-shrink: 0;
font-size: $button-font-size;
font-weight: $button-font-weight;
height: auto;
height: rem(48px);
Copy link
Contributor

@jendowns jendowns Feb 1, 2019 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

IMO this should be rem($button-height) -- see: https://github.com/IBM/carbon-components/blob/e4da4a57542a42f7c6e0a90e91aac9b7e0fcaf02/src/globals/scss/_theme-tokens.scss#L140

padding: $button-padding;
border-radius: $button-border-radius;
text-align: left;
Expand Down