pjax

source/css/_layout/404.styl

@@ -17,7 +17,7 @@ if hexo-config('error_404.enable')
       margin: 0 1rem
       height: 18rem
       border-radius: 8px
-      background: #fff
+      background: var(--card-bg)
       box-shadow: 0 4px 8px 6px rgba(7, 17, 27, .06)
 
       @media screen and (max-width: 768px)
@@ -30,7 +30,7 @@ if hexo-config('error_404.enable')
         height: 100%
         border-top-left-radius: 8px
         border-bottom-left-radius: 8px
-        background-color: #49b1f5
+        background-color: $theme-color
         background-position: center
         background-size: cover
 
@@ -53,7 +53,6 @@ if hexo-config('error_404.enable')
 
         .error_title
           margin-top: -4rem
-          color: $font-color
           font-size: 9em
 
           @media screen and (max-width: 768px)
@@ -62,19 +61,16 @@ if hexo-config('error_404.enable')
         .error_subtitle
           @extend .limit-more-line
           margin-top: -3.5rem
-          color: $font-color
           word-break: break-word
           font-size: 1.6em
           -webkit-line-clamp: 2
 
         a
-          position: relative
-          z-index: 1
           display: inline-block
           margin-top: .5rem
           padding: .3rem 1.5rem
-          background: $theme-color
-          color: white
+          background: var(--btn-bg)
+          color: var(--btn-color)
 
           i
             padding-right: .3rem

source/css/_layout/aside.styl

@@ -7,7 +7,7 @@
   .card-widget
     overflow: hidden
     border-radius: 8px
-    background: $card-bg
+    background: var(--card-bg)
     box-shadow: 0 4px 8px 6px rgba(7, 17, 27, .06)
     transition: all .3s
 
@@ -44,12 +44,12 @@
         a
           .headline
             @extend .limit-one-line
-            color: $font-black
+            color: var(--font-color)
             font-size: .7rem
 
           .length_num
             margin-top: -.3rem
-            color: $dark-black
+            color: var(--text-highlight-color)
             font-size: 1rem
 
     .card-info-social-icons
@@ -57,7 +57,7 @@
 
       .social-icon
         margin: 0 .5rem
-        color: $font-black
+        color: var(--font-color)
         font-size: 1rem
         cursor: pointer
 
@@ -67,13 +67,11 @@
         &:hover
           transform: rotate(540deg)
 
-    #bookmark-it
-      position: relative
-      z-index: 1
+    #card-info-btn
       display: block
-      width: 100%
-      background-color: $light-blue
-      color: $button-color
+      background-color: var(--btn-bg)
+      color: var(--btn-color)
+      text-align: center
       line-height: 1.6rem
 
       span
@@ -94,7 +92,7 @@
       padding: 0 .1rem
 
       &:hover
-        color: $light-blue !important
+        color: $text-hover !important
 
   .card-recent-post
     .aside-recent-item
@@ -103,46 +101,44 @@
       & > .aside-recent-post
         margin-bottom: 10px
 
-        & > a
-          color: $font-black
+        .aside-post-cover
+          float: left
+          overflow: hidden
+          width: 66px
+          height: 66px
 
-          .aside-post-cover
-            float: left
-            overflow: hidden
-            width: 66px
-            height: 66px
+          .aside-post-bg
+            padding: 0
+            max-width: 100%
+            width: 100%
+            height: 100%
+            transition: all .6s
+            object-fit: cover
 
-            .aside-post-bg
-              padding: 0
-              max-width: 100%
-              width: 100%
-              height: 100%
-              transition: all .6s
-              object-fit: cover
+            &:hover
+              box-shadow: none
+              transform: scale(1.1)
 
-              &:hover
-                box-shadow: none
-                transform: scale(1.1)
+        .aside-post-info
+          .aside-post_meta
+            padding-left: 10px
+            color: $theme-meta-color
+            font-size: .6rem
 
           .aside-post-title
-            .aside-post_meta
-              padding-left: 10px
-              color: $theme-meta-color
-              font-size: .6rem
+            @extend .limit-more-line
+            padding-left: 10px
+            height: 40px
+            color: var(--font-color)
+            line-height: 1rem
+            -webkit-line-clamp: 2
 
-            .aside-post_title
-              @extend .limit-more-line
-              padding-left: 10px
-              height: 40px
-              line-height: 1rem
-              -webkit-line-clamp: 2
+            &:hover
+              color: $text-hover
 
-              &:hover
-                color: $light-blue !important
-
-            &.no-aside-cover
-              .aside-post_title
-                height: auto
+          &.no-aside-cover
+            .aside-post-title
+              height: auto
 
   .card-archives ul.card-archive-list,
   .card-categories ul.card-category-list
@@ -156,12 +152,12 @@
       display: inline-block
       padding: .15rem 1rem
       width: 100%
-      color: $font-black
+      color: var(--font-color)
       transition: all .4s
 
       &:hover
         padding: .15rem .85rem
-        background-color: $light-blue
+        background-color: var(--text-bg-hover)
 
       span
         @extend .limit-one-line

source/css/_layout/category.styl

@@ -1,15 +1,10 @@
 .category-content
-  ol,
   ul
     margin-top: .4rem
     padding: 0 0 0 .8rem
     list-style: none
     counter-reset: li
 
-    p
-      margin: 0
-
-    ol,
     ul
       padding-left: .5rem
 
@@ -18,39 +13,11 @@
       margin: .3rem 0
       padding: .1rem .5rem .1rem 1.5rem !important
 
-      &:hover
-        &:before
-          transform: rotate(360deg)
-
       &:before
         position: absolute
-        top: 0
         left: 0
-        background: $light-blue
-        color: $card-bg
         cursor: pointer
         transition: all .3s ease-out
-
-  ol
-    li
-      &:before
-        margin-top: .2rem
-        width: w = 1.2rem
-        height: h = w
-        border-radius: .5 * w
-        content: counter(li)
-        counter-increment: li
-        text-align: center
-        font-size: .6rem
-        line-height: h
-
-  ul
-    li
-      &:hover
-        &:before
-          border-color: $theme-button-hover-color
-
-      &:before
         $w = .3rem
         top: 10px
         margin-left: .45rem