hexo-theme-stellar 1.16.2 → 1.17.1

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

@@ -1,9 +1,9 @@
-.md .tag-plugin.quot
+.md-text .tag-plugin.quot
   text-align: center
   position: relative
   align-items: center
   max-width 400px
-.md .tag-plugin.quot:not(span)
+.md-text .tag-plugin.quot:not(span)
   display: inline-flex
   align-self: center
   border-bottom: none
@@ -18,7 +18,7 @@
   line-height: 1.2
 
 // override
-article.md.content
+.md-text.content
   .quot:not(span)
     color: var(--text-p0)
   h1.quot
@@ -33,7 +33,7 @@ article.md.content
     font-size: $fs-h4
 
 // type=text
-.md .tag-plugin.quot[type=text]:not(span)
+.md-text .tag-plugin.quot[type=text]:not(span)
   &:before,&:after
     content: ""
     position: absolute
@@ -49,14 +49,14 @@ article.md.content
     bottom: 0
     border-right: 6px solid $color-accent
     border-bottom: 6px solid $color-accent
-article.md.content h1.quot[type=text]
+.md-text.content h1.quot[type=text]
   &:before,&:after
     width: 12px
     height: 20px
     border-width: 8px
 
 // type=icon
-.md .tag-plugin.quot[type=icon]:not(span)
+.md-text .tag-plugin.quot[type=icon]:not(span)
   .icon
     height: 1.5em
     display: inline-block
@@ -69,7 +69,7 @@ article.md.content h1.quot[type=text]
       margin-left: .5rem
 
 // inline quot
-.md span.tag-plugin.quot
+.md-text span.tag-plugin.quot
   font-weight: 500
   &:before,&:after
     color: $color-accent

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

@@ -80,7 +80,7 @@
       &.active
         display: block
 
-.md.indent .tag-plugin.tabs .tab-content p:not([class])
+.md-text.indent .tag-plugin.tabs .tab-content p:not([class])
   text-indent: 'calc(%s * 2)' % $fs-p
   a
     text-indent: 0

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

@@ -1,7 +1,7 @@
-.md .tag-plugin.folding .body:has(.timeline)
+.md-text .tag-plugin.folding .body:has(.timeline)
   background: var(--site-bg)
   
-.md .tag-plugin.timeline
+.md-text .tag-plugin.timeline
   position: relative
   margin-top: 0
   padding-left: 16px
@@ -20,7 +20,7 @@
     &:before
       display: none
 
-.md .tag-plugin.timeline .timenode
+.md-text .tag-plugin.timeline .timenode
   position: relative
   display: flex
   flex-direction: column

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

@@ -0,0 +1,34 @@
+.widget-wrapper.ghrepo
+  .repo
+    display: block
+    padding: 0.75rem 0.5rem
+    color: var(--text-p2)
+    background: var(--card)
+    border-radius: $border-block
+    box-shadow: $boxshadow-card
+    trans2 box-shadow transform
+    >div+div
+      margin-top: 0.5rem
+    span
+      color: var(--text-p2)
+    &:hover
+      box-shadow: $boxshadow-card-float
+      transform: translateY(-1px)
+    svg
+      margin-right: 4px
+    .flex-row
+      display: flex 
+      align-items: center
+    .repo-name
+      font-size: $fs-14
+      font-weight: 700
+      color: var(--text-p1)
+    .repo-desc
+      font-size: $fs-13
+      margin-left: 2px
+      margin-right: 2px
+    .grid
+      font-size: $fs-13
+      display: grid
+      grid-gap: 2px
+      grid-template-columns: repeat(auto-fill, "calc((100% - 2 * %s) / 3)" % 2px)

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

@@ -0,0 +1,95 @@
+.widget-wrapper.ghuser
+  .widget-header+.widget-body
+    margin: 0.75rem 0
+.widget-wrapper.ghuser .widget-body
+  text-align: center
+  background: var(--card)
+  border-radius: $border-card
+  padding: 1rem
+  box-shadow: $boxshadow-card
+
+.widget-wrapper.ghuser 
+  .avatar
+    display: block
+    border-radius: 100%
+    margin: 1rem auto 1.25rem auto
+    max-width: 75%
+    overflow: hidden
+    img 
+      display: block
+    @media screen and (max-width: $device-tablet)
+      max-width: 50%
+
+  .username
+    font-weight: 900
+    font-size: $fs-h2
+    color: var(--text-p0)
+    margin: 0.5rem 0
+
+  .bio
+    font-size: $fs-13
+    margin: 0.5rem 0
+
+  .follow 
+    font-weight: 500
+    border-radius: 64px
+    padding: 0.5rem 1rem
+    background: $color-theme
+    color: var(--card)
+    font-size: 1rem
+    align-self: stretch
+    text-align: center
+    line-height: 1.5
+    display: flex
+    align-items: center
+    justify-content: center
+    trans1: background
+    svg
+      margin-right: 6px
+    &:hover
+      background: $color-hover
+
+  .menu 
+    margin-bottom: 0
+    background: none
+    a:hover 
+      box-shadow: none 
+      background: var(--block)
+    a.active 
+      box-shadow: none
+      position: relative
+      &:after
+        content: ''
+        position: absolute
+        height: 3px
+        bottom: 0
+        width: 32px
+        left: 'calc(50% - 0.5 * %s)' % @width
+        border-radius: 4px
+        background: $color-theme
+
+  .buttons
+    margin: 1rem 0
+    align-self: stretch
+    display: grid
+    grid-gap: 2px
+    grid-template-columns: repeat(auto-fill, "calc((100% - 2 * %s) / 3)" % 2px)
+
+  .btn
+    display: flex 
+    flex-direction: column
+    align-items: center
+    color: inherit
+    border: 1px solid transparent
+    border-radius: 4px
+    padding: 0.25rem 0
+    trans1: background
+    &:hover
+      background: var(--block)
+    .title
+      font-size: 1rem
+      font-weight: 700
+    .desc
+      font-size: $fs-12
+      color: var(--text-p3)
+      font-weight: 500

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

@@ -0,0 +1,15 @@
+.widget-wrapper.recent .widget-body
+  display: flex
+  flex-direction: column
+  align-items: flex-start
+  margin-top: 0.25rem
+  a
+    line-height: 1.2
+    font-size: $fs-13
+    margin: 0.25rem 0
+    .title  
+      font-size: $fs-13
+      color: var(--text-p2)
+    &:hover
+      color: $color-hover
+

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

@@ -0,0 +1,8 @@
+.widget-wrapper.related .widget-body a
+  margin-top: 0.5rem
+  margin-bottom: 1rem
+  .title 
+    font-weight: 700
+    font-size: $fs-14
+  .excerpt
+    -webkit-line-clamp: 3

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

@@ -0,0 +1,3 @@
+.widgets .widget-wrapper.search
+  margin-top: 0
+  margin-bottom: 0

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

@@ -0,0 +1,8 @@
+.widget-wrapper.tagcloud .widget-body
+  margin-top: 0.25rem
+  a  
+    word-break: break-word
+    color: var(--text-p2)
+    line-height: 1.5
+    &:hover
+      color: $color-hover

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

@@ -0,0 +1,17 @@
+.widget-wrapper.timeline 
+  .widget-body
+    margin-top: 0.5rem
+  .tag-plugin.timeline .timenode
+    .header
+      margin-bottom: 0.5rem
+      txt-ellipsis()
+      .user-info
+        background: var(--block)
+        &:hover
+          background: $color-hover
+          color: var(--card)
+      &:before
+        display: none
+    &+.timenode
+      margin-top: 0.75rem
+      

package/source/css/_layout/{sidebar → widgets}/toc_blog.styl

@@ -1,3 +1,3 @@
-.widget-wrap.single#toc .doc-tree
+.widget-wrapper.toc.single .doc-tree
   &.active>.toc
     border-left: 2px solid var(--block-hover)

package/source/css/_layout/{sidebar → widgets}/toc_common.styl

@@ -1,10 +1,13 @@
-.widget-wrap.single#toc .widget-header
+.widget-wrapper.toc .widget-header
+  margin-top: 1rem
+
+.widget-wrapper.toc.single .widget-header
   font-weight: 500
   font-size: $fs-12
   >span
     margin: 0.5rem 0
 
-#toc .widget-body
+.widget-wrapper.toc .widget-body
   margin-top: 0
   ul ul, ul ol
     padding-left: 0
@@ -34,7 +37,7 @@
       padding-left: 2.9rem
 
 
-#toc .toc-item
+.widget-wrapper.toc .toc-item
   color: var(--text-p2)
   font-size: $fs-12
   padding: 0
@@ -44,7 +47,7 @@
     border-left-color: @color
   .toc-child .toc-item
     padding: 0
-#toc a.toc-link
+.widget-wrapper.toc a.toc-link
   color: inherit
   display: block
   line-height: 1.2

package/source/css/_layout/{sidebar → widgets}/toc_wiki.styl

@@ -1,14 +1,10 @@
-.widget-wrap#toc
-  .widget-header
-    margin-top: 1rem
-
-.widget-wrap.multi#toc .widget-header
+.widget-wrapper.toc.multi .widget-header
   color: var(--text-p1)
   font-size: $fs-14
 
 
 // 其它分页链接
-.widget-wrap.multi#toc .doc-tree
+.widget-wrapper.toc.multi .doc-tree
   border-radius: $border-block
   background: var(--block)
   overflow: hidden
@@ -34,7 +30,7 @@
 
 
 // 当前分页链接
-.widget-wrap.multi#toc .doc-tree.active
+.widget-wrapper.toc.multi .doc-tree.active
   a.doc-tree-link
     background: var(--block)
     font-weight: 700

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

@@ -0,0 +1,60 @@
+.widgets 
+  .loading-wrap
+    margin: 0.5rem 0
+
+.widgets
+  overflow: scroll
+  flex-grow: 1
+  scrollbar-width: none
+  scrollbar(0, 0)
+  z-index: 1
+  line-height: 1.2
+  .widget-wrapper
+    .widget-header
+      padding-left: var(--gap-l)
+      padding-right: var(--gap-l)
+      display: flex
+      justify-content: space-between
+      align-items: center
+      font-weight: 500
+      position: sticky
+      top: -2px
+      background: var(--site-bg)
+      padding-top: 2px
+      z-index 1
+      .item 
+        display: block
+      >span 
+        margin: 0.25rem 0
+        text-align: left
+      &:empty
+        display: none
+      .cap-action
+        hover-block 4px 4px
+        line-height: 0
+        color: var(--text-meta)
+        trans2: color background
+        .icon
+          fill: var(--text-meta)
+        &:hover
+          color: $color-hover
+          .icon
+            fill: $color-hover
+
+    .widget-body
+      margin: 0.5rem var(--gap-l)
+      color: var(--text-p1)
+      p
+        margin-top: .5em
+        margin-bottom: .5em
+        line-height: 1.5
+    .widget-header+.widget-body
+      margin-top: 0
+  .widget-wrapper+.widget-wrapper .widget-header
+    margin-top: 3rem
+  .widget-wrapper+.widget-wrapper.toc .widget-header
+    margin-top: 1rem
+
+.widget-wrapper
+    display: block
+    margin: 2rem 0

package/source/css/_plugins/index.styl

@@ -8,6 +8,10 @@ if hexo-config('plugins.scrollreveal.enable')
 if hexo-config('plugins.fancybox.enable')
   @import 'fancybox'
 
+// 搜索
+if hexo-config('search.service') == 'local_search'
+  @import 'search/local-search'
+
 // 评论
 if hexo-config('comments.service') == 'beaudar'
   @import 'comments/beaudar'

package/source/css/_plugins/search/local-search.styl

@@ -0,0 +1,89 @@
+.search-wrapper
+  width: 100%
+  >.search-form
+    position: sticky
+    top: 1rem
+  .search-input
+    width: 100%
+    padding: 0.75rem 1rem
+    line-height: 1
+    box-sizing: border-box
+    border-radius: $border-block
+    background-color: var(--card)
+    color: var(--text-p0)
+    box-shadow: $boxshadow-button
+    trans1 box-shadow
+    &:hover
+      box-shadow: 0 0 2px 0px rgba(0, 0, 0, 0.16), 0 0 8px 0px rgba(0, 0, 0, 0.08)
+  
+  &.noresult 
+    .search-input
+      &:hover
+        box-shadow: 0 0 2px 0px alpha($c-red, 0.2), 0 0 8px 0px alpha($c-red, 0.2)
+      &:focus
+        box-shadow: 0 0 2px 0px alpha($c-red, 0.5), 0 0 8px 0px alpha($c-red, 0.4)
+
+  .search-no-result
+    display: none
+    margin: 1em auto
+    color: var(--text-p1)
+    text-align: center
+    font-size: $fs-14
+    padding: 2rem
+    background: var(--block)
+    border-radius: $border-block
+
+  #search-result
+    ul.search-result-list
+      padding: 0
+      margin: 0
+      list-style-type: none
+    li
+      margin: 1em auto
+      &:hover
+        .search-result-title
+          color: $color-hover
+    .search-result-title
+      background-image: none
+      color: var(--text-p1)
+      text-transform: capitalize
+      font-weight: bold
+      line-height: 1.2
+
+    .search-result-content
+      overflow: hidden
+      color: var(--text-p3)
+      margin: .4em auto
+      max-height: 13em
+      text-align: justify
+      font-size: $fs-12
+      line-height: 1.2
+      display: -webkit-box
+      -webkit-box-orient: vertical
+      overflow: hidden
+      -webkit-line-clamp: 3
+
+    .search-keyword
+      border-bottom: 1px dashed $color-hover
+      color: $color-hover
+      font-weight: bold
+
+
+
+.search-wrapper.noresult
+  .search-no-result
+    display: block
+
+.widget-wrapper
+  .search-form
+    top: 0
+    background: var(--site-bg)
+  .search-input
+    margin-top: 1rem
+    margin-bottom: -1rem
+  #search-result,.search-no-result
+    margin-top: 2rem
+
+.widget-wrapper:not(:first-child)
+  .search-wrapper
+    margin-top: -1rem

package/source/js/main.js

@@ -92,7 +92,7 @@ const init = {
     stellar.jQuery(() => {
       const scrollOffset = 32;
       var segs = [];
-      $("article.md :header").each(function (idx, node) {
+      $("article.md-text :header").each(function (idx, node) {
         segs.push(node)
       });
       // 滚动
@@ -111,12 +111,12 @@ const init = {
           }
         }
         if (topSeg) {
-          $("#toc a.toc-link").removeClass("active")
+          $(".toc#toc a.toc-link").removeClass("active")
           var link = "#" + topSeg.attr("id")
           if (link != '#undefined') {
-            $('#toc a.toc-link[href="' + encodeURI(link) + '"]').addClass("active")
+            $('.toc#toc a.toc-link[href="' + encodeURI(link) + '"]').addClass("active")
           } else {
-            $('#toc a.toc-link:first').addClass("active")
+            $('.toc#toc a.toc-link:first').addClass("active")
           }
         }
       })
@@ -124,7 +124,7 @@ const init = {
   },
   sidebar: () => {
     stellar.jQuery(() => {
-      $("#toc a.toc-link").click(function (e) {
+      $(".toc#toc a.toc-link").click(function (e) {
         l_body.classList.remove("sidebar");
       });
     })
@@ -209,7 +209,7 @@ if (stellar.plugins.lazyload) {
     false
   );
   document.addEventListener('DOMContentLoaded', function () {
-    lazyLoadInstance.update();
+    window.lazyLoadInstance?.update();
   });
 }
 
@@ -301,6 +301,42 @@ if (stellar.plugins.fancybox) {
   }
 }
 
+
+if (stellar.search.service) {
+  if (stellar.search.service == 'local_search') {
+    stellar.jQuery(() => {
+      stellar.loadScript('/js/search/local-search.js', { defer: true }).then(function () {
+        var $inputArea = $("input#search-input");
+        var $resultArea = document.querySelector("div#search-result");
+        $inputArea.focus(function() {
+          var path = stellar.search[stellar.search.service]?.path || '/search.json';
+          if (!path.startsWith('/')) {
+            path = '/' + path;
+          }
+          const filter = $inputArea.attr('data-filter') || '';
+          searchFunc(path, filter, 'search-input', 'search-result');
+        });
+        $inputArea.keydown(function(e) {
+          if (e.which == 13) {
+            e.preventDefault();
+          }
+        });
+        var observer = new MutationObserver(function(mutationsList, observer) {
+          if (mutationsList.length == 1) {
+            if (mutationsList[0].addedNodes.length) {
+              $('.search-wrapper').removeClass('noresult');
+            } else if (mutationsList[0].removedNodes.length) {
+              $('.search-wrapper').addClass('noresult');
+            }
+          }
+        });
+        observer.observe($resultArea, { childList: true });
+      });
+    })
+  }
+}
+
+
 // heti
 if (stellar.plugins.heti) {
   stellar.loadCSS(stellar.plugins.heti.css);