hexo-theme-stellar 1.42.0 → 1.43.0

package/source/css/_components/sidebar/search.styl

@@ -118,13 +118,17 @@
       list-style-type: none
     li a
       display: block
-      background: var(--bg-a20)
+      background: var(--ui-summary-item-bg)
       line-height: 1.2
       padding: 0.75rem 1rem
       border-radius: $border-card-s
       trans1 background
       &:hover
-        background: var(--bg-a50)
+        background: var(--ui-adapter-bg-hover)
+        box-shadow: var(--ui-adapter-shadow-hover)
+      &:focus-visible
+        outline: 2px solid var(--theme)
+        outline-offset: 2px
     li+li
       margin-top: 8px
     .search-result-title

package/source/css/_components/tag-plugins/chat.styl

@@ -314,7 +314,7 @@ chat_dark()
                                 align-items: center
                                 >svg,
                                 >span
-                                    height: $fs-12 + .05rem
+                                    height: 'calc(%s * 0.8)' % var(--fs-content-base)
                         
                     &.voice
                         display: flex

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

@@ -1,7 +1,7 @@
 .tag-plugin.folders
   margin: var(--gap-p) 0
-  --fsp: $fsp2
-  font-size: var(--fsp)
+  --fs-content: $fs-content-2
+  font-size: var(--fs-content)
   border-top: 1px solid var(--block-border)
   overflow: hidden
   .folder
@@ -43,8 +43,8 @@
       content: '-'
       
   >div.body
-    --fsp: $fsp1
+    --fs-content: $fs-content-1
     >:first-child
       margin-top: 1rem
     >:last-child
-      margin-bottom: 0
+      margin-bottom: 0

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

@@ -11,8 +11,8 @@ details.folding
     margin: -1rem
     color: var(--text-p2)
     font-weight: 500
-    --fsp: $fsp2
-    font-size: var(--fsp)
+    --fs-content: $fs-content-2
+    font-size: var(--fs-content)
     position: relative
     line-height: 1.2
     outline: none
@@ -45,7 +45,7 @@ details.folding[open]
     padding: 0 1rem 1rem
     margin: 0 -1rem -1rem
     color: var(--text-p1)
-    --fsp: $fsp1
+    --fs-content: $fs-content-1
     >:first-child
       margin-top: 1rem
     >:last-child

package/source/css/_components/tag-plugins/hashtag.styl

@@ -6,8 +6,8 @@
   margin: 2px 0
   display: inline-flex
   align-items: center
-  --fsp: $fsp2
-  font-size: var(--fsp)
+  --fs-content: $fs-content-2
+  font-size: var(--fs-content)
   font-weight: 500
   trans2 background color
   span  
@@ -15,4 +15,3 @@
   &:hover
     background: var(--text-p2)
     color: var(--theme-block)
-  

package/source/css/_components/tag-plugins/mdrender.styl

@@ -1,6 +1,6 @@
 .ds-mdrender
   p strong
-    font-size: $fs-body
+    font-size: var(--fs-content)
     font-weight: 500
     color: var(--text)
 

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

@@ -8,16 +8,16 @@
     border: 1px solid var(--theme-border)
   color: var(--text-p1)
   >.title
-    --fsp: $fsp1
-    font-size: var(--fsp)
+    --fs-content: $fs-content-1
+    font-size: var(--fs-content)
     line-height: 1.5
     margin-top: var(--gap-p-compact)
     font-weight: 500
     color: var(--text)
   >.body
     &,p
-      --fsp: $fsp2
-      font-size: var(--fsp)
+      --fs-content: $fs-content-2
+      font-size: var(--fs-content)
       line-height: 1.5
     margin-top: var(--gap-p-compact)
     margin-bottom: var(--gap-p-compact)

package/source/css/_components/tag-plugins/poetry.styl

@@ -3,15 +3,15 @@
   flex-direction: column
   align-items: center
   text-align: left
-  --fsp: $fs-body
+  --fs-content: var(--fs-content-base)
   .content
     >.title
       font-weight: 500
       margin-top: var(--gap-p)
     >.meta
       color: var(--text-p2)
-      --fsp: $fsp3
-      font-size: var(--fsp)
+      --fs-content: $fs-content-3
+      font-size: var(--fs-content)
       font-weight: 500
       span+span
         margin-left: 4px
@@ -24,8 +24,8 @@
       font-style: italic
       color: var(--text-p4)
       margin: var(--gap-p) 0
-      --fsp: $fsp3
-      font-size: var(--fsp)
+      --fs-content: $fs-content-3
+      font-size: var(--fs-content)
 
 // 描边修饰
 .md-text .tag-plugin.poetry .content

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

@@ -29,7 +29,7 @@
   h3,h4,h5,h6
     font-size: $fsh3
   p
-    font-size: calc(var(--fsp) + 2px)
+    font-size: calc(var(--fs-content) + 2px)
     color: var(--text)
 
 // type=icon
@@ -71,4 +71,3 @@
         opacity: 0.2
         filter: blur(8px)
         transform: translateY(4px) scale(1.2, 1.5)
-

package/source/css/_components/tag-plugins/quote.styl

@@ -4,4 +4,4 @@
     text-indent: 0 !important
   &[indent='true']
     p:not([class])
-        text-indent: 'calc(%s * 2)' % var(--fsp) !important
+        text-indent: 'calc(%s * 2)' % var(--fs-content) !important

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

@@ -44,8 +44,8 @@
         display: block
         cursor: pointer
         padding: .25rem .75rem
-        --fsp: $fsp3
-        font-size: var(--fsp)
+        --fs-content: $fs-content-3
+        font-size: var(--fs-content)
         line-height: inherit
         font-weight: 500
         color: var(--text-p3)

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

@@ -96,7 +96,7 @@
   margin-top: 4px
   box-shadow: $boxshadow-block
   p
-    --fsp: $fsp1
+    --fs-content: $fs-content-1
     img  
       display: block
   &:empty
@@ -112,8 +112,8 @@
     color: var(--text-p1)
     line-height: 1.25
     padding: 0.75rem 1rem
-    --fsp: $fsp1
-    font-size: var(--fsp)
+    --fs-content: $fs-content-1
+    font-size: var(--fs-content)
   &.ds-artalk .body
     img
       max-height: 1.5em
@@ -218,7 +218,7 @@ aside .tag-plugin.timeline[data-api] .body .lazy-box
   padding: 0 0.5rem
   margin: 0.75rem 0
   p
-    --fsp: $fsp2
+    --fs-content: $fs-content-2
     margin: 0.25rem
 
 .tag-plugin.timeline .body

package/source/css/_components/widgets/ghrepo.styl

@@ -28,3 +28,7 @@
       display: grid
       grid-gap: 2px
       grid-template-columns: repeat(auto-fill, "calc((100% - 2 * %s) / 3)" % 2px)
+      .flex-row
+        min-width: 0
+        span
+          txt-ellipsis()

package/source/css/_components/widgets/markdown.styl

@@ -6,18 +6,5 @@
     >*:first-child
       margin-top: .75rem
 
-.widget-wrapper.markdown .linklist
+.widget-wrapper.markdown .ui-collection
   margin: 1em 0
-  .link
-    background: var(--bg-a50)
-  .link:hover
-    background: var(--bg-a100)
-
-.l_left .widget-wrapper.markdown .linklist .link:hover
-  sidebar-light()
-
-.l_right .widget-wrapper.markdown .linklist
-  .link
-    background: var(--block)
-  .link:hover
-    background: var(--theme-a20)

package/source/css/_components/widgets/timeline.styl

@@ -9,7 +9,7 @@
     a
       trans1 all
       word-break: break-all
-      --fsp: $fsp2
+      --fs-content: $fs-content-2
   .tag-plugin.timeline .timenode
     z-index 1
     margin-top: 0.25rem
@@ -27,7 +27,7 @@
       border-radius: $border-card
       padding: 0.5rem 1rem
       p,li
-        --fsp: $fsp3
+        --fs-content: $fs-content-3
       code 
         background: none
         padding: 0

package/source/css/_components/widgets/toc.styl

@@ -5,8 +5,8 @@
     &:before
       content: ''
       position absolute
-      top: 6px
-      bottom: 6px
+      top: 8px
+      bottom: 8px
       left: 0
       width: 4px
       background: var(--block)
@@ -16,13 +16,14 @@
     @media screen and (min-width: $device-laptop)
       background: var(--background)
 
-.l_left .widget-wrapper.toc
+[data-ui-surface='glass'] .widget-wrapper.toc,
+[data-ui-surface='card'] .widget-wrapper.toc
   @media screen and (min-width: $device-laptop)
     background: none
 
 // 目录基本样式
 .widget-wrapper.toc .toc
-  --fsp: $fsp2
+  --fs-content: $fs-content-2
   padding: 0
   margin: 0
   position relative
@@ -35,7 +36,7 @@
     --padding-offset: calc(0 - var(--padding))
     padding: 4px var(--padding)
     margin: 0 var(--padding)
-    color: var(--text-p3)
+    color: var(--ui-item-muted)
     display: block
     position relative
     border-radius: $border-bar
@@ -43,18 +44,19 @@
     &.active:before
       content: ''
       position absolute
-      top: 6px
-      bottom: 6px
+      top: 4px
+      bottom: 4px
       left: -8px
       width: 4px
       background: var(--theme)
       border-radius: 4px
     &:hover
-      background: var(--block-border)
-      color: var(--text)
+      background: var(--ui-adapter-bg-hover)
+      box-shadow: var(--ui-adapter-shadow-hover)
+      color: var(--ui-item-title)
     
 // 固定位置
-.l_right .widgets .widget-wrapper.toc
+[data-ui-surface='sidebar'] .widgets .widget-wrapper.toc
   margin-top: 1rem
   position: sticky
   position: -webkit-sticky
@@ -78,22 +80,22 @@
 .widget-wrapper.toc .toc
   .toc-item
     font-weight: 500
-    --fsp: $fsp1
+    --fs-content: $fs-content-1
   .toc-item .toc-item
     font-weight: 400
-    --fsp: $fsp2
+    --fs-content: $fs-content-2
   ol
     padding-left: 0
   .toc-child .toc-link
-    padding-left: 1.5rem
+    padding-left: calc(var(--gap-base) * 1)
   .toc-child .toc-child .toc-link
-    padding-left: 2.5rem
+    padding-left: calc(var(--gap-base) * 2)
   .toc-child .toc-child .toc-child .toc-link
-    padding-left: 3.5rem
+    padding-left: calc(var(--gap-base) * 3)
   .toc-child .toc-child .toc-child .toc-child .toc-link
-    padding-left: 4.5rem
+    padding-left: calc(var(--gap-base) * 4)
   .toc-child .toc-child .toc-child .toc-child .toc-child .toc-link
-    padding-left: 5rem
+    padding-left: calc(var(--gap-base) * 5)
 
 // 高亮样式
 .widget-wrapper.toc .toc a.toc-link.active
@@ -133,9 +135,9 @@
     grid-template-rows: 1fr
     trans1 all
     overflow hidden
-.l_right .widgets .widget-wrapper.toc .widget-header .cap-action:hover
+[data-ui-surface='sidebar'] .widgets .widget-wrapper.toc .widget-header .cap-action:hover
   sidebar-light(var(--bg-a50))
-.l_right .widgets .widget-wrapper.toc.collapse
+[data-ui-surface='sidebar'] .widgets .widget-wrapper.toc.collapse
   .widget-header .cap-action
     sidebar-light(var(--bg-a50))
   .widget-body
@@ -181,7 +183,7 @@
   padding-top: 32px
 
 @media screen and (max-width: $device-laptop)
-  .l_right
+  [data-ui-surface='sidebar']
     blur-effect()
     .widgets
       .widget-wrapper.toc

package/source/css/_components/widgets/widgets.styl

@@ -44,7 +44,8 @@
           fill: var(--text-p2)
         &:hover
           color: var(--accent)
-          sidebar-light(var(--bg-a50))
+          background: var(--ui-item-bg-hover)
+          box-shadow: var(--ui-item-shadow-hover)
           opacity 1
           svg
             fill: var(--accent)
@@ -55,11 +56,22 @@
         margin-top: .5em
         margin-bottom: .5em
         line-height: 1.5
+      >.ui-collection,
+      >.widget-section>.ui-collection
+        min-width: 0
 
 
 .widget-wrapper
   display: block
   margin-top: 32px
+  .widget-section+.widget-section
+    margin-top: 24px
+
+.widget-wrapper.markdown
+  --ui-item-bg: var(--block)
+
+[data-ui-surface='glass'] .widget-wrapper.markdown
+  --ui-item-bg: var(--bg-a10)
 
 .l_left .widgets
   padding-bottom: 64px

package/source/css/_components/wiki-card.styl

@@ -0,0 +1,209 @@
+// Wiki 列表卡片独立组件：不复用文章 Hero 的 .cover 或 cover-overlay()。
+.post-list.wiki
+  display: grid
+  // Nested min() in minmax() is dropped by older WebKit, which leaves only
+  // the grid's implicit single column.
+  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr))
+  gap: 1rem
+  .post-card-wrap
+    width: 100%
+    margin: 0
+    border-radius: $border-card-l
+    box-shadow: $boxshadow-card
+  @media screen and (max-width: $device-mobile)
+    grid-template-columns: minmax(0, 1fr)
+
+.post-list.wiki .wiki-card
+  display: block
+  position: relative
+  z-index: 0
+  overflow: hidden
+  border-radius: $border-card-l
+  background: var(--card)
+  --wiki-img-br: 100%
+  --wiki-img-sat: 100%
+  --wiki-blur-sat: 150%
+  --wiki-overlay-color: var(--theme, #4f7cff)
+  // 边框与底部蒙版同源，但额外提高 20 个明度点，悬浮反馈更清晰。
+  --wiki-border-color: var(--theme, #4f7cff)
+  &.no-cover
+    --wiki-border-color: var(--block-border)
+  @supports not (corner-shape: superellipse(1))
+    clip-path: 'inset(0 round %s)' % $border-card-l
+  &:after
+    content: ''
+    position: absolute
+    inset: 0
+    z-index: 3
+    border: 2px solid transparent
+    border-radius: inherit
+    corner-shape: $corner-shape
+    pointer-events: none
+    transition: border-color .2s ease-out
+  &:hover
+    --wiki-img-br: 75%
+    --wiki-img-sat: 120%
+    --wiki-blur-sat: 200%
+    &:after
+      border-color: var(--wiki-border-color)
+    .wiki-card-cover > img
+      transform: scale(1.05)
+    .wiki-card-cover:before
+      transform: translateZ(0) scale(1.05)
+
+.wiki-card-content
+  padding: 0
+
+.wiki-card-cover
+  position: relative
+  min-height: 240px
+  overflow: hidden
+  aspect-ratio: 3 / 4
+  background-image: var(--cover-url)
+  background-size: cover
+  background-position: center
+  // Today 内容层：同图模糊覆盖下半部，主题色从中部开始渐显，到最底部才完全不透明。
+  > img
+    position: absolute
+    inset: 0
+    z-index: 0
+    width: 100%
+    height: 100%
+    object-fit: cover
+    filter: brightness(var(--wiki-img-br)) saturate(var(--wiki-img-sat))
+    transform: translateZ(0)
+    transition: all .2s ease-out, transform 1.5s ease-out
+  &:before
+    content: ''
+    position: absolute
+    inset: 0
+    z-index: 1
+    background-image: var(--cover-url)
+    background-size: cover
+    background-position: center
+    filter: brightness(var(--wiki-img-br)) saturate(var(--wiki-img-sat)) blur(1.5rem) saturate(var(--wiki-blur-sat))
+    mask: linear-gradient(to top, black, rgba(black, .75) 26%, transparent 52%)
+    -webkit-mask: linear-gradient(to top, black, rgba(black, .75) 26%, transparent 52%)
+    transform: translateZ(0)
+    pointer-events: none
+    opacity: 0
+    transition: opacity .2s ease-out, filter .2s ease-out, transform .5s ease-out
+  &:after
+    content: ''
+    position: absolute
+    inset: 0
+    z-index: 1
+    pointer-events: none
+    background-image: linear-gradient(to bottom, transparent 50%, var(--wiki-overlay-color) 100%)
+    opacity: 0
+    transition: opacity .2s ease-out
+  &.no-cover
+    background: var(--card)
+    &:before, &:after
+      display: none
+    &.cover-error > img
+      display: none
+
+.post-list.wiki .wiki-card.cover-loaded .wiki-card-cover:not(.no-cover)
+  &:before, &:after
+    opacity: 1
+
+.wiki-card-info
+  display: flex
+  position: absolute
+  z-index: 2
+  right: 0
+  bottom: 0
+  left: 0
+  flex-direction: column
+  justify-content: flex-end
+  box-sizing: border-box
+  color: var(--text-banner, white)
+  @media screen and (max-width: $device-mobile)
+    .wiki-card-summary
+      padding: .75rem
+
+.wiki-card-cover.no-cover .wiki-card-info
+  color: var(--text)
+  .wiki-meta, .project-subtitle
+    color: var(--text-p2)
+
+.wiki-card-info
+  .wiki-card-summary
+    padding: 1rem
+  .headline
+    margin: .5rem 0
+    font-weight: 700
+    line-height: 1.2
+    color: inherit
+  @media screen and (max-width: $device-mobile)
+    .headline
+      margin: .375rem 0
+  .wiki-meta
+    display: flex
+    flex-wrap: wrap
+    align-items: center
+    gap: .5rem 1rem
+    min-height: 1.25rem
+    color: var(--text-banner-theme, inherit)
+    font-size: $fs-13
+    line-height: 1.2
+  .wiki-available
+    display: inline-flex
+    flex-wrap: wrap
+    align-items: center
+    gap: 4px
+  .wiki-available, .wiki-stars
+    svg
+      flex: none
+      width: 1em
+      height: 1em
+      vertical-align: middle
+  .wiki-stars
+    display: none
+    align-items: center
+    gap: 4px
+    &.loaded
+      display: inline-flex
+  .wiki-project
+    display: flex
+    align-items: center
+    gap: 10px
+    margin-top: auto
+    padding: .75rem 1rem 1rem
+    background: rgba(black, .1)
+    line-height: 1.2
+    @media screen and (max-width: $device-mobile)
+      padding: .625rem .75rem .75rem
+  .project-icon
+    display: flex
+    flex: none
+    align-items: center
+    justify-content: center
+    width: 2.5rem
+    height: 2.5rem
+    overflow: hidden
+    border-radius: 30%
+    background: var(--block)
+    color: var(--text-p2)
+    img
+      width: 100%
+      height: 100%
+      object-fit: cover
+    svg
+      width: 1.5rem
+      height: 1.5rem
+  .project-text
+    min-width: 0
+    flex: 1
+  .project-name, .project-subtitle
+    overflow: hidden
+    text-overflow: ellipsis
+    white-space: nowrap
+  .project-name
+    font-size: $fs-14
+    font-weight: 600
+  .project-subtitle
+    margin-top: 3px
+    color: var(--text-banner-theme, inherit)
+    font-size: $fs-13