hexo-theme-stellar 1.18.0 → 1.18.2

package/source/css/_custom.styl

@@ -20,7 +20,8 @@ $color-text = convert(hexo-config('style.color.text'))
 //   font-style: normal
 
 $ff-body = system-ui, "Microsoft Yahei", "Segoe UI", -apple-system, Roboto, Ubuntu, "Helvetica Neue", Arial, "WenQuanYi Micro Hei", sans-serif
-$ff-code = Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif
+$ff-codeblock = Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif
+$ff-code = $ff-codeblock
 $ff-logo = $ff-body
 
 if hexo-config('style.font-family.body')
@@ -29,12 +30,15 @@ if hexo-config('style.font-family.body')
 if hexo-config('style.font-family.code')
   $ff-code = convert(hexo-config('style.font-family.code'))
 
+if hexo-config('style.font-family.codeblock')
+  $ff-codeblock = convert(hexo-config('style.font-family.codeblock'))
+
 if hexo-config('style.font-family.logo')
   $ff-logo = convert(hexo-config('style.font-family.logo'))
 
 
 // font size
-$fs-root = convert(hexo-config('style.font-size'))
+$fs-root = convert(hexo-config('style.font-size.root'))
 $fs-15 = .9375rem
 $fs-14 = .875rem
 $fs-13 = .8125rem
@@ -46,19 +50,24 @@ $fs-h3   = 1.375rem  // 22px
 $fs-h4   = 1.125rem  // 18px
 $fs-h5   = $fs-15
 $fs-h6   = $fs-12
-$fs-p    = $fs-15
-$fs-code = $fs-13
+$fs-p    = convert(hexo-config('style.font-size.body'))
+$fs-code = convert(hexo-config('style.font-size.code'))
+$fs-codeblock = convert(hexo-config('style.font-size.codeblock'))
+
 
-$border-card = 12px
-$border-block = 6px
-$border-image = 6px
+$border-card = convert(hexo-config('style.border-radius.card'))
+$border-block = convert(hexo-config('style.border-radius.block'))
+$border-bar = convert(hexo-config('style.border-radius.bar'))
+$border-image = convert(hexo-config('style.border-radius.image'))
+$border-button = 4px
 
 // 可以动态变化的属性
 :root
   --width-left: 288px
   --width-main: 720px
   --gap-l: 16px
-  --gap-p: .75rem // gap for paragraph
+  --gap-p: 1rem // gap for paragraph
+  --gap-p-compact: 0.75rem
   // desktop 2k or larger
   @media screen and (min-width: $device-2k)
     --gap-l: 32px

package/source/css/_defines/func.styl

@@ -83,7 +83,7 @@ scrollbar-codeblock($height = 4px)
   &::-webkit-scrollbar-thumb
     background: transparent
     cursor: pointer
-    border-radius: $border-block
+    border-radius: $border-bar
   &:hover
     &::-webkit-scrollbar-thumb
       background: var(--text-meta)

package/source/css/_defines/theme.styl

@@ -33,24 +33,22 @@ set_text_light()
   --text-code: hsl($color-code-h, $color-code-s, $color-code-l * 1.25)
 
 :root
-  --site-bg: hsl($color-background-h, $color-background-s, 98)
+  --site-bg: hsl($color-background-h, $color-background-s, $color-background-l)
   --card: hsl($color-block-h, $color-block-s, 100)
   --block: hsl($color-block-h, $color-block-s, 95)
   --block-border: hsl($color-block-h, $color-block-s, 90)
   --block-hover: hsl($color-block-h, $color-block-s, 92)
-  --block-lighten: hsl($color-block-h, $color-block-s, 100)
   set_text_dark()
   --theme-bg2: $color-theme
   --theme-link: $color-link
 
 set_darkmode()
   :root
-    --site-bg: hsl($color-background-h, $color-background-s / 2, 16)
-    --card: hsl($color-block-h, $color-block-s * 1.5, 25)
-    --block: hsl($color-block-h, $color-block-s, 12)
+    --site-bg: hsl($color-background-h, $color-background-s * 0.5, (100 - $color-background-l) * 2 + 8)
+    --card: hsl($color-block-h, $color-block-s * 1.2, 24)
+    --block: hsl($color-block-h, $color-block-s, 16)
     --block-border: hsl($color-block-h, $color-block-s, 24)
-    --block-hover: hsl($color-block-h, $color-block-s, 9)
-    --block-lighten: hsl($color-block-h, $color-block-s, 30)
+    --block-hover: hsl($color-block-h, $color-block-s, 20)
     set_text_light()
     @media screen and (max-width: $device-mobile-max)
       --site-bg: black

package/source/css/_layout/list.styl

@@ -55,7 +55,6 @@
 
 .post-list .post-card:hover
   box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.1), 0 4px 16px 0px rgba(0, 0, 0, 0.1)
-  transform: translateY(-1px)
   img 
     transform: scale(1.02)
     filter: brightness(80%)

package/source/css/_layout/md.styl

@@ -1,7 +1,6 @@
 .md-text
   max-width: 100%
-  padding: 0 1rem
-  margin-top: 1rem
+  padding: 1rem
   &:first-child
     margin-top: 0
   color: var(--text-p1)
@@ -21,9 +20,8 @@ h1.article-title
 
 .md-text.content
   position: relative
-  margin-bottom: 2rem
-  // display: flex
-  // flex-direction: column
+  padding-bottom: 2rem
+  overflow: hidden
   &.indent
     >p:not([class])
       text-indent: 'calc(%s * 2)' % $fs-p
@@ -33,25 +31,25 @@ h1.article-title
     h1,h2,h3,h4,h5,h6
       text-align: center
     >h2:not([class])
-      align-self: center
-      border-bottom-style: dashed
-      border-bottom-color: $color-accent
+      border-bottom: none
   >:first-child:not(h1)
     margin-top: 0
   h1:not(:first-child)
     margin-top: 2em
-  h2:first-child
-    margin-top: 0
+  h2
+    margin-bottom: 1rem
+  h3,h4,h5,h6
+    margin-bottom: .5rem
   h2,h3,h4,h5,h6
     color: var(--text-p0)
     padding-top: 1rem
-    margin-bottom: .5rem
     line-height: 1.8
     &:hover
       a.headerlink:before
         opacity: 1
 
-
+.md-text.content:first-child
+  padding-top: 0
 
 .md-text
   ul:not(:last-child),
@@ -62,9 +60,13 @@ h1.article-title
     p,ul,ol
       font-size: $fs-14
       line-height: 1.5
+      code 
+        font-size: inherit
+        padding: 0
+        background: none
   p,blockquote,.tag-plugin,ul,ol,.highlight,table
     *
-      --gap-p: .5rem
+      --gap-p: var(--gap-p-compact)
   p,ul,ol
     margin-top: 'calc(%s - 4px)' % var(--gap-p)
     margin-bottom: 'calc(%s - 4px)' % var(--gap-p)

package/source/css/_layout/pages/archives.styl

@@ -47,7 +47,7 @@
     &.child
       padding-left: 2rem
     padding: .5em 1rem
-    border-radius: $border-block
+    border-radius: $border-bar
     color: var(--text-p2)
     align-items: center
     justify-content: space-between

package/source/css/_layout/pages/error.styl

@@ -17,7 +17,6 @@
     display: inline-block
     background: #FDB62F
     color: black
-    border-radius: 4px
     border: 2px solid black
 
 @media screen and (max-width: $device-tablet)

package/source/css/_layout/partial/related.styl

@@ -1,6 +1,6 @@
 .related-wrap
-  padding: 1rem
-  margin: 2rem 0
+  padding: 0 1rem
+  margin: 4rem 0
   &:empty
     display: none
   section.header
@@ -14,10 +14,11 @@
 
   a.more
     padding: 0.25rem 0.5rem
-    border-radius: $border-block
+    border-radius: $border-bar
     color: var(--text-p1)
 
-
+article.md-text.content+.related-wrap
+  margin-top: 0
 
 .related-posts
   max-width: 100%
@@ -82,7 +83,8 @@
 
 
 .related-wrap#comments
-  div.cmt-title
+  padding: 0 1rem
+  .cmt-title
     p
       margin: 0
       font-size: inherit
@@ -93,7 +95,7 @@
           color: $color-hover
         &:before
           display: none
-  div.cmt-body
+  .cmt-body
     min-height: 150px
     position: relative
     svg.loading

package/source/css/_layout/sidebar/header.styl

@@ -28,7 +28,7 @@ nav.menu
     text-align: center
     &.active, &:hover
       color: var(--text-p1)
-      background: var(--block-lighten)
+      background: var(--card)
       box-shadow: $boxshadow-button
 
 .l_left .menu a.nav-item

package/source/css/_layout/sidebar/sidebar.styl

@@ -23,7 +23,8 @@
     margin-bottom: 6rem
 
 
-.l_left .widgets .widget-wrapper.logo-wrap.wiki
+.l_left .widgets .widget-wrapper.logo-wrap.wiki .widget-body
+  display: flex
   margin-bottom: 1.5rem
   flex-direction: column
   align-items: flex-start

package/source/css/_layout/tag-plugins/checkbox.styl

@@ -1,8 +1,9 @@
-.md-text .checkbox
+.md-text .tag-plugin.checkbox
   display: flex
+  align-items: center
   font-size: $fs-15
   line-height: 1.2
-  --gap-p: .25rem
+  --gap-p: 'calc(%s / 2)' % var(--gap-p-compact)
   input
     -webkit-appearance: none
     -moz-appearance: none
@@ -20,8 +21,6 @@
     margin-right: 8px
     if hexo-config('tag_plugins.checkbox.interactive') != true
       pointer-events: none
-  span
-    margin-top: 1px
   /* Checkbox */
   input[type=checkbox]
     &:before, &:after

package/source/css/_layout/tag-plugins/common.styl

@@ -16,8 +16,8 @@ set_dynamic_color($theme)
   --theme-bg1: hsl(hue($theme), 90, 90)
   --theme-bg2: hsl(hue($theme), 80, 95)
   --theme-border: hsl(hue($theme), 50, 80)
-  --text-p0: hsl(hue($theme), 60, 16)
-  --text-p1: hsl(hue($theme), 50, 24)
+  --text-p0: hsl(hue($theme), 55, 16)
+  --text-p1: hsl(hue($theme), 55, 20)
   --text-p2: hsl(hue($theme), 90, 24)
 
 .tag-plugin
@@ -69,11 +69,11 @@ set_dynamic_color($theme)
 set_darkmode_tags()
   set_dynamic_color($theme)
     --theme: $theme
-    --theme-bg1: hsl(hue($theme), 80, 20)
-    --theme-bg2: hsl(hue($theme), 16, 16)
+    --theme-bg1: hsl(hue($theme), 50, 16)
+    --theme-bg2: hsl(hue($theme), 32, 16)
     --theme-border: hsl(hue($theme), 50, 24)
-    --text-p0: hsl(hue($theme), 80, 80)
-    --text-p1: hsl(hue($theme), 64, 80)
+    --text-p0: hsl(hue($theme), 100, 85)
+    --text-p1: hsl(hue($theme), 50, 75)
     --text-p2: hsl(hue($theme), 80, 72)
   .tag-plugin.tag
     set_dynamic_color($color-theme)

package/source/css/_layout/tag-plugins/copy.styl

@@ -3,7 +3,7 @@
   justify-content: space-between
   box-sizing: border-box
   background: var(--block)
-  border-radius: $border-block
+  border-radius: $border-bar
   border: 1px solid var(--block-border)
   overflow: hidden
   width: 320px

package/source/css/_layout/tag-plugins/folders.styl

@@ -1,7 +1,7 @@
 .tag-plugin.folders
   display: block
   margin: 1rem 0
-  border-radius: $border-block
+  border-radius: $border-bar
   font-size: $fs-14
   border: 1px solid var(--theme-border)
   overflow: hidden
@@ -30,13 +30,13 @@
     &:hover
       color: var(--text-p0)
       background: var(--block-hover)
-      &:after
-        position: absolute
-        content: '+'
-        text-align: center
-        top: 50%
-        transform: translateY(-50%)
-        right: 1rem
+    &:after
+      position: absolute
+      content: '+'
+      text-align: center
+      top: 50%
+      transform: translateY(-50%)
+      right: 1rem
 
 
 .tag-plugin.folders details[open]
@@ -49,7 +49,7 @@
   >summary
     color: var(--text-p1)
     background: var(--block-hover)
-    &:hover:after
+    &:after
       content: '-'
       
   >div.body

package/source/css/_layout/tag-plugins/folding.styl

@@ -2,7 +2,7 @@ details.folding
   display: block
   padding: 1rem
   margin: 1rem 0
-  border-radius: $border-block
+  border-radius: $border-bar
   font-size: $fs-14
   background: var(--theme-bg2)
   border: 1px solid var(--theme-border)
@@ -10,7 +10,7 @@ details.folding
     cursor: pointer
     padding: .75rem 1rem
     margin: 0 - 1rem
-    border-radius: $border-block
+    border-radius: $border-bar
     color: var(--text-p2)
     font-weight: 500
     position: relative
@@ -29,6 +29,7 @@ details.folding
       top: 50%
       transform: translateY(-50%)
       right: 1rem
+      line-height: 1
 
 
 details.folding[open]
@@ -47,8 +48,8 @@ details.folding[open]
     margin: 0 - 1rem
     margin-top: 0
     background: var(--card)
-    border-bottom-left-radius: 'calc(%s - 1px)' % $border-block
-    border-bottom-right-radius: 'calc(%s - 1px)' % $border-block
+    border-bottom-left-radius: 'calc(%s - 1px)' % $border-bar
+    border-bottom-right-radius: 'calc(%s - 1px)' % $border-bar
     font-size: $fs-15
     >:first-child
       margin-top: 0

package/source/css/_layout/tag-plugins/grid.styl

@@ -17,7 +17,10 @@
       margin-top: -0.25em
     p:last-child
       margin-bottom: -0.25em
-    
+
+.md-text .tag-plugin.grid
+  margin-top: -0.5rem
+  margin-bottom: -0.5rem 
 
 .tag-plugin.grid
   @media screen and (max-width: $device-tablet)

package/source/css/_layout/tag-plugins/link.styl

@@ -18,7 +18,7 @@
   @media screen and (max-width: $device-mobile-375)
     width: 100%
   box-shadow: $boxshadow-card
-  border-radius: $border-block
+  border-radius: $border-bar
   trans2: box-shadow transform
   &:hover
     box-shadow: $boxshadow-card-float

package/source/css/_layout/tag-plugins/note.styl

@@ -1,26 +1,26 @@
 .md-text .tag-plugin.note
   position: relative
-  margin-top: 1rem
-  margin-bottom: 1rem
-  padding: 0 1rem
+  padding: 0.25rem 1rem
   border-radius: $border-block
   background: var(--theme-bg2)
-  border: 1px solid var(--theme-border)
+  overflow: hidden
+  if hexo-config('tag_plugins.note.border') == true
+    border: 1px solid var(--theme-border)
   color: var(--text-p1)
   >.title
     font-size: $fs-15
-    line-height: 1.2
-    margin-top: 1rem
+    line-height: 1.5
+    margin-top: var(--gap-p-compact)
     font-weight: 500
     color: var(--text-p0)
   >.body
     &,p
       font-size: $fs-14
       line-height: 1.5
-    margin-top: .5rem
-    margin-bottom: 1rem
+    margin-top: var(--gap-p-compact)
+    margin-bottom: var(--gap-p-compact)
   >.body:only-child
-    margin: 1rem 0
+    margin: 'calc(%s - 0.25rem)' % var(--gap-p) 0
 
 
 .md-text .tag-plugin.note[color]
@@ -47,7 +47,6 @@
       margin-top: .5rem
 
 .md-text .tag-plugin.note[child=iframe]
-  overflow: hidden
   padding: 0
   >.body
     margin: 0

package/source/css/_layout/tag-plugins/quot.styl

@@ -9,20 +9,18 @@
     align-items: center
     border-bottom: none
     font-weight: 700
-    &:first-child
-      margin-top: 1.5rem
+    padding: 16px 24px
     a.headerlink:before
       content: ''
-    padding: 16px 24px 8px 24px
     @media screen and (max-width: $device-mobile)
-      padding: 16px 20px 8px
+      padding: 12px 20px
     line-height: 1.2
 
 .md-text .tag-plugin.quot .content
   max-width 400px
   position: relative
 // override
-.tag-plugin.quot
+.md-text.content .tag-plugin.quot
   h1
     font-size: $fs-h1
     font-weight: 900
@@ -31,6 +29,8 @@
       padding: 20px 24px 12px
   h2,h3,h4,h5,h6
     font-size: $fs-h3
+    margin-top: 1em
+    margin-bottom: 0
   p
     font-size: $fs-h4
     color: var(--text-p0)
@@ -50,7 +50,7 @@
       border-left: 6px solid $color-accent
     &:after
       right: 0
-      bottom: 0
+      bottom: 8px
       border-right: 6px solid $color-accent
       border-bottom: 6px solid $color-accent
   h1.content[type=text]

package/source/css/_layout/tag-plugins/tabs.styl

@@ -16,7 +16,7 @@
       align-self: flex-end
 
 .tag-plugin.tabs
-  ul.nav-tabs
+  .nav-tabs
     display: flex
     align-self: center
     overflow: scroll visible
@@ -36,7 +36,7 @@
       bottom: 0
       left: 0
       border-radius: 2px
-    li.tab
+    .tab
       list-style-type: none
       a
         display: block

package/source/css/_layout/tag-plugins/timeline.styl

@@ -99,15 +99,11 @@
 
 .tag-plugin.timeline .body
   background: var(--card)
-  border-radius: 12px
+  border-radius: $border-card
   border-top-left-radius: 2px
   padding: 0.5rem 1rem
   margin-top: 4px
   box-shadow: $boxshadow-block
-  trans2: transform box-shadow
-  &:hover
-    transform: translateY(-1px)
-    box-shadow: $boxshadow-card-float
   p
     font-size: $fs-14
     img  

package/source/css/_layout/tag-plugins/toc.styl

@@ -1,7 +1,7 @@
 details.toc
   background: var(--block)
   border: 1px solid var(--block-border)
-  border-radius: $border-block
+  border-radius: $border-bar
   overflow: hidden
   color: var(--text-p2)
   summary

package/source/css/_layout/widgets/search.styl

@@ -10,22 +10,36 @@
     display: flex
     flex-direction: row
     align-items: center
+    transition: 0.38s ease-out
+    z-index: 0
+    &:after
+      content: ''
+      position absolute
+      left: 0
+      right: 0
+      bottom: 0
+      height: 2px
+      border-radius: 4px
+      background: convert(hexo-config('style.gradient.search'))
+      background-size: 200%
+      animation: glow 10s linear infinite
+      @keyframes glow {
+        from {
+          background-position: 0%
+        }
+        to {
+          background-position: 200%
+        }
+      }
   .search-input
     width: 100%
-    padding: 0.5rem
+    padding: 0.5rem 0
     line-height: 1
     box-sizing: border-box
-    border-radius: $border-block
-    background-color: var(--card)
+    font-family: $ff-body
     color: var(--text-p0)
-    border: 1px solid var(--block-border)
-    &:focus
-      trans1 border-color
   
-  &.noresult 
-    .search-input
-      &:focus
-        border: 1px solid $c-red
+  &.noresult
     .search-icon
       color: $c-red
 
@@ -37,7 +51,7 @@
     font-size: $fs-14
     padding: 2rem
     background: var(--block)
-    border-radius: $border-block
+    border-radius: $border-bar
 
   #search-result
     ul.search-result-list
@@ -83,20 +97,16 @@
     top: 0
     background: var(--site-bg)
   .search-input
-    margin-top: 1rem
-    margin-bottom: -1rem
-    padding-left: 1.75rem
+    padding-left: 1.5rem
   .search-icon 
-    margin-top: 1rem
-    margin-bottom: -1rem
     position: absolute
-    margin-left: 0.5rem
+    margin-left: 0.25rem
     left: 0
     pointer-events: none
     color: var(--text-p2)
     
   #search-result,.search-no-result
-    margin-top: 2rem
+    margin-top: 1rem
 
 .widget-wrapper:not(:first-child)
   .search-wrapper

package/source/css/_layout/widgets/toc_wiki.styl

@@ -5,7 +5,7 @@
 
 // 其它分页链接
 .widget-wrapper.toc.multi .doc-tree
-  border-radius: $border-block
+  border-radius: $border-bar
   background: var(--block)
   overflow: hidden
   border: 1px solid var(--block-border)

package/source/css/_plugins/aplayer.styl

@@ -0,0 +1,3 @@
+.md-text
+  .aplayer
+    border-radius: $border-block

package/source/css/_plugins/comments/artalk.styl

@@ -0,0 +1,4 @@
+.cmt-body.artalk .artalk
+  --at-color-main: $color-theme
+  .atk-main-editor
+    border-radius: $border-block

package/source/css/_plugins/comments/utterances.styl

@@ -2,5 +2,5 @@
   margin: 0 -4px
   width: 'calc(100% + %s)' % 8px
 
-.related-wrap#comments div.cmt-body svg.loading
+.related-wrap#comments .cmt-body svg.loading
   top: 62px

package/source/css/_plugins/index.styl

@@ -1,3 +1,5 @@
+@import 'aplayer'
+
 // 根据主题配置加载
 if hexo-config('plugins.lazyload.enable')
   @import 'lazyload'
@@ -18,3 +20,5 @@ if hexo-config('comments.service') == 'utterances'
   @import 'comments/utterances'
 if hexo-config('comments.service') == 'waline'
   @import 'comments/waline'
+if hexo-config('comments.service') == 'artalk'
+  @import 'comments/artalk'