Skip to content

Commit 5531751

Browse files
committed
refactor: drop node-sass support and migrate to CSS logical properties and values
1 parent f9409fe commit 5531751

File tree

2 files changed

+14
-18
lines changed

2 files changed

+14
-18
lines changed

src/scss/examples.scss

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@
22
@use "@coreui/coreui/scss/variables" as * with (
33
$enable-deprecation-messages: false
44
);
5-
@use "@coreui/coreui/scss/mixins" as *;
5+
@use "@coreui/coreui/scss/mixins/breakpoints" as *;
6+
@use "@coreui/coreui/scss/mixins/color-mode" as *;
67

78
.example {
89
&:not(:first-child) {
@@ -106,10 +107,8 @@
106107
}
107108
}
108109

109-
@if $enable-dark-mode {
110-
@include color-mode(dark) {
111-
.example .tab-content {
112-
background-color: var(--#{$prefix}secondary-bg) !important;
113-
}
110+
@include color-mode(dark) {
111+
.example .tab-content {
112+
background-color: var(--#{$prefix}secondary-bg) !important;
114113
}
115114
}

src/scss/style.scss

Lines changed: 9 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,7 @@ body {
99

1010
.wrapper {
1111
width: 100%;
12-
@include ltr-rtl("padding-left", var(--cui-sidebar-occupy-start, 0));
13-
@include ltr-rtl("padding-right", var(--cui-sidebar-occupy-end, 0));
12+
padding-inline: var(--cui-sidebar-occupy-start, 0) var(--cui-sidebar-occupy-end, 0);
1413
will-change: auto;
1514
@include transition(padding .15s);
1615
}
@@ -38,13 +37,13 @@ body {
3837
}
3938

4039
.sidebar-toggler {
41-
@include ltr-rtl("margin-left", auto);
40+
margin-inline-start: auto;
4241
}
4342

4443
.sidebar-narrow,
4544
.sidebar-narrow-unfoldable:not(:hover) {
4645
.sidebar-toggler {
47-
@include ltr-rtl("margin-right", auto);
46+
margin-inline-end: auto;
4847
}
4948
}
5049

@@ -56,14 +55,12 @@ body {
5655
min-height: calc(3rem + 1px); // stylelint-disable-line function-disallowed-list
5756
}
5857

59-
@if $enable-dark-mode {
60-
@include color-mode(dark) {
61-
body {
62-
background-color: var(--cui-dark-bg-subtle);
63-
}
58+
@include color-mode(dark) {
59+
body {
60+
background-color: var(--cui-dark-bg-subtle);
61+
}
6462

65-
.footer {
66-
--cui-footer-bg: var(--cui-body-bg);
67-
}
63+
.footer {
64+
--cui-footer-bg: var(--cui-body-bg);
6865
}
6966
}

0 commit comments

Comments
 (0)