fix: fix sass v16 deprecation warnings (#858)

thegeeklab · Aug 5, 2024 · bb0daae · bb0daae
1 parent baa9310
commit bb0daae
Show file tree

Hide file tree

Showing 4 changed files with 35 additions and 32 deletions.
diff --git a/src/sass/_asciidoc.scss b/src/sass/_asciidoc.scss
@@ -7,11 +7,13 @@
     }
   }
 
-  margin: $padding-16 0;
-  padding: 0;
+  & {
+    margin: $padding-16 0;
+    padding: 0;
 
-  border-left: $border-4 solid var(--accent-color);
-  border-radius: $border-radius;
+    border-left: $border-4 solid var(--accent-color);
+    border-radius: $border-radius;
+  }
 
   table {
     margin: 0 !important;
@@ -22,6 +24,9 @@
     }
 
     td {
+      display: block;
+      padding: $padding-4 $padding-16 !important;
+
       &:first-child {
         background-color: scale-color($gray-600, $alpha: -95%);
         font-weight: bold;
@@ -53,9 +58,6 @@
           }
         }
       }
-
-      display: block;
-      padding: $padding-4 $padding-16 !important;
     }
   }
 }
diff --git a/src/sass/_color_mode.scss b/src/sass/_color_mode.scss
@@ -110,27 +110,31 @@
 @mixin code_theme_dark {
   @include chroma_dark;
 
-  --code-background: #{$code-background-dark};
-  --code-accent-color: #{darken($code-background-dark, 4)};
-  --code-accent-color-lite: #{darken($code-background-dark, 2)};
-  --code-font-color: #{$code-font-color-dark};
-
-  --code-copy-background: #{$code-background-dark};
-  --code-copy-font-color: #{darken($code-font-color-dark, 15)};
-  --code-copy-border-color: #{darken($code-font-color-dark, 20)};
-  --code-copy-success-color: #{scale-color(map.get($hint-colors, "ok"), $alpha: -55%)};
+  & {
+    --code-background: #{$code-background-dark};
+    --code-accent-color: #{darken($code-background-dark, 4)};
+    --code-accent-color-lite: #{darken($code-background-dark, 2)};
+    --code-font-color: #{$code-font-color-dark};
+
+    --code-copy-background: #{$code-background-dark};
+    --code-copy-font-color: #{darken($code-font-color-dark, 15)};
+    --code-copy-border-color: #{darken($code-font-color-dark, 20)};
+    --code-copy-success-color: #{scale-color(map.get($hint-colors, "ok"), $alpha: -55%)};
+  }
 }
 
 @mixin code_theme_light {
   @include chroma_github;
 
-  --code-background: #{$code-background};
-  --code-accent-color: #{darken($code-background, 6)};
-  --code-accent-color-lite: #{darken($code-background, 2)};
-  --code-font-color: #{$code-font-color};
+  & {
+    --code-background: #{$code-background};
+    --code-accent-color: #{darken($code-background, 6)};
+    --code-accent-color-lite: #{darken($code-background, 2)};
+    --code-font-color: #{$code-font-color};
 
-  --code-copy-background: #{$code-background};
-  --code-copy-font-color: #{lighten($code-font-color, 15)};
-  --code-copy-border-color: #{lighten($code-font-color, 20)};
-  --code-copy-success-color: #{map.get($hint-colors, "ok")};
+    --code-copy-background: #{$code-background};
+    --code-copy-font-color: #{lighten($code-font-color, 15)};
+    --code-copy-border-color: #{lighten($code-font-color, 20)};
+    --code-copy-success-color: #{map.get($hint-colors, "ok")};
+  }
 }
diff --git a/src/sass/_markdown.scss b/src/sass/_markdown.scss
@@ -186,6 +186,7 @@
   }
 
   &__align {
+    text-align: left;
     &--left {
       h1,
       h2,
@@ -195,10 +196,10 @@
       h6 {
         justify-content: flex-start;
       }
-      text-align: left;
     }
 
     &--center {
+      text-align: center;
       h1,
       h2,
       h3,
@@ -207,10 +208,10 @@
       h6 {
         justify-content: center;
       }
-      text-align: center;
     }
 
     &--right {
+      text-align: right;
       h1,
       h2,
       h3,
@@ -219,7 +220,6 @@
       h6 {
         justify-content: flex-end;
       }
-      text-align: right;
     }
   }
 }
diff --git a/webpack.config.js b/webpack.config.js
@@ -142,12 +142,9 @@ module.exports = (env, argv) => {
           {
             loader: "sass-loader",
             options: {
+              sourceMap: argv.mode === "development" ? true : false,
               sassOptions: {
-                // FIXME: https://github.com/webpack-contrib/sass-loader/issues/962#issuecomment-1002675051
-                sourceMap: argv.mode === "development" ? true : false,
-                sourceMapEmbed: argv.mode === "development" ? true : false,
-                outputStyle: argv.mode === "development" ? "expanded" : "compressed",
-                includePaths: [nodeModulesPath]
+                outputStyle: argv.mode === "development" ? "expanded" : "compressed"
               }
             }
           }