diff options
| author | Martijn Cuppens <[email protected]> | 2020-04-14 17:28:20 +0300 |
|---|---|---|
| committer | XhmikosR <[email protected]> | 2020-05-15 15:03:12 +0300 |
| commit | b531bda07cbea2e124194aefe3b8597b3ac2578e (patch) | |
| tree | 0c39842174e325622e65cbafe5e31b512e464500 /scss/forms | |
| parent | bbeda10e372f33e80fbc2095a71d5a1fc86f8e30 (diff) | |
| download | bootstrap-b531bda07cbea2e124194aefe3b8597b3ac2578e.tar.xz bootstrap-b531bda07cbea2e124194aefe3b8597b3ac2578e.zip | |
Improve gradients
- Use a semitransparent gradient from light to dark which works on any background-color
- Store the gradient as a custom property (--bs-gradient)
- Remove `.bg-gradient-*` variants in favour of `.bg-gradient` which works even when `$enable-gradients` are enabled
- Add gradients to navbar, active page links and badges when gradients are enabled
Diffstat (limited to 'scss/forms')
| -rw-r--r-- | scss/forms/_form-check.scss | 6 |
1 files changed, 3 insertions, 3 deletions
diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss index 31f554a41..7f4f3cb0f 100644 --- a/scss/forms/_form-check.scss +++ b/scss/forms/_form-check.scss @@ -53,7 +53,7 @@ &[type="checkbox"] { @if $enable-gradients { - background-image: escape-svg($form-check-input-checked-bg-image), linear-gradient(180deg, lighten($form-check-input-checked-bg-color, 10%), $form-check-input-checked-bg-color); + background-image: escape-svg($form-check-input-checked-bg-image), var(--bs-gradient); } @else { background-image: escape-svg($form-check-input-checked-bg-image); } @@ -61,7 +61,7 @@ &[type="radio"] { @if $enable-gradients { - background-image: escape-svg($form-check-radio-checked-bg-image), linear-gradient(180deg, lighten($form-check-input-checked-bg-color, 10%), $form-check-input-checked-bg-color); + background-image: escape-svg($form-check-radio-checked-bg-image), var(--bs-gradient); } @else { background-image: escape-svg($form-check-radio-checked-bg-image); } @@ -73,7 +73,7 @@ border-color: $form-check-input-indeterminate-border-color; @if $enable-gradients { - background-image: escape-svg($form-check-input-indeterminate-bg-image), linear-gradient(180deg, lighten($form-check-input-checked-bg-color, 10%), $form-check-input-checked-bg-color); + background-image: escape-svg($form-check-input-indeterminate-bg-image), var(--bs-gradient); } @else { background-image: escape-svg($form-check-input-indeterminate-bg-image); } |