perf(ui): standardize metadata text styles (#1295)

_sass/addon/commons.scss

@@ -132,12 +132,11 @@ kbd {
 }
 
 footer {
-  font-size: 0.8rem;
   background-color: var(--main-bg);
   height: $footer-height;
   border-top: 1px solid var(--main-border-color);
 
-  @extend %text-color;
+  @extend %text-meta;
 
   a {
     @extend %text-highlight;
@@ -382,7 +381,7 @@ main {
 }
 
 .post-meta {
-  font-size: 0.85rem;
+  @extend %text-meta;
 
   a {
     &:not([class]):hover {

_sass/addon/module.scss

@@ -123,10 +123,14 @@
 }
 
 %text-highlight {
-  color: inherit;
+  color: var(--text-muted-hightlight-color);
   font-weight: 600;
 }
 
+%text-meta {
+  font-size: 0.85rem;
+}
+
 %sup-fn-target {
   &:target {
     background-color: var(--footnote-target-bg);

_sass/colors/typography-dark.scss

@@ -11,6 +11,7 @@
   /* Common color */
   --text-color: rgb(175, 176, 177);
   --text-muted-color: #868686;
+  --text-muted-hightlight-color: #aeaeae;
   --heading-color: #cccccc;
   --label-color: #a7a7a7;
   --blockquote-border-color: rgb(66, 66, 66);

_sass/colors/typography-light.scss

@@ -11,6 +11,7 @@
   /* Common color */
   --text-color: #34343c;
   --text-muted-color: #757575;
+  --text-muted-hightlight-color: inherit;
   --heading-color: #2a2a2a;
   --label-color: #585858;
   --blockquote-border-color: #eeeeee;

_sass/layout/post.scss

@@ -22,10 +22,6 @@
   padding-right: $pr;
 }
 
-%text-color {
-  color: var(--text-color);
-}
-
 h1 + .post-meta {
   > span + span::before {
     @include dot;
@@ -33,7 +29,7 @@ h1 + .post-meta {
 
   em,
   time {
-    color: var(--text-color);
+    @extend %text-highlight;
   }
 
   em {
@@ -44,13 +40,10 @@ h1 + .post-meta {
 }
 
 .post-tail-wrapper {
+  @extend %text-meta;
+
   margin-top: 6rem;
   border-bottom: 1px double var(--main-border-color);
-  font-size: 0.85rem;
-
-  .post-tail-bottom a {
-    color: inherit;
-  }
 
   .license-wrapper {
     line-height: 1.2rem;
@@ -64,7 +57,7 @@ h1 + .post-meta {
     }
 
     span:last-child {
-      font-size: 0.85rem;
+      @extend %text-meta;
     }
   } /* .license-wrapper */
 
@@ -320,7 +313,6 @@ h1 + .post-meta {
 
   .card {
     h4 {
-      @extend %text-color;
       @extend %text-clip;
     }
   }