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

v5: Reuse box-shadow variables (#29023) 

* Remove default kbd element shadow, simplify selector while here

* Add new -shadow-inset variable so our shadows match on .form-control's, .form-select's, and .progress's

* Reuse box-shadow variables for .dropdown's, .popover's, .toast's, .modal's, and .img-thumbnail's
This commit is contained in:
Mark Otto 2019-07-15 00:29:13 -07:00 committed by XhmikosR
parent b4f99cb968
commit df1c3c0ce8
2 changed files with 13 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
scss/_code.scss
View File

@ -17,13 +17,12 @@ kbd {
color: $kbd-color;
background-color: $kbd-bg;
@include border-radius($border-radius-sm);
@include box-shadow($kbd-box-shadow);
kbd {
// stylelint-disable-next-line no-duplicate-selectors
& {
padding: 0;
@include font-size(100%);
font-weight: $nested-kbd-font-weight;
@include box-shadow(none);
}
}

22
scss/_variables.scss
View File

@ -234,6 +234,7 @@ $rounded-pill: 50rem !default;
$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;
$box-shadow: 0 .5rem 1rem rgba($black, .15) !default;
$box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;
$box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;
$component-active-color: $white !default;
$component-active-bg: theme-color("primary") !default;
@ -337,7 +338,6 @@ $mark-padding: .2em !default;
$dt-font-weight: $font-weight-bold !default;
$kbd-box-shadow: inset 0 -.1rem 0 rgba($black, .25) !default;
$nested-kbd-font-weight: $font-weight-bold !default;
$list-inline-padding: .5rem !default;
@ -480,7 +480,7 @@ $input-disabled-bg: $gray-200 !default;
$input-color: $gray-700 !default;
$input-border-color: $gray-400 !default;
$input-border-width: $input-btn-border-width !default;
$input-box-shadow: inset 0 1px 1px rgba($black, .075) !default;
$input-box-shadow: $box-shadow-inset !default;
$input-border-radius: $border-radius !default;
$input-border-radius-lg: $border-radius-lg !default;
@ -594,7 +594,7 @@ $form-select-feedback-icon-size: $input-height-inner-half $input-height
$form-select-border-width: $input-border-width !default;
$form-select-border-color: $input-border-color !default;
$form-select-border-radius: $border-radius !default;
$form-select-box-shadow: inset 0 1px 2px rgba($black, .075) !default;
$form-select-box-shadow: $box-shadow-inset !default;
$form-select-focus-border-color: $input-focus-border-color !default;
$form-select-focus-width: $input-focus-width !default;
@ -615,7 +615,7 @@ $form-range-track-height: .5rem !default;
$form-range-track-cursor: pointer !default;
$form-range-track-bg: $gray-300 !default;
$form-range-track-border-radius: 1rem !default;
$form-range-track-box-shadow: inset 0 .25rem .25rem rgba($black, .1) !default;
$form-range-track-box-shadow: $box-shadow-inset !default;
$form-range-thumb-width: 1rem !default;
$form-range-thumb-height: $form-range-thumb-width !default;
@ -766,7 +766,7 @@ $dropdown-border-width: $border-width !default;
$dropdown-inner-border-radius: calc(#{$dropdown-border-radius} - #{$dropdown-border-width}) !default;
$dropdown-divider-bg: $gray-200 !default;
$dropdown-divider-margin-y: $nav-divider-margin-y !default;
$dropdown-box-shadow: 0 .5rem 1rem rgba($black, .175) !default;
$dropdown-box-shadow: $box-shadow !default;
$dropdown-link-color: $gray-900 !default;
$dropdown-link-hover-color: darken($gray-900, 5%) !default;
@ -871,7 +871,7 @@ $popover-border-width: $border-width !default;
$popover-border-color: rgba($black, .2) !default;
$popover-border-radius: $border-radius-lg !default;
$popover-inner-border-radius: calc(#{$popover-border-radius} - #{$popover-border-width}) !default;
$popover-box-shadow: 0 .25rem .5rem rgba($black, .2) !default;
$popover-box-shadow: $box-shadow !default;
$popover-header-bg: darken($popover-bg, 3%) !default;
$popover-header-color: $headings-color !default;
@ -900,7 +900,7 @@ $toast-background-color: rgba($white, .85) !default;
$toast-border-width: 1px !default;
$toast-border-color: rgba(0, 0, 0, .1) !default;
$toast-border-radius: $border-radius !default;
$toast-box-shadow: 0 .25rem .75rem rgba($black, .1) !default;
$toast-box-shadow: $box-shadow !default;
$toast-header-color: $gray-600 !default;
$toast-header-background-color: rgba($white, .85) !default;
@ -933,8 +933,8 @@ $modal-content-border-color: rgba($black, .2) !default;
$modal-content-border-width: $border-width !default;
$modal-content-border-radius: $border-radius-lg !default;
$modal-content-inner-border-radius: calc(#{$modal-content-border-radius} - #{$modal-content-border-width}) !default;
$modal-content-box-shadow-xs: 0 .25rem .5rem rgba($black, .5) !default;
$modal-content-box-shadow-sm-up: 0 .5rem 1rem rgba($black, .5) !default;
$modal-content-box-shadow-xs: $box-shadow-sm !default;
$modal-content-box-shadow-sm-up: $box-shadow !default;
$modal-backdrop-bg: $black !default;
$modal-backdrop-opacity: .5 !default;
@ -978,7 +978,7 @@ $progress-height: 1rem !default;
$progress-font-size: $font-size-base * .75 !default;
$progress-bg: $gray-200 !default;
$progress-border-radius: $border-radius !default;
$progress-box-shadow: inset 0 .1rem .1rem rgba($black, .1) !default;
$progress-box-shadow: $box-shadow-inset !default;
$progress-bar-color: $white !default;
$progress-bar-bg: theme-color("primary") !default;
$progress-bar-animation-timing: 1s linear infinite !default;
@ -1018,7 +1018,7 @@ $thumbnail-bg: $body-bg !default;
$thumbnail-border-width: $border-width !default;
$thumbnail-border-color: $gray-300 !default;
$thumbnail-border-radius: $border-radius !default;
$thumbnail-box-shadow: 0 1px 2px rgba($black, .075) !default;
$thumbnail-box-shadow: $box-shadow-sm !default;
// Figures