diff options
Diffstat (limited to 'assets/stylesheets')
19 files changed, 140 insertions, 99 deletions
diff --git a/assets/stylesheets/_bootstrap-grid.scss b/assets/stylesheets/_bootstrap-grid.scss index 16d5eef..34b4fd9 100644 --- a/assets/stylesheets/_bootstrap-grid.scss +++ b/assets/stylesheets/_bootstrap-grid.scss @@ -1,11 +1,9 @@ -// Bootstrap Grid only -// -// Includes relevant variables and mixins for the flexbox grid -// system, as well as the generated predefined classes (e.g., `.col-sm-4`). - -// -// Box sizing, responsive, and more -// +/*! + * Bootstrap Grid v4.0.0-beta.2 (https://getbootstrap.com) + * Copyright 2011-2017 The Bootstrap Authors + * Copyright 2011-2017 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ @at-root { @-ms-viewport { width: device-width; } // stylelint-disable-line at-rule-no-vendor-prefix diff --git a/assets/stylesheets/_bootstrap-reboot.scss b/assets/stylesheets/_bootstrap-reboot.scss index b4a9f4a..976e7e7 100644 --- a/assets/stylesheets/_bootstrap-reboot.scss +++ b/assets/stylesheets/_bootstrap-reboot.scss @@ -1,9 +1,12 @@ -// Bootstrap Reboot only -// -// Includes only Normalize and our custom Reboot reset. +/*! + * Bootstrap Reboot v4.0.0-beta.2 (https://getbootstrap.com) + * Copyright 2011-2017 The Bootstrap Authors + * Copyright 2011-2017 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md) + */ @import "bootstrap/functions"; @import "bootstrap/variables"; @import "bootstrap/mixins"; - @import "bootstrap/reboot"; diff --git a/assets/stylesheets/_bootstrap.scss b/assets/stylesheets/_bootstrap.scss index bb1bb10..ccc5186 100644 --- a/assets/stylesheets/_bootstrap.scss +++ b/assets/stylesheets/_bootstrap.scss @@ -1,5 +1,5 @@ /*! - * Bootstrap v4.0.0-beta (https://getbootstrap.com) + * Bootstrap v4.0.0-beta.2 (https://getbootstrap.com) * Copyright 2011-2017 The Bootstrap Authors * Copyright 2011-2017 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) diff --git a/assets/stylesheets/bootstrap/_buttons.scss b/assets/stylesheets/bootstrap/_buttons.scss index 72fc5f3..7cd2783 100644 --- a/assets/stylesheets/bootstrap/_buttons.scss +++ b/assets/stylesheets/bootstrap/_buttons.scss @@ -22,7 +22,7 @@ &:focus, &.focus { outline: 0; - box-shadow: $btn-focus-box-shadow; + box-shadow: $input-btn-focus-box-shadow; } // Disabled comes first so active can properly restyle @@ -35,7 +35,7 @@ &:not([disabled]):not(.disabled):active, &:not([disabled]):not(.disabled).active { background-image: none; - @include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow); + @include box-shadow($input-btn-focus-box-shadow, $btn-active-box-shadow); } } diff --git a/assets/stylesheets/bootstrap/_carousel.scss b/assets/stylesheets/bootstrap/_carousel.scss index 8aa14ac..c3c2073 100644 --- a/assets/stylesheets/bootstrap/_carousel.scss +++ b/assets/stylesheets/bootstrap/_carousel.scss @@ -90,9 +90,15 @@ } .carousel-control-prev { left: 0; + @if $enable-gradients { + background: linear-gradient(90deg, rgba(0,0,0,.25), rgba(0,0,0,.001)); + } } .carousel-control-next { right: 0; + @if $enable-gradients { + background: linear-gradient(270deg, rgba(0,0,0,.25), rgba(0,0,0,.001)); + } } // Icons for within diff --git a/assets/stylesheets/bootstrap/_custom-forms.scss b/assets/stylesheets/bootstrap/_custom-forms.scss index 41dae4d..a521dbd 100644 --- a/assets/stylesheets/bootstrap/_custom-forms.scss +++ b/assets/stylesheets/bootstrap/_custom-forms.scss @@ -22,7 +22,7 @@ &:checked ~ .custom-control-indicator { color: $custom-control-indicator-checked-color; - background-color: $custom-control-indicator-checked-bg; + @include gradient-bg($custom-control-indicator-checked-bg); @include box-shadow($custom-control-indicator-checked-box-shadow); } @@ -33,7 +33,7 @@ &:active ~ .custom-control-indicator { color: $custom-control-indicator-active-color; - background-color: $custom-control-indicator-active-bg; + @include gradient-bg($custom-control-indicator-active-bg); @include box-shadow($custom-control-indicator-active-box-shadow); } @@ -244,7 +244,7 @@ padding: $custom-file-padding-y $custom-file-padding-x; line-height: $custom-file-line-height; color: $custom-file-button-color; - background-color: $custom-file-button-bg; + @include gradient-bg($custom-file-button-bg); border: $custom-file-border-width solid $custom-file-border-color; @include border-radius(0 $custom-file-border-radius $custom-file-border-radius 0); } diff --git a/assets/stylesheets/bootstrap/_dropdown.scss b/assets/stylesheets/bootstrap/_dropdown.scss index 1782d5b..daa867a 100644 --- a/assets/stylesheets/bootstrap/_dropdown.scss +++ b/assets/stylesheets/bootstrap/_dropdown.scss @@ -67,14 +67,14 @@ @include hover-focus { color: $dropdown-link-hover-color; text-decoration: none; - background-color: $dropdown-link-hover-bg; + @include gradient-bg($dropdown-link-hover-bg); } &.active, &:active { color: $dropdown-link-active-color; text-decoration: none; - background-color: $dropdown-link-active-bg; + @include gradient-bg($dropdown-link-active-bg); } &.disabled, diff --git a/assets/stylesheets/bootstrap/_forms.scss b/assets/stylesheets/bootstrap/_forms.scss index 0ece186..80bc7f3 100644 --- a/assets/stylesheets/bootstrap/_forms.scss +++ b/assets/stylesheets/bootstrap/_forms.scss @@ -316,11 +316,6 @@ select.form-control-lg { width: auto; } - .form-control-label { - margin-bottom: 0; - vertical-align: middle; - } - // Remove default margin on radios/checkboxes that were used for stacking, and // then undo the floating of radios and checkboxes to match. .form-check { diff --git a/assets/stylesheets/bootstrap/_functions.scss b/assets/stylesheets/bootstrap/_functions.scss index 5d43b57..43210f7 100644 --- a/assets/stylesheets/bootstrap/_functions.scss +++ b/assets/stylesheets/bootstrap/_functions.scss @@ -49,7 +49,7 @@ } // Color contrast -@mixin color-yiq($color) { +@function color-yiq($color) { $r: red($color); $g: green($color); $b: blue($color); @@ -57,9 +57,9 @@ $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000; @if ($yiq >= 150) { - color: #111; + @return #111; } @else { - color: #fff; + @return #fff; } } diff --git a/assets/stylesheets/bootstrap/_list-group.scss b/assets/stylesheets/bootstrap/_list-group.scss index ce3876b..7e0b19e 100644 --- a/assets/stylesheets/bootstrap/_list-group.scss +++ b/assets/stylesheets/bootstrap/_list-group.scss @@ -86,13 +86,8 @@ .list-group-flush { .list-group-item { border-right: 0; - border-bottom: 0; border-left: 0; border-radius: 0; - - &:first-child { - border-top: 0; - } } &:first-child { diff --git a/assets/stylesheets/bootstrap/_popover.scss b/assets/stylesheets/bootstrap/_popover.scss index 950d6ca..4503767 100644 --- a/assets/stylesheets/bootstrap/_popover.scss +++ b/assets/stylesheets/bootstrap/_popover.scss @@ -5,7 +5,6 @@ z-index: $zindex-popover; display: block; max-width: $popover-max-width; - padding: $popover-inner-padding; // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element. // So reset our font and text properties to avoid inheriting weird values. @include reset-text(); @@ -39,11 +38,11 @@ .arrow::before { content: ""; - border-width: $popover-arrow-outer-width; + border-width: $popover-arrow-width; } .arrow::after { content: ""; - border-width: $popover-arrow-outer-width; + border-width: $popover-arrow-width; } // Popover directions @@ -61,14 +60,14 @@ } .arrow::before { - bottom: -$popover-arrow-outer-width; - margin-left: -($popover-arrow-outer-width - 5); + bottom: -$popover-arrow-width; + margin-left: -$popover-arrow-width; border-top-color: $popover-arrow-outer-color; } .arrow::after { - bottom: -($popover-arrow-outer-width - 1); - margin-left: -($popover-arrow-outer-width - 5); + bottom: calc((#{$popover-arrow-width} - #{$popover-border-width}) * -1); + margin-left: -$popover-arrow-width; border-top-color: $popover-arrow-color; } } @@ -82,17 +81,17 @@ .arrow::before, .arrow::after { - margin-top: -($popover-arrow-outer-width - 3); + margin-top: -$popover-arrow-width; border-left-width: 0; } .arrow::before { - left: -$popover-arrow-outer-width; + left: -$popover-arrow-width; border-right-color: $popover-arrow-outer-color; } .arrow::after { - left: -($popover-arrow-outer-width - 1); + left: calc((#{$popover-arrow-width} - #{$popover-border-width}) * -1); border-right-color: $popover-arrow-color; } } @@ -106,17 +105,17 @@ .arrow::before, .arrow::after { - margin-left: -($popover-arrow-width - 3); + margin-left: -$popover-arrow-width; border-top-width: 0; } .arrow::before { - top: -$popover-arrow-outer-width; + top: -$popover-arrow-width; border-bottom-color: $popover-arrow-outer-color; } .arrow::after { - top: -($popover-arrow-outer-width - 1); + top: calc((#{$popover-arrow-width} - #{$popover-border-width}) * -1); border-bottom-color: $popover-arrow-color; } @@ -129,7 +128,7 @@ width: 20px; margin-left: -10px; content: ""; - border-bottom: 1px solid $popover-header-bg; + border-bottom: $popover-border-width solid $popover-header-bg; } } @@ -142,17 +141,17 @@ .arrow::before, .arrow::after { - margin-top: -($popover-arrow-outer-width - 3); + margin-top: -$popover-arrow-width; border-right-width: 0; } .arrow::before { - right: -$popover-arrow-outer-width; + right: -$popover-arrow-width; border-left-color: $popover-arrow-outer-color; } .arrow::after { - right: -($popover-arrow-outer-width - 1); + right: calc((#{$popover-arrow-width} - #{$popover-border-width}) * -1); border-left-color: $popover-arrow-color; } } diff --git a/assets/stylesheets/bootstrap/_variables.scss b/assets/stylesheets/bootstrap/_variables.scss index 1808e4b..0615f35 100644 --- a/assets/stylesheets/bootstrap/_variables.scss +++ b/assets/stylesheets/bootstrap/_variables.scss @@ -62,16 +62,25 @@ $colors: map-merge(( "gray-dark": $gray-800 ), $colors); +$primary: $blue !default; +$secondary: $gray-600 !default; +$success: $green !default; +$info: $cyan !default; +$warning: $yellow !default; +$danger: $red !default; +$light: $gray-100 !default; +$dark: $gray-800 !default; + $theme-colors: () !default; $theme-colors: map-merge(( - "primary": $blue, - "secondary": $gray-600, - "success": $green, - "info": $cyan, - "warning": $yellow, - "danger": $red, - "light": $gray-100, - "dark": $gray-800 + "primary": $primary, + "secondary": $secondary, + "success": $success, + "info": $info, + "warning": $warning, + "danger": $danger, + "light": $light, + "dark": $dark ), $theme-colors); // stylelint-enable @@ -213,8 +222,8 @@ $font-family-base: $font-family-sans-serif !default; // stylelint-enable value-keyword-case $font-size-base: 1rem !default; // Assumes the browser default, typically `16px` -$font-size-lg: 1.25rem !default; -$font-size-sm: .875rem !default; +$font-size-lg: ($font-size-base * 1.25) !default; +$font-size-sm: ($font-size-base * .875) !default; $font-weight-light: 300 !default; $font-weight-normal: 400 !default; @@ -223,17 +232,17 @@ $font-weight-bold: 700 !default; $font-weight-base: $font-weight-normal !default; $line-height-base: 1.5 !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; +$h1-font-size: $font-size-base * 2.5 !default; +$h2-font-size: $font-size-base * 2 !default; +$h3-font-size: $font-size-base * 1.75 !default; +$h4-font-size: $font-size-base * 1.5 !default; +$h5-font-size: $font-size-base * 1.25 !default; +$h6-font-size: $font-size-base !default; $headings-margin-bottom: ($spacer / 2) !default; $headings-font-family: inherit !default; $headings-font-weight: 500 !default; -$headings-line-height: 1.1 !default; +$headings-line-height: 1.2 !default; $headings-color: inherit !default; $display1-size: 6rem !default; @@ -247,7 +256,7 @@ $display3-weight: 300 !default; $display4-weight: 300 !default; $display-line-height: $headings-line-height !default; -$lead-font-size: 1.25rem !default; +$lead-font-size: ($font-size-base * 1.25) !default; $lead-font-weight: 300 !default; $small-font-size: 80% !default; @@ -305,6 +314,10 @@ $input-btn-padding-y: .375rem !default; $input-btn-padding-x: .75rem !default; $input-btn-line-height: $line-height-base !default; +$input-btn-focus-width: .2rem !default; +$input-btn-focus-color: rgba(theme-color("primary"), .25) !default; +$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default; + $input-btn-padding-y-sm: .25rem !default; $input-btn-padding-x-sm: .5rem !default; $input-btn-line-height-sm: $line-height-sm !default; @@ -315,7 +328,6 @@ $input-btn-line-height-lg: $line-height-lg !default; $btn-font-weight: $font-weight-normal !default; $btn-box-shadow: inset 0 1px 0 rgba($white,.15), 0 1px 1px rgba($black,.075) !default; -$btn-focus-box-shadow: 0 0 0 3px rgba(theme-color("primary"), .25) !default; $btn-active-box-shadow: inset 0 3px 5px rgba($black,.125) !default; $btn-link-disabled-color: $gray-600 !default; @@ -346,7 +358,6 @@ $input-border-radius-sm: $border-radius-sm !default; $input-focus-bg: $input-bg !default; $input-focus-border-color: lighten(theme-color("primary"), 25%) !default; -$input-focus-box-shadow: $input-box-shadow, $btn-focus-box-shadow !default; $input-focus-color: $input-color !default; $input-placeholder-color: $gray-600 !default; @@ -395,7 +406,7 @@ $custom-control-indicator-checked-color: $white !default; $custom-control-indicator-checked-bg: theme-color("primary") !default; $custom-control-indicator-checked-box-shadow: none !default; -$custom-control-indicator-focus-box-shadow: 0 0 0 1px $body-bg, 0 0 0 3px theme-color("primary") !default; +$custom-control-indicator-focus-box-shadow: 0 0 0 1px $body-bg, $input-btn-focus-box-shadow !default; $custom-control-indicator-active-color: $white !default; $custom-control-indicator-active-bg: lighten(theme-color("primary"), 35%) !default; @@ -530,9 +541,9 @@ $navbar-padding-x: $spacer !default; $navbar-brand-font-size: $font-size-lg !default; // Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link -$nav-link-height: $navbar-brand-font-size * $line-height-base !default; -$navbar-brand-height: ($font-size-base * $line-height-base + $nav-link-padding-y * 2) !default; -$navbar-brand-padding-y: ($navbar-brand-height - $nav-link-height) / 2 !default; +$nav-link-height: ($font-size-base * $line-height-base + $nav-link-padding-y * 2) !default; +$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default; +$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) / 2 !default; $navbar-toggler-padding-y: .25rem !default; $navbar-toggler-padding-x: .75rem !default; @@ -626,27 +637,25 @@ $tooltip-arrow-color: $tooltip-bg !default; // Popovers -$popover-inner-padding: 1px !default; $popover-bg: $white !default; $popover-max-width: 276px !default; $popover-border-width: $border-width !default; $popover-border-color: rgba($black,.2) !default; -$popover-box-shadow: 0 5px 10px rgba($black,.2) !default; +$popover-box-shadow: 0 .25rem .5rem rgba($black,.2) !default; $popover-header-bg: darken($popover-bg, 3%) !default; $popover-header-color: $headings-color !default; -$popover-header-padding-y: 8px !default; -$popover-header-padding-x: 14px !default; +$popover-header-padding-y: .5rem !default; +$popover-header-padding-x: .75rem !default; $popover-body-color: $body-color !default; -$popover-body-padding-y: 9px !default; -$popover-body-padding-x: 14px !default; +$popover-body-padding-y: $popover-header-padding-y !default; +$popover-body-padding-x: $popover-header-padding-x !default; -$popover-arrow-width: 10px !default; -$popover-arrow-height: 5px !default; +$popover-arrow-width: .8rem !default; +$popover-arrow-height: .4rem !default; $popover-arrow-color: $popover-bg !default; -$popover-arrow-outer-width: ($popover-arrow-width + 1px) !default; $popover-arrow-outer-color: fade-in($popover-border-color, .05) !default; @@ -710,7 +719,7 @@ $alert-border-width: $border-width !default; // Progress bars $progress-height: 1rem !default; -$progress-font-size: .75rem !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; diff --git a/assets/stylesheets/bootstrap/mixins/_alert.scss b/assets/stylesheets/bootstrap/mixins/_alert.scss index d938e89..db5a7eb 100644 --- a/assets/stylesheets/bootstrap/mixins/_alert.scss +++ b/assets/stylesheets/bootstrap/mixins/_alert.scss @@ -1,6 +1,6 @@ @mixin alert-variant($background, $border, $color) { color: $color; - background-color: $background; + @include gradient-bg($background); border-color: $border; hr { diff --git a/assets/stylesheets/bootstrap/mixins/_background-variant.scss b/assets/stylesheets/bootstrap/mixins/_background-variant.scss index 5860d73..7d1bc97 100644 --- a/assets/stylesheets/bootstrap/mixins/_background-variant.scss +++ b/assets/stylesheets/bootstrap/mixins/_background-variant.scss @@ -12,3 +12,9 @@ } } } + +@mixin bg-gradient-variant($parent, $color) { + #{$parent} { + background: $color linear-gradient(180deg, mix($body-bg, $color, 15%), $color) repeat-x !important; + } +} diff --git a/assets/stylesheets/bootstrap/mixins/_badge.scss b/assets/stylesheets/bootstrap/mixins/_badge.scss index 257a6ab..eeca0b4 100644 --- a/assets/stylesheets/bootstrap/mixins/_badge.scss +++ b/assets/stylesheets/bootstrap/mixins/_badge.scss @@ -1,10 +1,10 @@ @mixin badge-variant($bg) { - @include color-yiq($bg); + color: color-yiq($bg); background-color: $bg; &[href] { @include hover-focus { - @include color-yiq($bg); + color: color-yiq($bg); text-decoration: none; background-color: darken($bg, 10%); } diff --git a/assets/stylesheets/bootstrap/mixins/_buttons.scss b/assets/stylesheets/bootstrap/mixins/_buttons.scss index 7ce8fef..9e06261 100644 --- a/assets/stylesheets/bootstrap/mixins/_buttons.scss +++ b/assets/stylesheets/bootstrap/mixins/_buttons.scss @@ -3,25 +3,25 @@ // Easily pump out default styles, as well as :hover, :focus, :active, // and disabled options for all buttons -@mixin button-variant($background, $border, $active-background: darken($background, 7.5%), $active-border: darken($border, 10%)) { - @include color-yiq($background); - background-color: $background; +@mixin button-variant($background, $border, $hover-background: darken($background, 7.5%), $hover-border: darken($border, 10%), $active-background: darken($background, 10%), $active-border: darken($border, 12.5%)) { + color: color-yiq($background); + @include gradient-bg($background); border-color: $border; @include box-shadow($btn-box-shadow); @include hover { - @include color-yiq($active-background); - background-color: $active-background; - border-color: $active-border; + color: color-yiq($hover-background); + @include gradient-bg($hover-background); + border-color: $hover-border; } &:focus, &.focus { // Avoid using mixin so we can pass custom focus shadow properly @if $enable-shadows { - box-shadow: $btn-box-shadow, 0 0 0 3px rgba($border, .5); + box-shadow: $btn-box-shadow, 0 0 0 $input-btn-focus-width rgba($border, .5); } @else { - box-shadow: 0 0 0 3px rgba($border, .5); + box-shadow: 0 0 0 $input-btn-focus-width rgba($border, .5); } } @@ -35,10 +35,19 @@ &:not([disabled]):not(.disabled):active, &:not([disabled]):not(.disabled).active, .show > &.dropdown-toggle { + color: color-yiq($active-background); background-color: $active-background; - background-image: none; // Remove the gradient for the pressed/active state + @if $enable-gradients { + background-image: none; // Remove the gradient for the pressed/active state + } border-color: $active-border; - @include box-shadow($btn-active-box-shadow); + + // Avoid using mixin so we can pass custom focus shadow properly + @if $enable-shadows { + box-shadow: $btn-active-box-shadow, 0 0 0 $input-btn-focus-width rgba($border, .5); + } @else { + box-shadow: 0 0 0 $input-btn-focus-width rgba($border, .5); + } } } @@ -56,7 +65,7 @@ &:focus, &.focus { - box-shadow: 0 0 0 3px rgba($color, .5); + box-shadow: 0 0 0 $input-btn-focus-width rgba($color, .5); } &.disabled, @@ -71,6 +80,8 @@ color: $color-hover; background-color: $color; border-color: $color; + // Avoid using mixin so we can pass custom focus shadow properly + box-shadow: 0 0 0 $input-btn-focus-width rgba($color, .5); } } diff --git a/assets/stylesheets/bootstrap/mixins/_forms.scss b/assets/stylesheets/bootstrap/mixins/_forms.scss index 6403f46..19d5280 100644 --- a/assets/stylesheets/bootstrap/mixins/_forms.scss +++ b/assets/stylesheets/bootstrap/mixins/_forms.scss @@ -16,7 +16,12 @@ background-color: $input-focus-bg; border-color: $input-focus-border-color; outline: none; - @include box-shadow($input-focus-box-shadow); + // Avoid using mixin so we can pass custom focus shadow properly + @if $enable-shadows { + box-shadow: $input-box-shadow, $input-btn-focus-box-shadow; + } @else { + box-shadow: $input-btn-focus-box-shadow; + } } } diff --git a/assets/stylesheets/bootstrap/mixins/_gradients.scss b/assets/stylesheets/bootstrap/mixins/_gradients.scss index bad79f9..ecd01f7 100644 --- a/assets/stylesheets/bootstrap/mixins/_gradients.scss +++ b/assets/stylesheets/bootstrap/mixins/_gradients.scss @@ -1,5 +1,13 @@ // Gradients +@mixin gradient-bg($color) { + @if $enable-gradients { + background: $color linear-gradient(180deg, mix($body-bg, $color, 15%), $color) repeat-x; + } @else { + background-color: $color; + } +} + // Horizontal gradient, from left to right // // Creates two color stops, start and end, by specifying a color and position for each color stop. diff --git a/assets/stylesheets/bootstrap/utilities/_background.scss b/assets/stylesheets/bootstrap/utilities/_background.scss index 3d2e07d..1f18b2f 100644 --- a/assets/stylesheets/bootstrap/utilities/_background.scss +++ b/assets/stylesheets/bootstrap/utilities/_background.scss @@ -4,6 +4,12 @@ @include bg-variant(".bg-#{$color}", $value); } +@if $enable-gradients { + @each $color, $value in $theme-colors { + @include bg-gradient-variant(".bg-gradient-#{$color}", $value); + } +} + .bg-white { background-color: $white !important; } |