refactor: update the sass mixed declarations (cotes2020#1872)

classicrocker883 · cotes2020 · commit 7cf3e6b80a1c · 2024-08-12T22:18:55.000+08:00
See: https://sass-lang.com/d/mixed-decls
diff --git a/_sass/addon/commons.scss b/_sass/addon/commons.scss
@@ -1,6 +1,8 @@
 /* The common styles */
 
 html {
+  font-size: 16px;
+
   @media (prefers-color-scheme: light) {
     &:not([data-mode]),
     &[data-mode='light'] {
@@ -22,8 +24,6 @@ html {
       @include light-scheme;
     }
   }
-
-  font-size: 16px;
 }
 
 body {
@@ -218,13 +218,13 @@ i {
 
 #access-lastmod {
   a {
+    color: inherit;
+
     &:hover {
       @extend %link-hover;
     }
 
     @extend %no-bottom-border;
-
-    color: inherit;
   }
 }
 
@@ -682,15 +682,15 @@ $btn-mb: 0.5rem;
   background: var(--sidebar-bg);
   border-right: 1px solid var(--sidebar-border-color);
 
+  /* Hide scrollbar for IE, Edge and Firefox */
+  -ms-overflow-style: none; /* IE and Edge */
+  scrollbar-width: none; /* Firefox */
+
   /* Hide scrollbar for Chrome, Safari and Opera */
   &::-webkit-scrollbar {
     display: none;
   }
 
-  /* Hide scrollbar for IE, Edge and Firefox */
-  -ms-overflow-style: none; /* IE and Edge */
-  scrollbar-width: none; /* Firefox */
-
   %sidebar-link-hover {
     &:hover {
       color: var(--sidebar-active-color);
@@ -1036,16 +1036,16 @@ search {
   padding-bottom: 3rem;
 
   a {
+    font-size: 1.4rem;
+    line-height: 2.5rem;
+
     &:hover {
       @extend %link-hover;
     }
 
     @extend %link-color;
     @extend %no-bottom-border;
     @extend %heading;
-
-    font-size: 1.4rem;
-    line-height: 2.5rem;
   }
 
   > article {
diff --git a/_sass/addon/syntax.scss b/_sass/addon/syntax.scss
@@ -50,13 +50,13 @@ html {
   @extend %rounded;
   @extend %code-snippet-bg;
 
+  overflow: auto;
+  padding-bottom: 0.75rem;
+
   @at-root figure#{&} {
     @extend %code-snippet-bg;
   }
 
-  overflow: auto;
-  padding-bottom: 0.75rem;
-
   pre {
     margin-bottom: 0;
     font-size: $code-font-size;
diff --git a/_sass/colors/typography-dark.scss b/_sass/colors/typography-dark.scss
@@ -84,27 +84,29 @@
   --prompt-danger-bg: rgb(86, 28, 8, 0.8);
   --prompt-danger-icon-color: #cd0202;
 
-  /* tags */
+  /* Tags */
   --tag-border: rgb(59, 79, 88);
   --tag-shadow: rgb(32, 33, 33);
   --dash-color: rgb(63, 65, 68);
   --search-tag-bg: #292828;
 
-  /* categories */
+  /* Categories */
   --categories-border: rgb(64, 66, 69, 0.5);
   --categories-hover-bg: rgb(73, 75, 76);
   --categories-icon-hover-color: white;
 
-  /* archives */
+  /* Archive */
   --timeline-node-bg: rgb(150, 152, 156);
   --timeline-color: rgb(63, 65, 68);
   --timeline-year-dot-color: var(--timeline-color);
 
+  color-scheme: dark;
+
   .light {
     display: none;
   }
 
-  /* categories */
+  /* Categories */
   .categories.card,
   .list-group-item {
     background-color: var(--card-bg);
@@ -138,8 +140,6 @@
     );
   }
 
-  color-scheme: dark;
-
   /* stylelint-disable-next-line selector-id-pattern */
   #disqus_thread {
     color-scheme: none;
diff --git a/_sass/colors/typography-light.scss b/_sass/colors/typography-light.scss
@@ -92,14 +92,6 @@
   --tag-hover: rgb(222, 226, 230);
   --search-tag-bg: #f8f9fa;
 
-  [class^='prompt-'] {
-    --link-underline-color: rgb(219, 216, 216);
-  }
-
-  .dark {
-    display: none;
-  }
-
   /* Categories */
   --categories-border: rgba(0, 0, 0, 0.125);
   --categories-hover-bg: var(--btn-border-color);
@@ -109,4 +101,12 @@
   --timeline-color: rgba(0, 0, 0, 0.075);
   --timeline-node-bg: #c2c6cc;
   --timeline-year-dot-color: #ffffff;
+
+  [class^='prompt-'] {
+    --link-underline-color: rgb(219, 216, 216);
+  }
+
+  .dark {
+    display: none;
+  }
 } /* light-scheme */
