hexo-theme-solitude 1.7.0 → 1.7.2

package/source/css/_layout/aside.styl

@@ -73,7 +73,6 @@
   html.hide-aside .layout > .aside-content
     display: none
 
-// toc
 #aside-content
   .card-toc
     padding .5rem .5rem
@@ -183,569 +182,567 @@
     .toc-item.active .toc-link .toc-text
       color: var(--efu-white)
 
-if "about" in aside
-  #aside-content
-    .card-widget
-      &:hover
-        .avatar-sticker
-          opacity 0
-          transform scale(0)
-
-      &.card-recent-post
-        padding .4rem .6rem !important
-
-      &.card-info
-        padding 0 !important
-        box-shadow var(--efu-shadow-black)
-
-        > div.card-content
-          padding 1rem 1.2rem
-          min-height 320px
-          position relative
-
-    > .card-widget.card-info
-      &:before
-        background linear-gradient(-25deg, var(--efu-main), var(--efu-main-op-deep))
-        background-size 400%
-        position absolute
-        width 100%
-        height 100%
-        left 0
-        top 0
-        content ''
-        animation gradient 15s ease infinite
+#aside-content
+  .card-widget
+    &:hover
+      .avatar-sticker
+        opacity 0
+        transform scale(0)
+
+    &.card-recent-post
+      padding .4rem .6rem !important
+
+    &.card-info
+      padding 0 !important
+      box-shadow var(--efu-shadow-black)
 
       > div.card-content
         padding 1rem 1.2rem
         min-height 320px
         position relative
 
-      > div.card-info-avatarimg
-        overflow hidden
-        background var(--efu-yellow)
-        transition 1.5s
-        min-height 160px
-        position relative
-        box-shadow var(--efu-shadow-yellow)
+  > .card-widget.card-info
+    &:before
+      background linear-gradient(-25deg, var(--efu-main), var(--efu-main-op-deep))
+      background-size 400%
+      position absolute
+      width 100%
+      height 100%
+      left 0
+      top 0
+      content ''
+      animation gradient 15s ease infinite
+
+    > div.card-content
+      padding 1rem 1.2rem
+      min-height 320px
+      position relative
+
+    > div.card-info-avatarimg
+      overflow hidden
+      background var(--efu-yellow)
+      transition 1.5s
+      min-height 160px
+      position relative
+      box-shadow var(--efu-shadow-yellow)
+
+      &:hover img
+        transform scale(1.03)
+
+  .card-info
+    .avatar-sticker
+      position absolute
+      bottom -2px
+      right -2px
+      width 33px
+      height 33px
+      line-height 34px
+      z-index 0
+      display flex
+      align-items center
+      justify-content center
+      transition .3s .2s
+      transform scale(1)
+      background var(--efu-card-bg)
+      border-radius 50%
 
-        &:hover img
-          transform scale(1.03)
+      img
+        width 26px
+        height 26px
 
-    .card-info
-      .avatar-sticker
-        position absolute
-        bottom -2px
-        right -2px
-        width 33px
-        height 33px
-        line-height 34px
-        z-index 0
-        display flex
-        align-items center
-        justify-content center
-        transition .3s .2s
-        transform scale(1)
-        background var(--efu-card-bg)
-        border-radius 50%
+      ../ :hover .avatar-sticker
+        opacity 0
+        transform scale(0)
+
+    .author-info__desc
+      font-size 12px
+      color var(--efu-card-bg)
+      opacity .6
+      line-height 1
+
+    #author-info__sayhi
+      text-align center
+      width fit-content
+      color var(--efu-white)
+      background var(--efu-white-op)
+      font-size 12px
+      padding 2px 8px
+      border-radius 12px
+      cursor pointer
+      user-select none
+      transition .3s
+      margin auto
+      min-width 100px
 
-        img
-          width 26px
-          height 26px
+      / [data-theme=dark] &
+        background #00000015
+        color var(--efu-black)
 
-        ../ :hover .avatar-sticker
-          opacity 0
-          transform scale(0)
+        &:hover
+          color var(--efu-white)
 
-      .author-info__desc
-        font-size 12px
-        color var(--efu-card-bg)
-        opacity .6
-        line-height 1
+      &:hover
+        background var(--efu-card-bg)
+        color var(--efu-main)
+        transform scale(1.1)
 
-      #author-info__sayhi
-        text-align center
-        width fit-content
-        color var(--efu-white)
-        background var(--efu-white-op)
-        font-size 12px
-        padding 2px 8px
-        border-radius 12px
-        cursor pointer
-        user-select none
-        transition .3s
-        margin auto
-        min-width 100px
+    .card-info-avatar.is-center
+      flex-direction column
+      display flex
+      align-items flex-start
+
+    .avatar-img-group
+      width 118px
+      height 118px
+      right calc(50% - 59px)
+      top 90px
+      border-radius 500px
+      position absolute
+      transition cubic-bezier(.69, .39, 0, 1.21) .3s
+      transform-origin bottom
+      border 5px solid var(--efu-card-bg)
+
+      ../ :hover .avatar-img-group
+        opacity 0
+        transform scale(0)
 
-        / [data-theme=dark] &
-          background #00000015
-          color var(--efu-black)
+    .author-info__name
+      text-align left
+      font-weight 700
+      color var(--efu-card-bg)
+      font-size 20px
+      line-height 1
+      margin-bottom 5px
 
-          &:hover
-            color var(--efu-white)
+    .author-info__top-group
+      display flex
+      height 28px
+      width 100%
 
-        &:hover
-          background var(--efu-card-bg)
-          color var(--efu-main)
-          transform scale(1.1)
+    .author-info__description_group
+      position absolute
+      top 50px
+      width 100%
+      left 0
+      padding 1.2rem
+      opacity 0
+      transition .3s
 
-      .card-info-avatar.is-center
-        flex-direction column
-        display flex
-        align-items flex-start
+      ../ :hover .author-info__description_group
+        opacity 1
 
-      .avatar-img-group
-        width 118px
-        height 118px
-        right calc(50% - 59px)
-        top 90px
-        border-radius 500px
-        position absolute
-        transition cubic-bezier(.69, .39, 0, 1.21) .3s
-        transform-origin bottom
-        border 5px solid var(--efu-card-bg)
+      .author-info__description
+        line-height 1.38
+        margin .3rem 0
+        text-align left
+        color var(--efu-card-bg)
 
-        ../ :hover .avatar-img-group
-          opacity 0
-          transform scale(0)
+        b
+          color var(--efu-card-bg)
 
-      .author-info__name
+      .author-info__description2
+        line-height 1.38
+        margin .3rem 0
         text-align left
-        font-weight 700
+        width 100%
+        z-index 2
         color var(--efu-card-bg)
-        font-size 20px
-        line-height 1
-        margin-bottom 5px
 
-      .author-info__top-group
-        display flex
-        height 28px
-        width 100%
+        b
+          color var(--efu-card-bg)
 
-      .author-info__description_group
-        position absolute
-        top 50px
-        width 100%
-        left 0
-        padding 1.2rem
-        opacity 0
+    .author-info__bottom-group
+      display flex
+      justify-content space-between
+      position absolute
+      padding 1.2rem
+      width 100%
+      left 0
+      bottom 0
+      align-items center
+
+      a.author-info__bottom-group-left:hover
+        opacity .8
+
+    .card-info-data
+      display table
+      margin .7rem 0 .2rem
+      width 100%
+      table-layout fixed
+
+      > div:nth-child(0) > a > div.headline
+        font-weight 700
+
+      > .card-info-data-item
+        display table-cell
         transition .3s
 
-        ../ :hover .author-info__description_group
-          opacity 1
+        a
+          .headline
+            color var(--efu-fontcolor)
+            font-size 1em
 
-        .author-info__description
-          line-height 1.38
-          margin .3rem 0
-          text-align left
-          color var(--efu-card-bg)
+          .length-num
+            margin-top -.3rem
+            color var(--text-highlight-color)
+            font-size 1.4em
 
-          b
-            color var(--efu-card-bg)
+        &:hover
+          background #000
+          border-radius 5px
 
-        .author-info__description2
-          line-height 1.38
-          margin .3rem 0
-          text-align left
-          width 100%
-          z-index 2
-          color var(--efu-card-bg)
+    .card-info-social-icons
+      margin 0
+      display flex
+      justify-content flex-start
+      flex-direction row
+      flex-wrap nowrap
+      cursor pointer
 
-          b
-            color var(--efu-card-bg)
+      .social-icon
+        margin 0
+        margin-left 8px
+        color var(--efu-fontcolor)
+        font-size 1.4em
+        cursor pointer
+        display flex
 
-      .author-info__bottom-group
+      i
+        transition all .3s ease 0s
+        padding 8px
+        border-radius 32px
+        cursor pointer
+        background var(--efu-white-op)
+        color var(--efu-card-bg)
+        width 40px
+        height 40px
         display flex
-        justify-content space-between
-        position absolute
-        padding 1.2rem
-        width 100%
-        left 0
-        bottom 0
         align-items center
+        justify-content center
 
-        a.author-info__bottom-group-left:hover
-          opacity .8
+        &:hover
+          background var(--efu-white)
+          transform scale(1.1)
+          color var(--efu-main)
+          box-shadow none
 
-      .card-info-data
-        display table
-        margin .7rem 0 .2rem
-        width 100%
-        table-layout fixed
+        / [data-theme=dark] &
+          background var(--efu-black-op)
 
-        > div:nth-child(0) > a > div.headline
-          font-weight 700
+          &:hover
+            background-color var(--efu-black)
+            color var(--efu-white)
 
-        > .card-info-data-item
-          display table-cell
-          transition .3s
+    img.avatar-img
+      width 118px
+      right 0
+      top 0
+      border-radius 500px
+      position absolute
+      opacity 1
+      transition .3s
 
-          a
-            .headline
-              color var(--efu-fontcolor)
-              font-size 1em
+[data-theme=dark] #aside-content
+  > .card-widget.card-info
+    border var(--style-border-always)
 
-            .length-num
-              margin-top -.3rem
-              color var(--text-highlight-color)
-              font-size 1.4em
+#aside-content
+  .card-webinfo
+    .webinfo
+      .webinfo-item-title
+        display flex
 
-          &:hover
-            background #000
-            border-radius 5px
+        i
+          line-height: 2 !important
+          margin-right: 6px
+          width: 16px
+          text-align: center
+          font-size: 16px !important
 
-      .card-info-social-icons
-        margin 0
+      .webinfo-item
         display flex
-        justify-content flex-start
-        flex-direction row
-        flex-wrap nowrap
-        cursor pointer
+        justify-content space-between
+        white-space nowrap
+        -webkit-box-align center
+        align-items center
+        padding .1rem .5rem 0
 
-        .social-icon
-          margin 0
-          margin-left 8px
-          color var(--efu-fontcolor)
-          font-size 1.4em
-          cursor pointer
-          display flex
+        div:first-child
+          -webkit-box-flex 1
+          flex 1 1 0
+          padding-right 1rem
 
-        i
-          transition all .3s ease 0s
-          padding 8px
-          border-radius 32px
-          cursor pointer
-          background var(--efu-white-op)
-          color var(--efu-card-bg)
-          width 40px
-          height 40px
-          display flex
-          align-items center
-          justify-content center
 
-          &:hover
-            background var(--efu-white)
-            transform scale(1.1)
-            color var(--efu-main)
-            box-shadow none
+  .card-allinfo
 
-          / [data-theme=dark] &
-            background var(--efu-black-op)
+    hr
+      display flex
+      position relative
+      margin 1rem 0
+      border 1px dashed var(--efu-theme-op)
 
-            &:hover
-              background-color var(--efu-black)
-              color var(--efu-white)
+    .item-headline
+      display none
 
-      img.avatar-img
-        width 118px
-        right 0
-        top 0
-        border-radius 500px
-        position absolute
-        opacity 1
-        transition .3s
+    .card-tag-cloud
+      max-height 500px
+      overflow hidden
+      position relative
 
-  [data-theme=dark] #aside-content
-    > .card-widget.card-info
-      border var(--style-border-always)
+      &.all-tags
+        max-height none
 
-if "allInfo" in aside
-  #aside-content
-    .card-webinfo
-      .webinfo
-        .webinfo-item-title
-          display flex
+        &:after
+          display none
 
-          i
-            line-height: 2 !important
-            margin-right: 6px
-            width: 16px
-            text-align: center
-            font-size: 16px !important
+      &:after
+        content ""
+        position absolute
+        bottom 0
+        left 0
+        right 0
+        height 150px
+        background-image linear-gradient(to top, var(--efu-card-bg), transparent)
+        pointer-events none
+
+      a
+        display inline-block
+        padding 0 0.3rem
+        font-size .8rem
+        border-radius 8px
 
-        .webinfo-item
-          display flex
-          justify-content space-between
-          white-space nowrap
-          -webkit-box-align center
-          align-items center
-          padding .1rem .5rem 0
+        sup
+          opacity .6
+          margin-left 2px
 
-          div:first-child
-            -webkit-box-flex 1
-            flex 1 1 0
-            padding-right 1rem
+        &:hover
+          background var(--efu-theme)
+          color var(--efu-white) !important
+          box-shadow var(--efu-shadow-theme)
+          cursor pointer
+          border-radius 5px
 
+        &.tags-cloud-more
+          width 100%
+          text-align center
+          border-radius 8px !important
+          border var(--style-border)
+          margin-top 8px
+          font-size 16px !important
+
+    span#more-tags-btn
+      transition .3s
+      width 100%
+      text-align center
+      background var(--efu-secondbg)
+      color var(--efu-fontcolor)
+      border-radius 8px
+      display flex
+      justify-content center
+      font-size 14px
+      padding 4px 0
+      border var(--style-border-always)
+      box-shadow var(--heo-shadow-border)
+      cursor pointer
 
-    .card-allinfo
+      &:hover
+        background var(--efu-main)
 
-      hr
-        display flex
-        position relative
-        margin 1rem 0
-        border 1px dashed var(--efu-theme-op)
+  .card-archives
+    ul.card-archive-list
+      margin 0
+      padding 0
+      list-style none
+      display: flex
+      flex-direction: row
+      justify-content: space-between
+      flex-wrap: wrap
 
-      .item-headline
-        display none
+      > .card-archive-list-item
+        width 100%
+        flex 0 0 48%
 
-      .card-tag-cloud
-        max-height 500px
-        overflow hidden
-        position relative
+        a
+          display inline-block
+          padding .15rem .5rem
+          width 100%
+          color var(--efu-fontcolor)
+          transition all .4s ease 0s
+          border-radius: 8px
+          margin: 4px 0
+          flex-direction: column
+          align-content: space-between
+          border: var(--style-border)
+
+          &:hover
+            background-color var(--efu-theme)
+            color var(--efu-card-bg)
+            border-radius 5px
+            box-shadow: var(--efu-shadow-theme)
+            padding: .15rem .5rem
+            border: var(--style-border-hover)
+            cursor pointer
 
-        &.all-tags
-          max-height none
+          span
+            display inline-block
+            vertical-align bottom
 
-          &:after
-            display none
+            &:last-child
+              text-align right
+              margin-left: 4px
 
-        &:after
-          content ""
-          position absolute
-          bottom 0
-          left 0
-          right 0
-          height 150px
-          background-image linear-gradient(to top, var(--efu-card-bg), transparent)
-          pointer-events none
+          .card-archive-list-count-group
+            display flex
+            flex-direction row
 
-        a
-          display inline-block
-          padding 0 0.3rem
-          font-size .8rem
-          border-radius 8px
+            span.card-archive-list-count
+              ext-align left
+              font-size 1.1rem
+              line-height 0.9
+              font-weight bold
+
+            .card-archive-list-count-unit
+              width auto
+              text-align left
+              font-size 14px
+              font-weight 700
 
-          sup
+          .card-archive-list-date
+            font-size 14px
             opacity .6
-            margin-left 2px
 
-          &:hover
-            background var(--efu-theme)
-            color var(--efu-white) !important
-            box-shadow var(--efu-shadow-theme)
-            cursor pointer
-            border-radius 5px
 
-          &.tags-cloud-more
-            width 100%
-            text-align center
-            border-radius 8px !important
-            border var(--style-border)
-            margin-top 8px
-            font-size 16px !important
+#aside-content .card-tag-cloud a.highlight
+  color var(--efu-lighttext)
+  font-weight 500
 
-      a#more-tags-btn
-        width 100%
-        text-align center
-        background var(--efu-secondbg)
-        color var(--efu-fontcolor)
-        border-radius 8px
+#aside-content
+  .card-recent-post
+    .aside-list
+      .aside-list-item
+        padding 2px 6px 8px 6px
+        border-radius 12px
+        transition .3s
+        margin 4px 0
+        cursor pointer
         display flex
-        justify-content center
-        font-size 14px
-        user-select none
-        padding 4px 0
-        border var(--style-border-always)
-        box-shadow var(--heo-shadow-border)
-
-    .card-archives
-      ul.card-archive-list
-        margin 0
-        padding 0
-        list-style none
-        display: flex
-        flex-direction: row
-        justify-content: space-between
-        flex-wrap: wrap
-
-        > .card-archive-list-item
-          width 100%
-          flex 0 0 48%
+        align-items flex-start
 
-          a
-            display inline-block
-            padding .15rem .5rem
-            width 100%
-            color var(--efu-fontcolor)
-            transition all .4s ease 0s
-            border-radius: 8px
-            margin: 4px 0
-            flex-direction: column
-            align-content: space-between
-            border: var(--style-border)
-
-            &:hover
-              background-color var(--efu-theme)
-              color var(--efu-card-bg)
-              border-radius 5px
-              box-shadow: var(--efu-shadow-theme)
-              padding: .15rem .5rem
-              border: var(--style-border-hover)
-              cursor pointer
-
-            span
-              display inline-block
-              vertical-align bottom
-
-              &:last-child
-                text-align right
-                margin-left: 4px
-
-            .card-archive-list-count-group
-              display flex
-              flex-direction row
-
-              span.card-archive-list-count
-                ext-align left
-                font-size 1.1rem
-                line-height 0.9
-                font-weight bold
-
-              .card-archive-list-count-unit
-                width auto
-                text-align left
-                font-size 14px
-                font-weight 700
-
-            .card-archive-list-date
-              font-size 14px
-              opacity .6
-
-
-  if hexo-config('aside.tags.highlight')
-    for tag in highlightTags
-      tag = '"/tags/' + tag + '/"'
-      #aside-content .card-tag-cloud a[href*={tag}]
-        color var(--efu-lighttext)
-        font-weight 500
-
-if "newestPost" in aside
-  #aside-content
-    .card-recent-post
-      .aside-list
-        .aside-list-item
-          padding 2px 6px 8px 6px
-          border-radius 12px
+        &:hover
+          background var(--efu-main)
+          color var(--efu-white)
           transition .3s
-          margin 4px 0
-          cursor pointer
-          display flex
-          align-items flex-start
+          box-shadow var(--efu-shadow-main)
 
-          &:hover
-            background var(--efu-main)
+          .content a
             color var(--efu-white)
-            transition .3s
-            box-shadow var(--efu-shadow-main)
 
-            .content a
-              color var(--efu-white)
+        .thumbnail
+          -webkit-mask-image -webkit-radial-gradient(center, #fff, #000)
+          border-radius 8px
+          border var(--style-border)
+          display flex
+          align-items center
+          overflow hidden
+          width 2.1em
+          height 2.1em
+          margin-top 4px
+
+          img
+            width 140%
+            height 140%
+            transition all .6s ease 0s
+            object-fit cover
+
+        .content
+          -webkit-box-flex 1
+          flex 1 1 0
+          padding-left 10px
+          word-break break-all
+          display flex
+          flex-direction column
 
-          .thumbnail
-            -webkit-mask-image -webkit-radial-gradient(center, #fff, #000)
-            border-radius 8px
-            border var(--style-border)
-            display flex
-            align-items center
+          .title
+            font-weight 700
+            padding 2px 0
+            margin-bottom 8px
+            color var(--efu-fontcolor)
+            font-size 95%
+            line-height 1.3
+            -webkit-line-clamp 2
             overflow hidden
-            width 2.1em
-            height 2.1em
-            margin-top 4px
-
-            img
-              width 140%
-              height 140%
-              transition all .6s ease 0s
-              object-fit cover
-
-          .content
-            -webkit-box-flex 1
-            flex 1 1 0
-            padding-left 10px
-            word-break break-all
-            display flex
-            flex-direction column
-
-            .title
-              font-weight 700
-              padding 2px 0
-              margin-bottom 8px
-              color var(--efu-fontcolor)
-              font-size 95%
-              line-height 1.3
-              -webkit-line-clamp 2
-              overflow hidden
-
-            .article-recent_post_categories
-              font-size 12px
-              font-weight 700
-              opacity .6
-              line-height 1
-
-if "flip" in aside
-  favicon = hexo-config('aside.flip.favicon')
-  face = hexo-config('aside.flip.face')
-  faceback = hexo-config('aside.flip.backface')
-  backcolor = convert(hexo-config('aside.flip.backcolor'))
-
-  #aside-content
-    .card-widget.card-platform
-      background backcolor
-      display flex
-      justify-content center
-      align-content center
-      padding 0
-      cursor pointer
-      border none
-      height 110px
-      border var(--style-border)
-      transition 0.6s
 
-      &:before
-        position absolute
-        width 100%
-        height 100%
-        left 0
-        top 0
-        background url(favicon) center center no-repeat
-        content ''
-        background-size cover
-        transition .2s cubic-bezier(.45, .04, .43, 1.21)
-
-      &:hover:before
-        top 100%
-        opacity 0
-        transition .3s ease-out
+          .article-recent_post_categories
+            font-size 12px
+            font-weight 700
+            opacity .6
+            line-height 1
 
-      &:hover
-        #flip-content
-          transform rotateY(180deg)
 
-      #flip-wrapper
-        perspective 1000
-        position relative
-        width 235px
-        height 110px
-        z-index 1
+favicon = hexo-config('aside.flip.favicon')
+face = hexo-config('aside.flip.face')
+faceback = hexo-config('aside.flip.backface')
+backcolor = convert(hexo-config('aside.flip.backcolor'))
 
-      #flip-wrapper #flip-content
-        width 100%
-        height 100%
-        transform-style preserve-3d
-        transition cubic-bezier(0, 0, 0, 1.29) 0.3s
+#aside-content
+  .card-widget.card-platform
+    background backcolor
+    display flex
+    justify-content center
+    align-content center
+    padding 0
+    cursor pointer
+    border none
+    height 110px
+    border var(--style-border)
+    transition 0.6s
 
-      #flip-wrapper #flip-content .face
-        position absolute
-        width 100%
-        height 100%
-        -webkit-backface-visibility hidden
-        backface-visibility hidden
-        background url(face) center center no-repeat
-        background-size 100%
+    &:before
+      position absolute
+      width 100%
+      height 100%
+      left 0
+      top 0
+      background url(favicon) center center no-repeat
+      content ''
+      background-size cover
+      transition .2s cubic-bezier(.45, .04, .43, 1.21)
+
+    &:hover:before
+      top 100%
+      opacity 0
+      transition .3s ease-out
 
-      #flip-wrapper #flip-content .face.back
-        display block
-        -webkit-transform rotateY(180deg)
+    &:hover
+      #flip-content
         transform rotateY(180deg)
-        box-sizing border-box
-        background url(faceback) center center no-repeat
-        background-size 100%
+
+    #flip-wrapper
+      perspective 1000
+      position relative
+      width 235px
+      height 110px
+      z-index 1
+
+    #flip-wrapper #flip-content
+      width 100%
+      height 100%
+      transform-style preserve-3d
+      transition cubic-bezier(0, 0, 0, 1.29) 0.3s
+
+    #flip-wrapper #flip-content .face
+      position absolute
+      width 100%
+      height 100%
+      -webkit-backface-visibility hidden
+      backface-visibility hidden
+      background url(face) center center no-repeat
+      background-size 100%
+
+    #flip-wrapper #flip-content .face.back
+      display block
+      -webkit-transform rotateY(180deg)
+      transform rotateY(180deg)
+      box-sizing border-box
+      background url(faceback) center center no-repeat
+      background-size 100%