💥 支持雙評論系統配置/評論配置整理

✨ 增加mac light 代碼框
✨ 增加文章過期提醒配置
✨ 文章copyright 可單獨配置
✨ card-category 中category名稱和數字限制一行顯示
✨ 簡繁轉換優化，placeholder文字也會被轉換
🐛 修復配置PWA參數時，如果網站是子目錄時，會出現加載不到文件的bugs
調整當card-category有收縮按鈕時的顯示佈局

source/css/_global/index.styl

@@ -191,11 +191,6 @@ img:not([src])
   &:hover
     text-decoration: none !important
 
-.comment_headling
-  margin-bottom: 10px
-  font-weight: 700
-  font-size: 20px
-
 .post-ad
   margin: 2rem 0
 

source/css/_highlight/highlight.styl

@@ -182,11 +182,11 @@ blockquote
     td
       border: none
 
-  if $highlight_theme == 'mac'
+  if $highlight_theme == 'mac' || $highlight_theme == 'mac light'
     figure.highlight
       margin: 0 0 1.2rem
       border-radius: 7px
-      box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .4)
+      box-shadow: 0 5px 10px 0 $highlight-mac-border
       -webkit-transform: translateZ(0)
 
       .highlight-tools

source/css/_highlight/theme.styl

@@ -24,7 +24,7 @@ if $highlight_theme == 'default'
     bg-color: darken($highlight-background, 2)
   }
 
-if $highlight_theme == 'darker' || ($highlight_theme == 'mac')
+if $highlight_theme == 'darker' || $highlight_theme == 'mac'
   $highlight-background = #212121
   $highlight-current-line = #282a2e
   $highlight-selection = #61616150
@@ -39,6 +39,7 @@ if $highlight_theme == 'darker' || ($highlight_theme == 'mac')
   $highlight-purple = #C792EA
   $highlight-deletion = #BF42BF
   $highlight-addition = #105EDE
+  $highlight-mac-border = rgba(0,0,0,.4)
   $highlight-gutter = {
     color: alpha($highlight-foreground, .5),
     bg-color: $highlight-background
@@ -96,7 +97,7 @@ if $highlight_theme == 'ocean'
     bg-color: darken($highlight-background, 2)
   }
 
-if $highlight_theme == 'light'
+if $highlight_theme == 'light' || $highlight_theme == 'mac light'
   $highlight-background = #F6F8FA
   $highlight-current-line = #00346e
   $highlight-selection = #80CBC440
@@ -111,6 +112,7 @@ if $highlight_theme == 'light'
   $highlight-purple = #7C4DFF
   $highlight-deletion = #BF42BF
   $highlight-addition = #105EDE
+  $highlight-mac-border = rgba(144, 164, 174, .4)
   $highlight-gutter = {
     color: alpha($highlight-foreground, .5),
     bg-color: $highlight-background

source/css/_layout/aside.styl

@@ -164,6 +164,7 @@
         background-color: $light-blue
 
       span
+        @extend .limit-one-line
         display: inline-block
         vertical-align: bottom
 
@@ -195,7 +196,7 @@
             width: 70% !important
 
           &-count
-            width: 18%
+            width: calc(100% - 70% - 20px)
             text-align: right
 
           &-icon

source/css/_layout/comments.styl

@@ -0,0 +1,74 @@
+#post-comment
+  .comment-head
+    margin-bottom: 1rem
+
+    .comment-headling
+      display: inline-block
+      vertical-align: middle
+      font-weight: 700
+      font-size: 20px
+
+    .comment-switch
+      display: inline-block
+
+      if hexo-config('comments.text')
+        float: right
+        margin: .1rem auto 0
+        padding: .2rem .8rem
+        width: max-content
+        border-radius: 8px
+        background: $comments-switch-bg
+      else
+        > span
+          display: none
+
+      .first-comment
+        color: $comments-switch-first-text
+
+      .second-comment
+        color: $comments-switch-second-text
+
+      label
+        position: relative
+        display: inline-block
+        margin: 0 .4rem
+        width: 42px
+        height: 22px
+        vertical-align: sub
+
+        input#switch-comments-btn
+          width: 0
+          height: 0
+          opacity: 0
+
+          &:checked + .slider
+            background-color: $comments-switch-second-text
+
+          &:checked + .slider:before
+            transform: translateX(20px)
+
+        .slider
+          position: absolute
+          top: 0
+          right: 0
+          bottom: 0
+          left: 0
+          border-radius: 34px
+          background-color: $comments-switch-first-text
+          cursor: pointer
+          transition: .4s
+
+          &:before
+            position: absolute
+            bottom: 4px
+            left: 4px
+            width: 14px
+            height: 14px
+            border-radius: 50%
+            background-color: $comments-switch-round
+            content: ''
+            transition: .4s
+
+  .comment-wrap
+    .comments-items-2
+      display: none

source/css/_layout/post.styl

@@ -284,6 +284,27 @@ img
   iframe
     margin: 0 0 1rem
 
+  .post-outdate-notice
+    position: relative
+    margin: 0 0 1rem
+    padding: .5rem 1.2rem
+    border-radius: 3px
+    background-color: $noticeOutdate-bg
+    color: $noticeOutdate-color
+
+    if hexo-config('noticeOutdate.style') == 'flat'
+      padding: .5rem 1.2rem .5rem 1.8rem
+      border-left: 5px solid $noticeOutdate-border
+
+      &:before
+        @extend .fontawesomeIcon
+        position: absolute
+        top: 50%
+        left: 1em
+        color: $noticeOutdate-border
+        content: '\f071'
+        transform: translateY(-50%)
+
 @media screen and (max-width: 1024px)
   .layout_post
     width: auto

source/css/_layout/third-party.styl

@@ -86,7 +86,6 @@ if hexo-config('beautify.enable')
 .has-jax
   overflow: auto
 
-//aplayer
 #article-container
   .aplayer
     margin: 0 0 1rem

source/css/_mode/darkmode.styl

@@ -85,6 +85,8 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
         color: alpha(#FFFFFF, .6) !important
 
       figure.highlight
+        box-shadow: none
+
         .line:before
           color: alpha(#FFFFFF, .6) !important
 
@@ -246,6 +248,17 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
         a
           color: alpha(#FFFFFF, .6) !important
 
+    #post-comment
+      .comment-switch
+        if hexo-config('comments.text')
+          background: #2c2c2c
+
+        label
+          filter: brightness(.7)
+
+    .post-outdate-notice
+      filter: brightness(.7)
+
     // error 404
     #error-wrap
       .error-content

source/css/_mode/readmode.styl

@@ -187,7 +187,8 @@ if hexo-config('readmode')
     #sidebar,
     #toggle-sidebar,
     #mobile-toc-button,
-    #nav
+    #nav,
+    .post-outdate-notice
       display: none !important
 
     #web_bg

source/css/_tags/tabs.styl

@@ -23,10 +23,10 @@
         button
           display: block
           padding: .5rem 1rem
+          width: 100%
           border-top: 2px solid $tab-border-color
           background: $tab-botton-bg
           color: $font-color
-          width 100%
           line-height: 2
           transition: all .4s
 

source/css/var.styl

@@ -75,6 +75,15 @@ $reward-pop-up-color = #858585
 $search-bg = #f6f8fa
 $search-color = $theme-color
 $search-keyword-highlight = #F47466
+// comments
+$comments-switch-first-text = $bright-blue
+$comments-switch-second-text = $light-orange
+$comments-switch-round = #fff
+$comments-switch-bg = #f6f8fa
+// noticeOutdate
+$noticeOutdate-bg = #ffe6e6
+$noticeOutdate-color = #ff6666
+$noticeOutdate-border = #ff8080
 // gallery
 $gallery-color = #fff
 // tag-hide