Skip to content

Commit add3409

Browse files
mrholekmrholek
committed
refactor: update variables and improve syntax
1 parent 6845419 commit add3409

File tree

3 files changed

+33
-32
lines changed

3 files changed

+33
-32
lines changed

‎scss/_variables.scss

Lines changed: 32 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1303,28 +1303,29 @@ $navbar-toggler-font-size: $font-size-lg !default;
13031303
$navbar-toggler-border-radius: $btn-border-radius !default;
13041304
$navbar-toggler-focus-width: $btn-focus-width !default;
13051305
$navbar-toggler-transition: box-shadow .15s ease-in-out !default;
1306-
// scss-docs-end navbar-variables
1307-
1308-
// scss-docs-start navbar-theme-variables
1309-
$navbar-dark-color: $medium-emphasis-inverse !default;
1310-
$navbar-dark-hover-color: $high-emphasis-inverse !default;
1311-
$navbar-dark-active-color: $high-emphasis-inverse !default;
1312-
$navbar-dark-disabled-color: $disabled-inverse !default;
1313-
$navbar-dark-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
1314-
$navbar-dark-toggler-border-color: rgba($white, .1) !default;
13151306

1316-
$navbar-light-color: $medium-emphasis !default;
1317-
$navbar-light-hover-color: $high-emphasis !default;
1318-
$navbar-light-active-color: $high-emphasis !default;
1319-
$navbar-light-disabled-color: $disabled !default;
1320-
$navbar-light-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-light-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
1321-
$navbar-light-toggler-border-color: rgba($black, .1) !default;
1307+
$navbar-light-color: rgba(var(--#{$prefix}emphasis-color-rgb), .65) !default;
1308+
$navbar-light-hover-color: rgba(var(--#{$prefix}emphasis-color-rgb), .8) !default;
1309+
$navbar-light-active-color: rgba(var(--#{$prefix}emphasis-color-rgb), 1) !default;
1310+
$navbar-light-disabled-color: rgba(var(--#{$prefix}emphasis-color-rgb), .3) !default;
1311+
$navbar-light-icon-color: rgba($body-color, .75) !default;
1312+
$navbar-light-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-light-icon-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
1313+
$navbar-light-toggler-border-color: rgba(var(--#{$prefix}emphasis-color-rgb), .15) !default;
1314+
$navbar-light-brand-color: $navbar-light-active-color !default;
1315+
$navbar-light-brand-hover-color: $navbar-light-active-color !default;
1316+
// scss-docs-end navbar-variables
13221317

1323-
$navbar-light-brand-color: $navbar-light-active-color !default;
1324-
$navbar-light-brand-hover-color: $navbar-light-active-color !default;
1325-
$navbar-dark-brand-color: $navbar-dark-active-color !default;
1326-
$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
1327-
// scss-docs-end navbar-theme-variables
1318+
// scss-docs-start navbar-dark-variables
1319+
$navbar-dark-color: rgba($white, .55) !default;
1320+
$navbar-dark-hover-color: rgba($white, .75) !default;
1321+
$navbar-dark-active-color: $white !default;
1322+
$navbar-dark-disabled-color: rgba($white, .25) !default;
1323+
$navbar-dark-icon-color: $navbar-dark-color !default;
1324+
$navbar-dark-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-icon-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
1325+
$navbar-dark-toggler-border-color: rgba($white, .1) !default;$navbar-dark-toggler-border-color: rgba($white, .1) !default;
1326+
$navbar-dark-brand-color: $navbar-dark-active-color !default;
1327+
$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
1328+
// scss-docs-end navbar-dark-variables
13281329

13291330

13301331
// Dropdowns
@@ -1461,19 +1462,19 @@ $card-group-margin: $grid-gutter-width * .5 !default;
14611462
// scss-docs-start accordion-variables
14621463
$accordion-padding-y: 1rem !default;
14631464
$accordion-padding-x: 1.25rem !default;
1464-
$accordion-color: $body-color !default; // Sass variable because of $accordion-button-icon
1465-
$accordion-bg: $body-bg !default;
1466-
$accordion-border-width: $border-width !default;
1465+
$accordion-color: var(--#{$prefix}body-color) !default;
1466+
$accordion-bg: var(--#{$prefix}body-bg) !default;
1467+
$accordion-border-width: var(--#{$prefix}border-width) !default;
14671468
$accordion-border-color: var(--#{$prefix}border-color) !default;
1468-
$accordion-border-radius: $border-radius !default;
1469+
$accordion-border-radius: var(--#{$prefix}border-radius) !default;
14691470
$accordion-inner-border-radius: subtract($accordion-border-radius, $accordion-border-width) !default;
14701471

14711472
$accordion-body-padding-y: $accordion-padding-y !default;
14721473
$accordion-body-padding-x: $accordion-padding-x !default;
14731474

14741475
$accordion-button-padding-y: $accordion-padding-y !default;
14751476
$accordion-button-padding-x: $accordion-padding-x !default;
1476-
$accordion-button-color: $accordion-color !default;
1477+
$accordion-button-color: var(--#{$prefix}body-color) !default;
14771478
$accordion-button-bg: var(--#{$prefix}accordion-bg) !default;
14781479
$accordion-transition: $btn-transition, border-radius .15s ease !default;
14791480
$accordion-button-active-bg: tint-color($component-active-bg, 90%) !default;
@@ -1549,7 +1550,7 @@ $popover-arrow-height: .5rem !default;
15491550
// scss-docs-end popover-variables
15501551

15511552
// fusv-disable
1552-
// Deprecated in Bootstrap 5.2.0 for CSS variables
1553+
// Deprecated in 4.2.0 for CSS variables
15531554
$popover-arrow-color: $popover-bg !default;
15541555
$popover-arrow-outer-color: var(--#{$prefix}border-color-translucent) !default;
15551556
// fusv-enable
@@ -1788,8 +1789,10 @@ $header-toggler-bg: transparent !default;
17881789
$header-toggler-border-radius: $btn-border-radius !default;
17891790
$header-toggler-hover-color: rgba(var(--#{$prefix}emphasis-color-rgb), 1) !default;
17901791

1791-
$header-toggler-icon-bg: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='currentColor' stroke-width='2.25' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !default;
1792-
$header-toggler-hover-icon-bg: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='currentColor' stroke-width='2.25' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !default;
1792+
$header-toggler-icon-color: currentColor !default; // stylelint-disable-line value-keyword-case
1793+
$header-toggler-icon-bg: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$header-toggler-icon-color}' stroke-width='2.25' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !default;
1794+
$header-toggler-hover-icon-color: currentColor !default; // stylelint-disable-line value-keyword-case
1795+
$header-toggler-hover-icon-bg: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$header-toggler-hover-icon-color}' stroke-width='2.25' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !default;
17931796

17941797
$header-nav-link-padding-x: .5rem !default;
17951798
$header-nav-link-padding-y: .5rem !default;
@@ -1990,7 +1993,7 @@ $sidebar-toggler-indicator-hover-icon: url("data:image/svg+xml;charset=utf8,
19901993
$footer-min-height: 3rem !default;
19911994
$footer-padding-y: $spacer * .5 !default;
19921995
$footer-padding-x: $spacer !default;
1993-
$footer-bg: $gray-100 !default;
1996+
$footer-bg: var(--#{$prefix}tertiary-bg) !default;
19941997
$footer-color: var(--#{$prefix}body-color) !default;
19951998
$footer-border-width: var(--#{$prefix}border-width) !default;
19961999
$footer-border-color: var(--#{$prefix}border-color) !default;

‎scss/coreui-grid.scss

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,16 +8,13 @@ $include-column-box-sizing: true !default;
88
@import "maps";
99

1010
@import "mixins/ltr-rtl";
11-
@import "mixins/lists";
1211
@import "mixins/breakpoints";
1312
@import "mixins/container";
1413
@import "mixins/grid";
1514
@import "mixins/utilities";
1615

1716
@import "vendor/rfs";
1817

19-
@import "root";
20-
2118
@import "containers";
2219
@import "grid";
2320

‎scss/coreui-reboot.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33

44
@import "functions";
55
@import "variables";
6+
@import "maps";
67
@import "mixins";
78
@import "root";
89
@import "reboot";

0 commit comments

Comments
 (0)