fix: fix sass v16 deprecation warnings (#858)

src/sass/_asciidoc.scss

@@ -7,11 +7,13 @@
     }
   }
 
+  & {
     margin: $padding-16 0;
     padding: 0;
 
     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;
     }
   }
 }

src/sass/_color_mode.scss

@@ -110,6 +110,7 @@
 @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)};
@@ -119,11 +120,13 @@
     --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)};
@@ -133,4 +136,5 @@
     --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")};
+  }
 }

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;
     }
   }
 }

webpack.config.js

@@ -142,12 +142,9 @@ module.exports = (env, argv) => {
           {
             loader: "sass-loader",
             options: {
-              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]
+              sassOptions: {
+                outputStyle: argv.mode === "development" ? "expanded" : "compressed"
               }
             }
           }