rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-21 18:54:30 +01:00
Code Issues Actions Packages Releases Activity

Variable .btn and .form-control font sizes (#26908)

Browse Source
This commit is contained in:
Martijn Cuppens 2018-09-18 14:35:25 +02:00 committed by XhmikosR
parent 18ae915f54
commit e604958641
3 changed files with 19 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
scss/_buttons.scss
View File

@ -13,7 +13,7 @@
user-select: none; user-select: none;
background-color: transparent; background-color: transparent;
border: $btn-border-width solid transparent; border: $btn-border-width solid transparent;
@include button-size($btn-padding-y, $btn-padding-x, $font-size-base, $btn-line-height, $btn-border-radius); @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-line-height, $btn-border-radius);
@include transition($btn-transition); @include transition($btn-transition);
// Share hover and focus styles // Share hover and focus styles
@ -109,11 +109,11 @@ fieldset:disabled a.btn {
// //
.btn-lg { .btn-lg {
@include button-size($btn-padding-y-lg, $btn-padding-x-lg, $font-size-lg, $btn-line-height-lg, $btn-border-radius-lg); @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-line-height-lg, $btn-border-radius-lg);
} }
.btn-sm { .btn-sm {
@include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-line-height-sm, $btn-border-radius-sm); @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
} }

4
scss/_forms.scss
View File

@ -141,7 +141,7 @@ select.form-control {
.form-control-sm { .form-control-sm {
height: $input-height-sm; height: $input-height-sm;
padding: $input-padding-y-sm $input-padding-x-sm; padding: $input-padding-y-sm $input-padding-x-sm;
font-size: $font-size-sm; font-size: $input-font-size-sm;
line-height: $input-line-height-sm; line-height: $input-line-height-sm;
@include border-radius($input-border-radius-sm); @include border-radius($input-border-radius-sm);
} }
@ -149,7 +149,7 @@ select.form-control {
.form-control-lg { .form-control-lg {
height: $input-height-lg; height: $input-height-lg;
padding: $input-padding-y-lg $input-padding-x-lg; padding: $input-padding-y-lg $input-padding-x-lg;
font-size: $font-size-lg; font-size: $input-font-size-lg;
line-height: $input-line-height-lg; line-height: $input-line-height-lg;
@include border-radius($input-border-radius-lg); @include border-radius($input-border-radius-lg);
} }

19
scss/_variables.scss
View File

@ -356,6 +356,7 @@ $table-caption-color: $text-muted !default;
$input-btn-padding-y: .375rem !default; $input-btn-padding-y: .375rem !default;
$input-btn-padding-x: .75rem !default; $input-btn-padding-x: .75rem !default;
$input-btn-font-size: $font-size-base !default;
$input-btn-line-height: $line-height-base !default; $input-btn-line-height: $line-height-base !default;
$input-btn-focus-width: .2rem !default; $input-btn-focus-width: .2rem !default;
@ -364,10 +365,12 @@ $input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-colo
$input-btn-padding-y-sm: .25rem !default; $input-btn-padding-y-sm: .25rem !default;
$input-btn-padding-x-sm: .5rem !default; $input-btn-padding-x-sm: .5rem !default;
$input-btn-font-size-sm: $font-size-sm !default;
$input-btn-line-height-sm: $line-height-sm !default; $input-btn-line-height-sm: $line-height-sm !default;
$input-btn-padding-y-lg: .5rem !default; $input-btn-padding-y-lg: .5rem !default;
$input-btn-padding-x-lg: 1rem !default; $input-btn-padding-x-lg: 1rem !default;
$input-btn-font-size-lg: $font-size-lg !default;
$input-btn-line-height-lg: $line-height-lg !default; $input-btn-line-height-lg: $line-height-lg !default;
$input-btn-border-width: $border-width !default; $input-btn-border-width: $border-width !default;
@ -379,14 +382,17 @@ $input-btn-border-width: $border-width !default;
$btn-padding-y: $input-btn-padding-y !default; $btn-padding-y: $input-btn-padding-y !default;
$btn-padding-x: $input-btn-padding-x !default; $btn-padding-x: $input-btn-padding-x !default;
$btn-font-size: $input-btn-font-size !default;
$btn-line-height: $input-btn-line-height !default; $btn-line-height: $input-btn-line-height !default;
$btn-padding-y-sm: $input-btn-padding-y-sm !default; $btn-padding-y-sm: $input-btn-padding-y-sm !default;
$btn-padding-x-sm: $input-btn-padding-x-sm !default; $btn-padding-x-sm: $input-btn-padding-x-sm !default;
$btn-font-size-sm: $input-btn-font-size-sm !default;
$btn-line-height-sm: $input-btn-line-height-sm !default; $btn-line-height-sm: $input-btn-line-height-sm !default;
$btn-padding-y-lg: $input-btn-padding-y-lg !default; $btn-padding-y-lg: $input-btn-padding-y-lg !default;
$btn-padding-x-lg: $input-btn-padding-x-lg !default; $btn-padding-x-lg: $input-btn-padding-x-lg !default;
$btn-font-size-lg: $input-btn-font-size-lg !default;
$btn-line-height-lg: $input-btn-line-height-lg !default; $btn-line-height-lg: $input-btn-line-height-lg !default;
$btn-border-width: $input-btn-border-width !default; $btn-border-width: $input-btn-border-width !default;
@ -416,14 +422,17 @@ $label-margin-bottom: .5rem !default;
$input-padding-y: $input-btn-padding-y !default; $input-padding-y: $input-btn-padding-y !default;
$input-padding-x: $input-btn-padding-x !default; $input-padding-x: $input-btn-padding-x !default;
$input-font-size: $input-btn-font-size !default;
$input-line-height: $input-btn-line-height !default; $input-line-height: $input-btn-line-height !default;
$input-padding-y-sm: $input-btn-padding-y-sm !default; $input-padding-y-sm: $input-btn-padding-y-sm !default;
$input-padding-x-sm: $input-btn-padding-x-sm !default; $input-padding-x-sm: $input-btn-padding-x-sm !default;
$input-font-size-sm: $input-btn-font-size-sm !default;
$input-line-height-sm: $input-btn-line-height-sm !default; $input-line-height-sm: $input-btn-line-height-sm !default;
$input-padding-y-lg: $input-btn-padding-y-lg !default; $input-padding-y-lg: $input-btn-padding-y-lg !default;
$input-padding-x-lg: $input-btn-padding-x-lg !default; $input-padding-x-lg: $input-btn-padding-x-lg !default;
$input-font-size-lg: $input-btn-font-size-lg !default;
$input-line-height-lg: $input-btn-line-height-lg !default; $input-line-height-lg: $input-btn-line-height-lg !default;
$input-bg: $white !default; $input-bg: $white !default;
@ -449,13 +458,13 @@ $input-plaintext-color: $body-color !default;
$input-height-border: $input-border-width * 2 !default; $input-height-border: $input-border-width * 2 !default;
$input-height-inner: ($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2) !default; $input-height-inner: ($input-btn-font-size * $input-btn-line-height) + ($input-btn-padding-y * 2) !default;
$input-height: calc(#{$input-height-inner} + #{$input-height-border}) !default; $input-height: calc(#{$input-height-inner} + #{$input-height-border}) !default;
$input-height-inner-sm: ($font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2) !default; $input-height-inner-sm: ($input-btn-font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2) !default;
$input-height-sm: calc(#{$input-height-inner-sm} + #{$input-height-border}) !default; $input-height-sm: calc(#{$input-height-inner-sm} + #{$input-height-border}) !default;
$input-height-inner-lg: ($font-size-lg * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2) !default; $input-height-inner-lg: ($input-btn-font-size-lg * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2) !default;
$input-height-lg: calc(#{$input-height-inner-lg} + #{$input-height-border}) !default; $input-height-lg: calc(#{$input-height-inner-lg} + #{$input-height-border}) !default;
$input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; $input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
@ -535,12 +544,12 @@ $custom-select-focus-box-shadow: 0 0 0 $custom-select-focus-width rgba($custo
$custom-select-padding-y-sm: $input-btn-padding-y-sm !default; $custom-select-padding-y-sm: $input-btn-padding-y-sm !default;
$custom-select-padding-x-sm: $input-btn-padding-x-sm !default; $custom-select-padding-x-sm: $input-btn-padding-x-sm !default;
$custom-select-font-size-sm: $font-size-sm !default; $custom-select-font-size-sm: $input-btn-font-size-sm !default;
$custom-select-height-sm: $input-height-sm !default; $custom-select-height-sm: $input-height-sm !default;
$custom-select-padding-y-lg: $input-btn-padding-y-lg !default; $custom-select-padding-y-lg: $input-btn-padding-y-lg !default;
$custom-select-padding-x-lg: $input-btn-padding-x-lg !default; $custom-select-padding-x-lg: $input-btn-padding-x-lg !default;
$custom-select-font-size-lg: $font-size-lg !default; $custom-select-font-size-lg: $input-btn-font-size-lg !default;
$custom-select-height-lg: $input-height-lg !default; $custom-select-height-lg: $input-height-lg !default;
$custom-range-track-width: 100% !default; $custom-range-track-width: 100% !default;