kotovalexarian-likes-github
/
twbs--bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Releases Activity

updated button/form-control padding and line-height 

- Moves from no set line-height (inherited of 1.5) to declared 1.25 for
all inputs and buttons (regardless of size modifier).

- Updates padding to be `.5rem` instead of `.375rem` so that padding is
more likely to be whole numbers based on the root font-size.

- Whole numbers will be beneficial in avoiding odd fractional pixels
that can lead to misalignment as shown in #18607.

- Large buttons and inputs are now a tad wider, and smaller
buttons/inputs a tad shorter and narrower, too.
This commit is contained in:
Mark Otto 2016-02-07 22:46:50 -08:00
parent a16b2ef162
commit 38c93371c1
3 changed files with 11 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
scss/_buttons.scss
View File

@ -7,6 +7,7 @@
.btn {
display: inline-block;
font-weight: $btn-font-weight;
line-height: $btn-line-height;
text-align: center;
white-space: nowrap;
vertical-align: middle;

1
scss/_forms.scss
View File

@ -11,6 +11,7 @@
// height: $input-height;
padding: $input-padding-y $input-padding-x;
font-size: $font-size-base;
line-height: $input-line-height;
color: $input-color;
background-color: $input-bg;
// Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214.

16
scss/_variables.scss
View File

@ -237,7 +237,8 @@ $table-border-color: $gray-lighter !default;
// For each of Bootstrap's buttons, define text, background and border color.
$btn-padding-x: 1rem !default;
$btn-padding-y: .375rem !default;
$btn-padding-y: .5rem !default;
$btn-line-height: 1.25 !default;
$btn-font-weight: normal !default;
$btn-box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075) !default;
$btn-active-box-shadow: inset 0 3px 5px rgba(0,0,0,.125) !default;
@ -268,10 +269,10 @@ $btn-danger-border: $btn-danger-bg !default;
$btn-link-disabled-color: $gray-light !default;
$btn-padding-x-sm: .75rem !default;
$btn-padding-x-sm: .5rem !default;
$btn-padding-y-sm: .25rem !default;
$btn-padding-x-lg: 1.25rem !default;
$btn-padding-x-lg: 1.5rem !default;
$btn-padding-y-lg: .75rem !default;
$btn-block-spacing-y: 5px !default;
@ -289,7 +290,8 @@ $btn-border-radius-sm: $border-radius-sm !default;
// Forms
$input-padding-x: .75rem !default;
$input-padding-y: .375rem !default;
$input-padding-y: .5rem !default;
$input-line-height: 1.25 !default;
$input-bg: #fff !default;
$input-bg-disabled: $gray-lighter !default;
@ -308,10 +310,10 @@ $input-box-shadow-focus: rgba(102,175,233,.6) !default;
$input-color-placeholder: #999 !default;
$input-padding-x-sm: .75rem !default;
$input-padding-y-sm: .275rem !default;
$input-padding-x-sm: .5rem !default;
$input-padding-y-sm: .25rem !default;
$input-padding-x-lg: 1.25rem !default;
$input-padding-x-lg: 1.5rem !default;
$input-padding-y-lg: .75rem !default;
$input-height: (($font-size-base * $line-height-base) + ($input-padding-y * 2)) !default;