From c890d9a46b1483cf5857d8fd9d694ea6a06a9a2e Mon Sep 17 00:00:00 2001 From: Maxime Locqueville Date: Thu, 1 Jun 2017 08:11:06 +0200 Subject: [PATCH 01/16] Fix search redirect --- _includes/scripts.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_includes/scripts.html b/_includes/scripts.html index b9a83876b9..bc411c2265 100644 --- a/_includes/scripts.html +++ b/_includes/scripts.html @@ -31,7 +31,7 @@ inputSelector: '#search-input', transformData: function (hits) { return hits.map(function (hit) { - hit.url = hit.url.replace('https://v4-alpha.getbootstrap.com', 'http://localhost:9001/docs/4.0'); + hit.url = hit.url.replace('https://v4-alpha.getbootstrap.com', '/docs/4.0'); return hit; }); }, From 10a3e380538786fc4947a7f6831fe75bc86d0e27 Mon Sep 17 00:00:00 2001 From: Johann-S Date: Thu, 1 Jun 2017 22:23:11 +0200 Subject: [PATCH 02/16] Fix broken documentation links for Toolings section --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 7b38f9aec4..7e451bc22d 100644 --- a/README.md +++ b/README.md @@ -87,7 +87,7 @@ Documentation search is powered by [Algolia's DocSearch](https://community.algol ### Running documentation locally -1. Run through the [tooling setup](https://github.com/twbs/bootstrap/blob/v4-dev/docs/getting-started/build-tools.md#tooling-setup) to install Jekyll (the site builder) and other Ruby dependencies with `bundle install`. +1. Run through the [tooling setup](https://github.com/twbs/bootstrap/blob/v4-dev/docs/4.0/getting-started/build-tools.md#tooling-setup) to install Jekyll (the site builder) and other Ruby dependencies with `bundle install`. 2. Run `npm run test` (or a specific NPM script) to rebuild distributed CSS and JavaScript files, as well as our docs assets. 3. From the root `/bootstrap` directory, run `bundle exec jekyll serve` in the command line. 4. Open in your browser, and voilà. From 3a00b005c19b8ea9dead451f5647c8c2182d40f0 Mon Sep 17 00:00:00 2001 From: Tom Van Rompaey Date: Sat, 3 Jun 2017 15:53:50 +0800 Subject: [PATCH 03/16] fix small typo inside _button-group.scss (#22746) fron -> front --- scss/_button-group.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/scss/_button-group.scss b/scss/_button-group.scss index d4c79ab60b..30a14d8833 100644 --- a/scss/_button-group.scss +++ b/scss/_button-group.scss @@ -12,7 +12,7 @@ flex: 0 1 auto; margin-bottom: 0; - // Bring the hover, focused, and "active" buttons to the fron to overlay + // Bring the hover, focused, and "active" buttons to the front to overlay // the borders properly @include hover { z-index: 2; From ec56bbe6bf1455bc9c5ae55d3fb16324593a4ebc Mon Sep 17 00:00:00 2001 From: Patrick Yeo Date: Thu, 1 Jun 2017 15:51:31 -0700 Subject: [PATCH 04/16] Rename `$card-border-radius-inner` to `$card-inner-border-radius` --- scss/_card.scss | 10 +++++----- scss/_variables.scss | 2 +- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/scss/_card.scss b/scss/_card.scss index 7be2aaf8b5..148c4f89b6 100644 --- a/scss/_card.scss +++ b/scss/_card.scss @@ -68,7 +68,7 @@ border-bottom: $card-border-width solid $card-border-color; &:first-child { - @include border-radius($card-border-radius-inner $card-border-radius-inner 0 0); + @include border-radius($card-inner-border-radius $card-inner-border-radius 0 0); } } @@ -78,7 +78,7 @@ border-top: $card-border-width solid $card-border-color; &:last-child { - @include border-radius(0 0 $card-border-radius-inner $card-border-radius-inner); + @include border-radius(0 0 $card-inner-border-radius $card-inner-border-radius); } } @@ -170,18 +170,18 @@ .card-img { width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch - @include border-radius($card-border-radius-inner); + @include border-radius($card-inner-border-radius); } // Card image caps .card-img-top { width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch - @include border-top-radius($card-border-radius-inner); + @include border-top-radius($card-inner-border-radius); } .card-img-bottom { width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch - @include border-bottom-radius($card-border-radius-inner); + @include border-bottom-radius($card-inner-border-radius); } diff --git a/scss/_variables.scss b/scss/_variables.scss index 74e2fab730..e5aa9e9256 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -673,7 +673,7 @@ $card-spacer-x: 1.25rem !default; $card-border-width: 1px !default; $card-border-radius: $border-radius !default; $card-border-color: rgba($black,.125) !default; -$card-border-radius-inner: calc(#{$card-border-radius} - #{$card-border-width}) !default; +$card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}) !default; $card-cap-bg: $gray-lightest !default; $card-bg: $white !default; From 891bca435fb4a13ef60e1bc65b522c6be1e31bb3 Mon Sep 17 00:00:00 2001 From: Patrick Yeo Date: Thu, 1 Jun 2017 14:21:33 -0700 Subject: [PATCH 05/16] Fix overflowing text in Cards with `word-wrap: break-word` --- scss/_card.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/scss/_card.scss b/scss/_card.scss index 148c4f89b6..e45af7bc78 100644 --- a/scss/_card.scss +++ b/scss/_card.scss @@ -6,6 +6,8 @@ position: relative; display: flex; flex-direction: column; + min-width: 0; + word-wrap: break-word; background-color: $card-bg; border: $card-border-width solid $card-border-color; @include border-radius($card-border-radius); @@ -20,7 +22,6 @@ .card-title { margin-bottom: $card-spacer-y; - word-break: break-all; } .card-subtitle { From 2d8789508937c98782cba39bd74dc8f145050d97 Mon Sep 17 00:00:00 2001 From: Johann-S Date: Sun, 4 Jun 2017 10:58:38 +0200 Subject: [PATCH 06/16] Update path to our docs assets for visual tests --- js/tests/visual/alert.html | 2 +- js/tests/visual/button.html | 2 +- js/tests/visual/carousel.html | 2 +- js/tests/visual/dropdown.html | 4 ++-- js/tests/visual/modal.html | 4 ++-- js/tests/visual/popover.html | 4 ++-- js/tests/visual/scrollspy.html | 4 ++-- js/tests/visual/tab.html | 3 ++- js/tests/visual/tooltip.html | 4 ++-- 9 files changed, 15 insertions(+), 14 deletions(-) diff --git a/js/tests/visual/alert.html b/js/tests/visual/alert.html index 5425b35073..4632e894a5 100644 --- a/js/tests/visual/alert.html +++ b/js/tests/visual/alert.html @@ -44,7 +44,7 @@ - + diff --git a/js/tests/visual/button.html b/js/tests/visual/button.html index 79cfa02480..9aaf08d44f 100644 --- a/js/tests/visual/button.html +++ b/js/tests/visual/button.html @@ -44,7 +44,7 @@ - + diff --git a/js/tests/visual/carousel.html b/js/tests/visual/carousel.html index 27a21efd69..eae9df705b 100644 --- a/js/tests/visual/carousel.html +++ b/js/tests/visual/carousel.html @@ -40,7 +40,7 @@ - + diff --git a/js/tests/visual/dropdown.html b/js/tests/visual/dropdown.html index fee096c6c8..da0c1e4a67 100644 --- a/js/tests/visual/dropdown.html +++ b/js/tests/visual/dropdown.html @@ -117,8 +117,8 @@ - - + + diff --git a/js/tests/visual/modal.html b/js/tests/visual/modal.html index def62b031f..1a607744ff 100644 --- a/js/tests/visual/modal.html +++ b/js/tests/visual/modal.html @@ -169,8 +169,8 @@ - - + + diff --git a/js/tests/visual/popover.html b/js/tests/visual/popover.html index 2354abf425..e26dca4913 100644 --- a/js/tests/visual/popover.html +++ b/js/tests/visual/popover.html @@ -32,8 +32,8 @@ - - + + diff --git a/js/tests/visual/scrollspy.html b/js/tests/visual/scrollspy.html index 0f115e0354..e305bcbdba 100644 --- a/js/tests/visual/scrollspy.html +++ b/js/tests/visual/scrollspy.html @@ -86,8 +86,8 @@

Ad leggings keytar, brunch id art party dolor labore.

- - + + diff --git a/js/tests/visual/tab.html b/js/tests/visual/tab.html index e747302db4..37730e5917 100644 --- a/js/tests/visual/tab.html +++ b/js/tests/visual/tab.html @@ -224,7 +224,8 @@ - + + diff --git a/js/tests/visual/tooltip.html b/js/tests/visual/tooltip.html index 172cb29ad3..fa84a20e4b 100644 --- a/js/tests/visual/tooltip.html +++ b/js/tests/visual/tooltip.html @@ -53,8 +53,8 @@
- - + + From 1a0a1a0600f70452513f14368beac81b5e3c0c6e Mon Sep 17 00:00:00 2001 From: Johann-S Date: Wed, 7 Jun 2017 21:33:36 +0200 Subject: [PATCH 07/16] Avoid Tooltips/Popovers overflow on documentation's navbar (#22733) --- assets/scss/_nav.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scss/_nav.scss b/assets/scss/_nav.scss index 3e18b01c74..eaf2f5693a 100644 --- a/assets/scss/_nav.scss +++ b/assets/scss/_nav.scss @@ -33,7 +33,7 @@ position: -webkit-sticky; position: sticky; top: 0; - z-index: 1030; // over everything in bootstrap + z-index: 1071; // over everything in bootstrap } .navbar-nav { From c5d4430367ce3df483809c539edced2daf2d7743 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 13 Jun 2017 08:25:18 -0700 Subject: [PATCH 08/16] Mention variable naming scheme to help with #22414 --- scss/_variables.scss | 3 +++ 1 file changed, 3 insertions(+) diff --git a/scss/_variables.scss b/scss/_variables.scss index e5aa9e9256..ede7cb1a4c 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -2,6 +2,9 @@ // // Copy settings from this file into the provided `_custom.scss` to override // the Bootstrap defaults without modifying key, versioned files. +// +// Variables should follow the `$component-state-property-size` formular for +// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs. // Table of Contents From 441f114681c496488f3c655d41b5779881ce1530 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 13 Jun 2017 08:25:55 -0700 Subject: [PATCH 09/16] Update _variables.scss --- scss/_variables.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/scss/_variables.scss b/scss/_variables.scss index ede7cb1a4c..f1e2ede7bf 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -3,7 +3,7 @@ // Copy settings from this file into the provided `_custom.scss` to override // the Bootstrap defaults without modifying key, versioned files. // -// Variables should follow the `$component-state-property-size` formular for +// Variables should follow the `$component-state-property-size` formula for // consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs. From 5e651615a3a60c646b6ed90881b6291bdef49208 Mon Sep 17 00:00:00 2001 From: Patrick Yeo Date: Thu, 8 Jun 2017 20:27:19 -0700 Subject: [PATCH 10/16] (#22414) Renamed for consistency `$modal-dialog-sm-up-margin-y`, `$modal-content-xs-box-shadow`, `$modal-content-sm-up-box-shadow`, to `$modal-dialog-margin-y-sm-up`, `$modal-content-box-shadow-xs`, `$modal-content-box-shadow-sm-up`, respectively --- scss/_modal.scss | 6 +++--- scss/_variables.scss | 6 +++--- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/scss/_modal.scss b/scss/_modal.scss index 9d2a86776d..c0c4067162 100644 --- a/scss/_modal.scss +++ b/scss/_modal.scss @@ -54,7 +54,7 @@ background-clip: padding-box; border: $modal-content-border-width solid $modal-content-border-color; @include border-radius($border-radius-lg); - @include box-shadow($modal-content-xs-box-shadow); + @include box-shadow($modal-content-box-shadow-xs); // Remove focus outline from opened modal outline: 0; } @@ -127,11 +127,11 @@ // Automatically set modal's width for larger viewports .modal-dialog { max-width: $modal-md; - margin: $modal-dialog-sm-up-margin-y auto; + margin: $modal-dialog-margin-y-sm-up auto; } .modal-content { - @include box-shadow($modal-content-sm-up-box-shadow); + @include box-shadow($modal-content-box-shadow-sm-up); } .modal-sm { max-width: $modal-sm; } diff --git a/scss/_variables.scss b/scss/_variables.scss index f1e2ede7bf..3ce512eb18 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -761,15 +761,15 @@ $badge-pill-border-radius: 10rem !default; $modal-inner-padding: 15px !default; $modal-dialog-margin: 10px !default; -$modal-dialog-sm-up-margin-y: 30px !default; +$modal-dialog-margin-y-sm-up: 30px !default; $modal-title-line-height: $line-height-base !default; $modal-content-bg: $white !default; $modal-content-border-color: rgba($black,.2) !default; $modal-content-border-width: $border-width !default; -$modal-content-xs-box-shadow: 0 3px 9px rgba($black,.5) !default; -$modal-content-sm-up-box-shadow: 0 5px 15px rgba($black,.5) !default; +$modal-content-box-shadow-xs: 0 3px 9px rgba($black,.5) !default; +$modal-content-box-shadow-sm-up: 0 5px 15px rgba($black,.5) !default; $modal-backdrop-bg: $black !default; $modal-backdrop-opacity: .5 !default; From 3ecb8b661b8bbdbb2482cd819350c09a0f310af7 Mon Sep 17 00:00:00 2001 From: Patrick Yeo Date: Thu, 8 Jun 2017 20:23:24 -0700 Subject: [PATCH 11/16] (#22414) Renamed for consistency `$nav-disabled-link-color`, `$nav-tabs-active-link-color`, `$nav-tabs-active-link-bg`, `$nav-tabs-active-link-border-color`, `$nav-pills-active-link-color`, `$nav-pills-active-link-bg` to `$nav-link-disabled-color`, `$nav-tabs-link-active-color`, `$nav-tabs-link-active-bg`, `$nav-tabs-link-active-border-color`, `$nav-pills-link-active-color`, `$nav-pills-link-active-bg`, respectively --- scss/_nav.scss | 14 +++++++------- scss/_variables.scss | 12 ++++++------ 2 files changed, 13 insertions(+), 13 deletions(-) diff --git a/scss/_nav.scss b/scss/_nav.scss index 973679eee7..b76e3e968b 100644 --- a/scss/_nav.scss +++ b/scss/_nav.scss @@ -21,7 +21,7 @@ // Disabled state lightens text &.disabled { - color: $nav-disabled-link-color; + color: $nav-link-disabled-color; } } @@ -45,7 +45,7 @@ } &.disabled { - color: $nav-disabled-link-color; + color: $nav-link-disabled-color; background-color: transparent; border-color: transparent; } @@ -53,9 +53,9 @@ .nav-link.active, .nav-item.show .nav-link { - color: $nav-tabs-active-link-color; - background-color: $nav-tabs-active-link-bg; - border-color: $nav-tabs-active-link-border-color $nav-tabs-active-link-border-color $nav-tabs-active-link-bg; + color: $nav-tabs-link-active-color; + background-color: $nav-tabs-link-active-bg; + border-color: $nav-tabs-link-active-border-color $nav-tabs-link-active-border-color $nav-tabs-link-active-bg; } .dropdown-menu { @@ -77,8 +77,8 @@ &.active, .show & { - color: $nav-pills-active-link-color; - background-color: $nav-pills-active-link-bg; + color: $nav-pills-link-active-color; + background-color: $nav-pills-link-active-bg; } } } diff --git a/scss/_variables.scss b/scss/_variables.scss index 3ce512eb18..1643f24e85 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -569,19 +569,19 @@ $zindex-tooltip: 1070 !default; $nav-link-padding-y: .5rem !default; $nav-link-padding-x: 1rem !default; -$nav-disabled-link-color: $gray-light !default; +$nav-link-disabled-color: $gray-light !default; $nav-tabs-border-color: #ddd !default; $nav-tabs-border-width: $border-width !default; $nav-tabs-border-radius: $border-radius !default; $nav-tabs-link-hover-border-color: $gray-lighter !default; -$nav-tabs-active-link-color: $gray !default; -$nav-tabs-active-link-bg: $body-bg !default; -$nav-tabs-active-link-border-color: #ddd !default; +$nav-tabs-link-active-color: $gray !default; +$nav-tabs-link-active-bg: $body-bg !default; +$nav-tabs-link-active-border-color: #ddd !default; $nav-pills-border-radius: $border-radius !default; -$nav-pills-active-link-color: $component-active-color !default; -$nav-pills-active-link-bg: $component-active-bg !default; +$nav-pills-link-active-color: $component-active-color !default; +$nav-pills-link-active-bg: $component-active-bg !default; // Navbar From 2317b7fc9636f6a17465d366ce6d73a0c93fee79 Mon Sep 17 00:00:00 2001 From: Patrick Yeo Date: Thu, 8 Jun 2017 19:33:33 -0700 Subject: [PATCH 12/16] (#22414) Rename for consistency `$custom-control-disabled-indicator-bg`, `$custom-control-disabled-description-color`, `$custom-control-checked-indicator-color`, `$custom-control-checked-indicator-bg`, `$custom-control-checked-indicator-box-shadow`, `$custom-control-focus-indicator-box-shadow`, `$custom-control-active-indicator-color`, `$custom-control-active-indicator-bg`, `$custom-control-active-indicator-box-shadow` to `$custom-control-indicator-disabled-bg`, `$custom-control-description-disabled-color`, `$custom-control-indicator-checked-color`, `$custom-control-indicator-checked-bg`, `$custom-control-indicator-checked-box-shadow`, `$custom-control-indicator-focus-box-shadow`, `$custom-control-indicator-active-color`, `$custom-control-indicator-active-bg`, `$custom-control-indicator-active-box-shadow`, respectively --- scss/_custom-forms.scss | 18 +++++++++--------- scss/_variables.scss | 24 ++++++++++++------------ 2 files changed, 21 insertions(+), 21 deletions(-) diff --git a/scss/_custom-forms.scss b/scss/_custom-forms.scss index 9133f7dbda..17211edbb7 100644 --- a/scss/_custom-forms.scss +++ b/scss/_custom-forms.scss @@ -23,29 +23,29 @@ opacity: 0; &:checked ~ .custom-control-indicator { - color: $custom-control-checked-indicator-color; - background-color: $custom-control-checked-indicator-bg; - @include box-shadow($custom-control-checked-indicator-box-shadow); + color: $custom-control-indicator-checked-color; + background-color: $custom-control-indicator-checked-bg; + @include box-shadow($custom-control-indicator-checked-box-shadow); } &:focus ~ .custom-control-indicator { // the mixin is not used here to make sure there is feedback - box-shadow: $custom-control-focus-indicator-box-shadow; + box-shadow: $custom-control-indicator-focus-box-shadow; } &:active ~ .custom-control-indicator { - color: $custom-control-active-indicator-color; - background-color: $custom-control-active-indicator-bg; - @include box-shadow($custom-control-active-indicator-box-shadow); + color: $custom-control-indicator-active-color; + background-color: $custom-control-indicator-active-bg; + @include box-shadow($custom-control-indicator-active-box-shadow); } &:disabled { ~ .custom-control-indicator { - background-color: $custom-control-disabled-indicator-bg; + background-color: $custom-control-indicator-disabled-bg; } ~ .custom-control-description { - color: $custom-control-disabled-description-color; + color: $custom-control-description-disabled-color; } } } diff --git a/scss/_variables.scss b/scss/_variables.scss index 1643f24e85..94121a64b9 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -444,29 +444,29 @@ $custom-control-indicator-bg: #ddd !default; $custom-control-indicator-bg-size: 50% 50% !default; $custom-control-indicator-box-shadow: inset 0 .25rem .25rem rgba($black,.1) !default; -$custom-control-disabled-indicator-bg: $gray-lighter !default; -$custom-control-disabled-description-color: $gray-light !default; +$custom-control-indicator-disabled-bg: $gray-lighter !default; +$custom-control-description-disabled-color: $gray-light !default; -$custom-control-checked-indicator-color: $white !default; -$custom-control-checked-indicator-bg: $brand-primary !default; -$custom-control-checked-indicator-box-shadow: none !default; +$custom-control-indicator-checked-color: $white !default; +$custom-control-indicator-checked-bg: $brand-primary !default; +$custom-control-indicator-checked-box-shadow: none !default; -$custom-control-focus-indicator-box-shadow: 0 0 0 1px $body-bg, 0 0 0 3px $brand-primary !default; +$custom-control-indicator-focus-box-shadow: 0 0 0 1px $body-bg, 0 0 0 3px $brand-primary !default; -$custom-control-active-indicator-color: $white !default; -$custom-control-active-indicator-bg: lighten($brand-primary, 35%) !default; -$custom-control-active-indicator-box-shadow: none !default; +$custom-control-indicator-active-color: $white !default; +$custom-control-indicator-active-bg: lighten($brand-primary, 35%) !default; +$custom-control-indicator-active-box-shadow: none !default; $custom-checkbox-radius: $border-radius !default; -$custom-checkbox-checked-icon: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$custom-control-checked-indicator-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23") !default; +$custom-checkbox-checked-icon: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23") !default; $custom-checkbox-indeterminate-bg: $brand-primary !default; -$custom-checkbox-indeterminate-indicator-color: $custom-control-checked-indicator-color !default; +$custom-checkbox-indeterminate-indicator-color: $custom-control-indicator-checked-color !default; $custom-checkbox-indeterminate-icon: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='#{$custom-checkbox-indeterminate-indicator-color}' d='M0 2h4'/%3E%3C/svg%3E"), "#", "%23") !default; $custom-checkbox-indeterminate-box-shadow: none !default; $custom-radio-radius: 50% !default; -$custom-radio-checked-icon: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='#{$custom-control-checked-indicator-color}'/%3E%3C/svg%3E"), "#", "%23") !default; +$custom-radio-checked-icon: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3E%3C/svg%3E"), "#", "%23") !default; $custom-select-padding-y: .375rem !default; $custom-select-padding-x: .75rem !default; From 4cc21bbf74c4cfcd2eedaff88f2376a2ebc8d4f1 Mon Sep 17 00:00:00 2001 From: Patrick Yeo Date: Thu, 8 Jun 2017 19:11:40 -0700 Subject: [PATCH 13/16] (#22414) Rename for consistency `$input-bg-disabled`, `$input-bg-focus`, `$input-border-color-focus`, `$input-box-shadow-focus`, `$input-color-focus`, `$input-color-placeholder` to `$input-disabled-bg`, `$input-focus-bg`, `$input-focus-border-color`, `$input-focus-box-shadow`, `$input-focus-color`, `$input-placeholder-color`, respectively --- scss/_forms.scss | 4 ++-- scss/_variables.scss | 12 ++++++------ scss/mixins/_forms.scss | 8 ++++---- 3 files changed, 12 insertions(+), 12 deletions(-) diff --git a/scss/_forms.scss b/scss/_forms.scss index 55e8cb43a4..faf41f512b 100644 --- a/scss/_forms.scss +++ b/scss/_forms.scss @@ -42,7 +42,7 @@ // Placeholder &::placeholder { - color: $input-color-placeholder; + color: $input-placeholder-color; // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526. opacity: 1; } @@ -54,7 +54,7 @@ // don't honor that edge case; we style them as disabled anyway. &:disabled, &[readonly] { - background-color: $input-bg-disabled; + background-color: $input-disabled-bg; // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655. opacity: 1; } diff --git a/scss/_variables.scss b/scss/_variables.scss index 94121a64b9..4c8ae3e262 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -396,7 +396,7 @@ $btn-transition: all .2s ease-in-out !default; // Forms $input-bg: $white !default; -$input-bg-disabled: $gray-lighter !default; +$input-disabled-bg: $gray-lighter !default; $input-color: $gray !default; $input-border-color: rgba($black,.15) !default; @@ -407,12 +407,12 @@ $input-border-radius: $border-radius !default; $input-border-radius-lg: $border-radius-lg !default; $input-border-radius-sm: $border-radius-sm !default; -$input-bg-focus: $input-bg !default; -$input-border-color-focus: lighten($brand-primary, 25%) !default; -$input-box-shadow-focus: $input-box-shadow, rgba($input-border-color-focus, .6) !default; -$input-color-focus: $input-color !default; +$input-focus-bg: $input-bg !default; +$input-focus-border-color: lighten($brand-primary, 25%) !default; +$input-focus-box-shadow: $input-box-shadow, rgba($input-focus-border-color, .6) !default; +$input-focus-color: $input-color !default; -$input-color-placeholder: $gray-light !default; +$input-placeholder-color: $gray-light !default; $input-height: (($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2)) !default; $input-height-lg: (($font-size-lg * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2)) !default; diff --git a/scss/mixins/_forms.scss b/scss/mixins/_forms.scss index 860795590d..0b183373eb 100644 --- a/scss/mixins/_forms.scss +++ b/scss/mixins/_forms.scss @@ -46,10 +46,10 @@ // contrast against a dark gray background. @mixin form-control-focus() { &:focus { - color: $input-color-focus; - background-color: $input-bg-focus; - border-color: $input-border-color-focus; + color: $input-focus-color; + background-color: $input-focus-bg; + border-color: $input-focus-border-color; outline: none; - @include box-shadow($input-box-shadow-focus); + @include box-shadow($input-focus-box-shadow); } } From c349f5917430166889e2f8a6697878e4ee5f3f7c Mon Sep 17 00:00:00 2001 From: Patrick Yeo Date: Thu, 8 Jun 2017 18:27:07 -0700 Subject: [PATCH 14/16] Rename for consistency `$table-sm-cell-padding`, `$table-bg-accent`, `$table-bg-hover`, `$table-bg-active`, `$table-inverse-bg-accent`, `$table-inverse-bg-hover` to `$table-cell-padding-sm`, `$table-accent-bg`, `$table-hover-bg`, `$table-active-bg`, `$table-inverse-accent-bg`, `$table-inverse-hover-bg`, respectively (#22414) --- scss/_tables.scss | 12 ++++++------ scss/_variables.scss | 12 ++++++------ 2 files changed, 12 insertions(+), 12 deletions(-) diff --git a/scss/_tables.scss b/scss/_tables.scss index 36c3dab77a..90a5e69bb9 100644 --- a/scss/_tables.scss +++ b/scss/_tables.scss @@ -37,7 +37,7 @@ .table-sm { th, td { - padding: $table-sm-cell-padding; + padding: $table-cell-padding-sm; } } @@ -69,7 +69,7 @@ .table-striped { tbody tr:nth-of-type(odd) { - background-color: $table-bg-accent; + background-color: $table-accent-bg; } } @@ -81,7 +81,7 @@ .table-hover { tbody tr { @include hover { - background-color: $table-bg-hover; + background-color: $table-hover-bg; } } } @@ -93,7 +93,7 @@ // inheritance to nested tables. // Generate the contextual variants -@include table-row-variant(active, $table-bg-active); +@include table-row-variant(active, $table-active-bg); @include table-row-variant(success, $state-success-bg); @include table-row-variant(info, $state-info-bg); @include table-row-variant(warning, $state-warning-bg); @@ -134,14 +134,14 @@ &.table-striped { tbody tr:nth-of-type(odd) { - background-color: $table-inverse-bg-accent; + background-color: $table-inverse-accent-bg; } } &.table-hover { tbody tr { @include hover { - background-color: $table-inverse-bg-hover; + background-color: $table-inverse-hover-bg; } } } diff --git a/scss/_variables.scss b/scss/_variables.scss index 4c8ae3e262..69d2239659 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -316,12 +316,12 @@ $list-inline-padding: 5px !default; // Customizes the `.table` component with basic values, each used across all table variations. $table-cell-padding: .75rem !default; -$table-sm-cell-padding: .3rem !default; +$table-cell-padding-sm: .3rem !default; $table-bg: transparent !default; -$table-bg-accent: rgba($black,.05) !default; -$table-bg-hover: rgba($black,.075) !default; -$table-bg-active: $table-bg-hover !default; +$table-accent-bg: rgba($black,.05) !default; +$table-hover-bg: rgba($black,.075) !default; +$table-active-bg: $table-hover-bg !default; $table-border-width: $border-width !default; $table-border-color: $gray-lighter !default; @@ -330,8 +330,8 @@ $table-head-bg: $gray-lighter !default; $table-head-color: $gray !default; $table-inverse-bg: $gray-dark !default; -$table-inverse-bg-accent: rgba($white, .05) !default; -$table-inverse-bg-hover: rgba($white, .075) !default; +$table-inverse-accent-bg: rgba($white, .05) !default; +$table-inverse-hover-bg: rgba($white, .075) !default; $table-inverse-border-color: lighten($gray-dark, 7.5%) !default; $table-inverse-color: $body-bg !default; From a362d62d316cb95800d82bbfbebee6ebdb4debe8 Mon Sep 17 00:00:00 2001 From: Patrick Yeo Date: Thu, 8 Jun 2017 18:05:27 -0700 Subject: [PATCH 15/16] Rename `$font-size-h*` to `$h*-font-size` for consistency (#22414) --- scss/_type.scss | 12 ++++++------ scss/_variables.scss | 12 ++++++------ 2 files changed, 12 insertions(+), 12 deletions(-) diff --git a/scss/_type.scss b/scss/_type.scss index fc9c791c4d..5ecc336aef 100644 --- a/scss/_type.scss +++ b/scss/_type.scss @@ -11,12 +11,12 @@ h1, h2, h3, h4, h5, h6, color: $headings-color; } -h1, .h1 { font-size: $font-size-h1; } -h2, .h2 { font-size: $font-size-h2; } -h3, .h3 { font-size: $font-size-h3; } -h4, .h4 { font-size: $font-size-h4; } -h5, .h5 { font-size: $font-size-h5; } -h6, .h6 { font-size: $font-size-h6; } +h1, .h1 { font-size: $h1-font-size; } +h2, .h2 { font-size: $h2-font-size; } +h3, .h3 { font-size: $h3-font-size; } +h4, .h4 { font-size: $h4-font-size; } +h5, .h5 { font-size: $h5-font-size; } +h6, .h6 { font-size: $h6-font-size; } .lead { font-size: $lead-font-size; diff --git a/scss/_variables.scss b/scss/_variables.scss index 69d2239659..46a0a89c38 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -262,12 +262,12 @@ $font-weight-bold: bold !default; $font-weight-base: $font-weight-normal !default; $line-height-base: 1.5 !default; -$font-size-h1: 2.5rem !default; -$font-size-h2: 2rem !default; -$font-size-h3: 1.75rem !default; -$font-size-h4: 1.5rem !default; -$font-size-h5: 1.25rem !default; -$font-size-h6: 1rem !default; +$h1-font-size: 2.5rem !default; +$h2-font-size: 2rem !default; +$h3-font-size: 1.75rem !default; +$h4-font-size: 1.5rem !default; +$h5-font-size: 1.25rem !default; +$h6-font-size: 1rem !default; $headings-margin-bottom: ($spacer / 2) !default; $headings-font-family: inherit !default; From d7867377d939a8bb8a645ab3af8a6a650a78fc29 Mon Sep 17 00:00:00 2001 From: Patrick Yeo Date: Thu, 8 Jun 2017 20:14:50 -0700 Subject: [PATCH 16/16] (Fixes #22414) Rename for consistency `$custom-checkbox-radius`, `$custom-checkbox-checked-icon`, `$custom-checkbox-indeterminate-indicator-color`, `$custom-checkbox-indeterminate-icon`, `$custom-radio-radius`, `$custom-radio-checked-icon`, `$custom-select-sm-font-size`, to `$custom-checkbox-border-radius`, `$custom-checkbox-icon-checked`, `$custom-checkbox-indicator-indeterminate-color`, `$custom-checkbox-icon-indeterminate`, `$custom-radio-border-radius`, `$custom-radio-icon-checked`, `$custom-select-font-size-sm` respectively --- scss/_custom-forms.scss | 12 ++++++------ scss/_variables.scss | 14 +++++++------- 2 files changed, 13 insertions(+), 13 deletions(-) diff --git a/scss/_custom-forms.scss b/scss/_custom-forms.scss index 17211edbb7..21fb7d488c 100644 --- a/scss/_custom-forms.scss +++ b/scss/_custom-forms.scss @@ -76,16 +76,16 @@ .custom-checkbox { .custom-control-indicator { - @include border-radius($custom-checkbox-radius); + @include border-radius($custom-checkbox-border-radius); } .custom-control-input:checked ~ .custom-control-indicator { - background-image: $custom-checkbox-checked-icon; + background-image: $custom-checkbox-icon-checked; } .custom-control-input:indeterminate ~ .custom-control-indicator { background-color: $custom-checkbox-indeterminate-bg; - background-image: $custom-checkbox-indeterminate-icon; + background-image: $custom-checkbox-icon-indeterminate; @include box-shadow($custom-checkbox-indeterminate-box-shadow); } } @@ -96,11 +96,11 @@ .custom-radio { .custom-control-indicator { - border-radius: $custom-radio-radius; + border-radius: $custom-radio-border-radius; } .custom-control-input:checked ~ .custom-control-indicator { - background-image: $custom-radio-checked-icon; + background-image: $custom-radio-icon-checked; } } @@ -175,7 +175,7 @@ .custom-select-sm { padding-top: $custom-select-padding-y; padding-bottom: $custom-select-padding-y; - font-size: $custom-select-sm-font-size; + font-size: $custom-select-font-size-sm; // &:not([multiple]) { // height: 26px; diff --git a/scss/_variables.scss b/scss/_variables.scss index 46a0a89c38..d26e3de12a 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -457,16 +457,16 @@ $custom-control-indicator-active-color: $white !default; $custom-control-indicator-active-bg: lighten($brand-primary, 35%) !default; $custom-control-indicator-active-box-shadow: none !default; -$custom-checkbox-radius: $border-radius !default; -$custom-checkbox-checked-icon: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23") !default; +$custom-checkbox-border-radius: $border-radius !default; +$custom-checkbox-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23") !default; $custom-checkbox-indeterminate-bg: $brand-primary !default; -$custom-checkbox-indeterminate-indicator-color: $custom-control-indicator-checked-color !default; -$custom-checkbox-indeterminate-icon: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='#{$custom-checkbox-indeterminate-indicator-color}' d='M0 2h4'/%3E%3C/svg%3E"), "#", "%23") !default; +$custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color !default; +$custom-checkbox-icon-indeterminate: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='#{$custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/%3E%3C/svg%3E"), "#", "%23") !default; $custom-checkbox-indeterminate-box-shadow: none !default; -$custom-radio-radius: 50% !default; -$custom-radio-checked-icon: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3E%3C/svg%3E"), "#", "%23") !default; +$custom-radio-border-radius: 50% !default; +$custom-radio-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3E%3C/svg%3E"), "#", "%23") !default; $custom-select-padding-y: .375rem !default; $custom-select-padding-x: .75rem !default; @@ -486,7 +486,7 @@ $custom-select-border-radius: $border-radius !default; $custom-select-focus-border-color: lighten($brand-primary, 25%) !default; $custom-select-focus-box-shadow: inset 0 1px 2px rgba($black, .075), 0 0 5px rgba($custom-select-focus-border-color, .5) !default; -$custom-select-sm-font-size: 75% !default; +$custom-select-font-size-sm: 75% !default; $custom-file-height: 2.5rem !default; $custom-file-width: 14rem !default;