Update .category-list-count style

stevenjoezhang · stevenjoezhang · commit 3d34a1163fee · 2024-04-17T12:17:02.000+08:00
diff --git a/source/css/_common/components/pages/categories.styl b/source/css/_common/components/pages/categories.styl
@@ -18,15 +18,8 @@
   }
 
   .category-list-count {
-    color: $grey;
-
-    &::before {
-      content: ' (';
-    }
-
-    &::after {
-      content: ') ';
-    }
+    font-size: $font-size-smallest;
+    badge();
   }
 
   .category-list-child {
diff --git a/source/css/_common/outline/header/menu.styl b/source/css/_common/outline/header/menu.styl
@@ -36,8 +36,7 @@
   }
 
   .badge {
-    font-weight: bold;
-    line-height: 1;
+    badge();
   }
 }
 
diff --git a/source/css/_mixins.styl b/source/css/_mixins.styl
@@ -281,3 +281,14 @@ menu-item-row() {
     margin-left: auto;
   }
 }
+
+badge() {
+  background: $badge-background;
+  border-radius: $badge-border-radius;
+  color: $badge-color;
+  font-weight: bold;
+  line-height: 1;
+  margin-left: .35em;
+  padding: $badge-padding;
+  text-shadow: $badge-text-shadow;
+}
diff --git a/source/css/_schemes/Mist/_menu.styl b/source/css/_schemes/Mist/_menu.styl
@@ -34,14 +34,5 @@
         menu-item-row();
       }
     }
-
-    .badge {
-      background: white;
-      border-radius: 10px;
-      color: $black-light;
-      margin-left: .35em;
-      padding: 1px 4px;
-      text-shadow: 1px 1px 0 rgba(0, 0, 0, .1);
-    }
   }
 }
diff --git a/source/css/_schemes/Muse/_menu.styl b/source/css/_schemes/Muse/_menu.styl
@@ -48,11 +48,4 @@
       width: 100%;
     }
   }
-
-  .badge {
-    background: $gainsboro;
-    color: $black-light;
-    margin-left: .35em;
-    padding: 1px 4px;
-  }
 }
diff --git a/source/css/_schemes/Pisces/_menu.styl b/source/css/_schemes/Pisces/_menu.styl
@@ -19,14 +19,6 @@
       display: none;
     }
   }
-
-  .badge {
-    background: $grey-light;
-    border-radius: 10px;
-    color: var(--content-bg-color);
-    padding: 2px 5px;
-    text-shadow: 1px 1px 0 rgba(0, 0, 0, .1);
-  }
 }
 
 if (not hexo-config('menu_settings.badges')) {
diff --git a/source/css/_variables/Mist.styl b/source/css/_variables/Mist.styl
@@ -25,3 +25,7 @@ $btn-default-hover-bg           = transparent;
 $btn-default-border-color       = var(--link-color);
 $btn-default-hover-color        = var(--link-hover-color);
 $btn-default-hover-border-color = var(--link-hover-color);
+
+$badge-background    = white;
+$badge-border-radius = 10px;
+$badge-text-shadow   = 1px 1px 0 rgba(0, 0, 0, .1);
diff --git a/source/css/_variables/Pisces.styl b/source/css/_variables/Pisces.styl
@@ -57,13 +57,19 @@ $site-state-item-name-color       = $grey-dark;
 // --------------------------------------------------
 
 // Button
-$btn-default-radius           = 2px;
-$btn-default-bg               = white;
-$btn-default-color            = $text-color;
-$btn-default-border-color     = $text-color;
-$btn-default-hover-bg         = $black-deep;
-$btn-default-hover-color      = white;
+$btn-default-radius       = 2px;
+$btn-default-bg           = white;
+$btn-default-color        = $text-color;
+$btn-default-border-color = $text-color;
+$btn-default-hover-bg     = $black-deep;
+$btn-default-hover-color  = white;
 
 // Back to top
-$b2t-opacity                  = .6;
-$b2t-opacity-hover            = .8;
+$b2t-opacity              = .6;
+$b2t-opacity-hover        = .8;
+
+$badge-background         = $grey-light;
+$badge-border-radius      = 10px;
+$badge-color              = var(--content-bg-color);
+$badge-padding            = 2px 5px;
+$badge-text-shadow        = 1px 1px 0 rgba(0, 0, 0, .1);
diff --git a/source/css/_variables/base.styl b/source/css/_variables/base.styl
@@ -387,3 +387,12 @@ $label = {
   warning : lighten(spin($note-border.warning, 10), 83% + $lbg),
   danger  : lighten(spin($note-border.danger, -10), 87% + $lbg)
 };
+
+
+// Badge colors
+// --------------------------------------------------
+$badge-padding = 1px 4px;
+$badge-border-radius = 0;
+$badge-background = $gainsboro;
+$badge-color = $black-light;
+$badge-text-shadow = none;

Original file line number	Diff line number	Diff line change
`@@ -36,8 +36,7 @@`
`36`	`36`	`}`
`37`	`37`
`38`	`38`	`.badge {`
`39`		`- font-weight: bold;`
`40`		`- line-height: 1;`
	`39`	`+ badge();`
`41`	`40`	`}`
`42`	`41`	`}`
`43`	`42`
Original file line number	Diff line number	Diff line change
`@@ -34,14 +34,5 @@`
`34`	`34`	`menu-item-row();`
`35`	`35`	`}`
`36`	`36`	`}`
`37`		`-`
`38`		`- .badge {`
`39`		`- background: white;`
`40`		`- border-radius: 10px;`
`41`		`- color: $black-light;`
`42`		`- margin-left: .35em;`
`43`		`- padding: 1px 4px;`
`44`		`- text-shadow: 1px 1px 0 rgba(0, 0, 0, .1);`
`45`		`- }`
`46`	`37`	`}`
`47`	`38`	`}`
Original file line number	Diff line number	Diff line change
`@@ -48,11 +48,4 @@`
`48`	`48`	`width: 100%;`
`49`	`49`	`}`
`50`	`50`	`}`
`51`		`-`
`52`		`- .badge {`
`53`		`- background: $gainsboro;`
`54`		`- color: $black-light;`
`55`		`- margin-left: .35em;`
`56`		`- padding: 1px 4px;`
`57`		`- }`
`58`	`51`	`}`
Original file line number	Diff line number	Diff line change
`@@ -19,14 +19,6 @@`
`19`	`19`	`display: none;`
`20`	`20`	`}`
`21`	`21`	`}`
`22`		`-`
`23`		`- .badge {`
`24`		`- background: $grey-light;`
`25`		`- border-radius: 10px;`
`26`		`- color: var(--content-bg-color);`
`27`		`- padding: 2px 5px;`
`28`		`- text-shadow: 1px 1px 0 rgba(0, 0, 0, .1);`
`29`		`- }`
`30`	`22`	`}`
`31`	`23`
`32`	`24`	`if (not hexo-config('menu_settings.badges')) {`