Use adjust-color instead of color.adjust

- https://sass-lang.com/documentation/modules/color/#adjust
yous · Oct 15, 2024 · 78fa249 · 78fa249
1 parent 79e23fd
commit 78fa249
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 10 deletions.
diff --git a/_sass/whiteglass.scss b/_sass/whiteglass.scss
@@ -1,5 +1,3 @@
-@use "sass:color";
-
 // Define defaults for each variable.
 $base-font-family: Bitter, "Apple SD Gothic Neo", "Noto Sans", "Source Han Sans", "Noto Sans CJK JP", "Source Han Sans JP", "Noto Sans CJK KR", "Source Han Sans KR", NanumBarunGothic, AppleGothic, "Malgun Gothic", Dotum, sans-serif !default;
 $monospace-font-family: Monaco, Menlo, Consolas, "Courier New", DotumChe, monospace !default;
@@ -15,8 +13,8 @@ $background-color: #fdfdfd !default;
 $brand-color:      #2568ba !default;
 
 $grey-color:       #757575 !default;
-$grey-color-light: color.adjust($grey-color, $lightness: 45%) !default;
-$grey-color-dark:  color.adjust($grey-color, $lightness: -20%) !default;
+$grey-color-light: adjust-color($grey-color, $lightness: 45%) !default;
+$grey-color-dark:  adjust-color($grey-color, $lightness: -20%) !default;
 
 // Width of the content area
 $content-width:    800px !default;

diff --git a/_sass/whiteglass/_base.scss b/_sass/whiteglass/_base.scss
@@ -1,5 +1,3 @@
-@use "sass:color";
-
 /**
  * Reset some basic elements
  */
@@ -112,7 +110,7 @@ a {
   text-decoration: none;
 
   &:visited {
-    color: color.adjust($brand-color, $lightness: -10%);
+    color: adjust-color($brand-color, $lightness: -10%);
   }
 
   &:hover {

diff --git a/assets/main.scss b/assets/main.scss
@@ -2,7 +2,6 @@
 # Only the main Sass file needs front matter (the dashes are enough)
 ---
 @charset "utf-8";
-@use "sass:color";
 
 // Our variables
 $base-font-family: Bitter, "Apple SD Gothic Neo", AppleGothic, NanumBarunGothic, "Malgun Gothic", Dotum, sans-serif;
@@ -19,8 +18,8 @@ $background-color: #fdfdfd;
 $brand-color:      #2568ba;
 
 $grey-color:       #757575;
-$grey-color-light: color.adjust($grey-color, $lightness: 45%);
-$grey-color-dark:  color.adjust($grey-color, $lightness: -20%);
+$grey-color-light: adjust-color($grey-color, $lightness: 45%);
+$grey-color-dark:  adjust-color($grey-color, $lightness: -20%);
 
 // Width of the content area
 $content-width:    800px;