Replace import with forward and use

5 files changed, 18 insertions, 18 deletions

diff --git a/sass/_imports.scss b/sass/_imports.scss
index 6fd04b1..5dfb5a8 100644
--- a/sass/_imports.scss
+++ b/sass/_imports.scss
@@ -28,7 +28,7 @@
 
 @use "include/scroller"; // figure
 @use "include/button"; // button, a[role=button], type=button, type=submit ...
-@use "include/form"; // input, select, textarea, label, fieldset, legend (If you import this, you should also import button)
+@use "include/form"; // input, select, textarea, label, fieldset, legend (If you use this, you should also use button)
 @use "include/top"; // back to top button using only CSS
 
 @use "include/search"; // Zola Search - elasticlunr site-wide search
@@ -47,6 +47,6 @@
 //@use "fonts/FiraCode"; // Monospaced
 //@use "fonts/Abridge"; // Icon Font (don't recommend, CSS only icons are in my opinion better.)
 
-@import "colors/orange";
-//@import "colors/blue";
-//@import "colors/blueshade";
+@forward "colors/orange" as colors-*;
+//@forward "colors/blue" as colors-*;
+//@forward "colors/blueshade" as colors-*;
diff --git a/sass/abridge-auto.scss b/sass/abridge-auto.scss
index 146cd77..c7b7b4d 100644
--- a/sass/abridge-auto.scss
+++ b/sass/abridge-auto.scss
@@ -1,11 +1,11 @@
-@import "imports";
-@import "syntax/syntax-abridge-auto";
+@use "imports";
+@use "syntax/syntax-abridge-auto";
 
 :root {
-  @include dark;
+  @include imports.colors-dark;
 }
 @media (prefers-color-scheme: light) {
   :root {
-    @include light;
+    @include imports.colors-light;
   }
 }
diff --git a/sass/abridge-dark.scss b/sass/abridge-dark.scss
index 7a53a72..1c55ae6 100644
--- a/sass/abridge-dark.scss
+++ b/sass/abridge-dark.scss
@@ -1,6 +1,6 @@
-@import "imports";
-@import "syntax/syntax-abridge-dark";
+@use "imports";
+@use "syntax/syntax-abridge-dark";
 
 :root {
-  @include dark;
+  @include imports.colors-dark;
 }
diff --git a/sass/abridge-light.scss b/sass/abridge-light.scss
index 283384b..de96414 100644
--- a/sass/abridge-light.scss
+++ b/sass/abridge-light.scss
@@ -1,6 +1,6 @@
-@import "imports";
-@import "syntax/syntax-abridge-light";
+@use "imports";
+@use "syntax/syntax-abridge-light";
 
 :root {
-  @include light;
+  @include imports.colors-light;
 }
diff --git a/sass/abridge.scss b/sass/abridge.scss
index f92e0a4..e608d3a 100644
--- a/sass/abridge.scss
+++ b/sass/abridge.scss
@@ -1,9 +1,9 @@
-@import "imports";
-@import "syntax/syntax-abridge";
+@use "imports";
+@use "syntax/syntax-abridge";
 
 :root:not(.light) {
-  @include dark;
+  @include imports.colors-dark;
 }
 :root.light {
-  @include light;
+  @include imports.colors-light;
 }