hexo-theme-solitude 1.3.1 → 1.4.1

package/source/css/_global/function.styl

@@ -1,83 +1,83 @@
 maxWidth600()
-	@media screen and (max-width: 600px)
-		{block}
+  @media screen and (max-width: 600px)
+    {block}
 
 maxWidth768()
-	@media screen and (max-width: 768px)
-		{block}
+  @media screen and (max-width: 768px)
+    {block}
 
 minWidth768()
-	@media screen and (min-width: 768px)
-		{block}
+  @media screen and (min-width: 768px)
+    {block}
 
 maxWidth798()
-	@media screen and (max-width: 798px)
-		{block}
+  @media screen and (max-width: 798px)
+    {block}
 
 minWidth798()
-	@media screen and (min-width: 798px)
-		{block}
+  @media screen and (min-width: 798px)
+    {block}
 
 maxWidth899()
-	@media screen and (max-width: 899px)
-		{block}
+  @media screen and (max-width: 899px)
+    {block}
 
 minWidth899()
-	@media screen and (min-width: 899px)
-		{block}
+  @media screen and (min-width: 899px)
+    {block}
 
 maxWidth900()
-	@media screen and (max-width: 900px)
-		{block}
+  @media screen and (max-width: 900px)
+    {block}
 
 minWidth900()
-	@media screen and (min-width: 900px)
-		{block}
+  @media screen and (min-width: 900px)
+    {block}
 
 maxWidth1300()
-	@media screen and (max-width: 1300px)
-		{block}
+  @media screen and (max-width: 1300px)
+    {block}
 
 minWidth1300()
-	@media screen and (min-width: 1300px)
-		{block}
+  @media screen and (min-width: 1300px)
+    {block}
 
 maxWidth1400()
-	@media screen and (max-width: 1400px)
-		{block}
+  @media screen and (max-width: 1400px)
+    {block}
 
 minWidth1400()
-	@media screen and (min-width: 1400px)
-		{block}
+  @media screen and (min-width: 1400px)
+    {block}
 
 maxWidth1200()
-	@media screen and (max-width: 1200px)
-		{block}
+  @media screen and (max-width: 1200px)
+    {block}
 
 minWidth1200()
-	@media screen and (min-width: 1200px)
-		{block}
+  @media screen and (min-width: 1200px)
+    {block}
 
 maxWidth1024()
-	@media screen and (max-width: 1024px)
-		{block}
+  @media screen and (max-width: 1024px)
+    {block}
 
 maxWidth900()
-	@media screen and (max-width: 900px)
-		{block}
+  @media screen and (max-width: 900px)
+    {block}
 
 minWidth901()
-	@media screen and (min-width: 901px)
-		{block}
+  @media screen and (min-width: 901px)
+    {block}
 
 minWidth900()
-	@media screen and (min-width: 900px)
-		{block}
+  @media screen and (min-width: 900px)
+    {block}
 
 minWidth2000()
-	@media screen and (min-width: 2000px)
-		{block}
+  @media screen and (min-width: 2000px)
+    {block}
 
 maxHeight800()
-	@media screen and (max-height: 800px)
-		{block}
+  @media screen and (max-height: 800px)
+    {block}

package/source/css/_global/index.styl

@@ -9,7 +9,7 @@
   --sco-cyan #00bcd4
   --sco-cyan-op #00bcd42b
   --sco-vip #e5a80d
-  --sco-life #57bd6a
+  --sco-speed #57bd6a
   --sco-main var(--sco-theme)
   --sco-main-op var(--sco-theme-op)
   --sco-main-op-deep var(--sco-theme-op-deep)

package/source/css/_layout/basic.styl

@@ -24,8 +24,8 @@ body
   margin 0
 
 ::selection
-  background var(--sco-fontcolor)
-  color var(--sco-background)
+  background var(--sco-main)
+  color var(--sco-white)
 
 i.scoicon
   font-size 22px
@@ -59,6 +59,9 @@ a
   overflow-wrap break-word
   -webkit-user-drag none
 
+  &:hover
+    color var(--sco-lighttext)
+
 abbr[title]
   border-bottom none
   text-decoration underline dotted
@@ -95,7 +98,7 @@ button, input
   overflow visible
 
 input::placeholder
-  color var(--sco-gray) !important
+  color var(--sco-gray)
 
 button, select
   text-transform none
@@ -179,10 +182,6 @@ table td, table th
   border 1px solid var(--light-grey)
   vertical-align middle
 
-::selection
-  background #0079ff
-  color #f7f7f7
-
 button
   padding 0
   outline 0
@@ -192,9 +191,11 @@ button
   cursor pointer
 
 img
-  max-width 100%
-  transition all .2s ease 0s;
   border-style none
+  border-radius 8px
+  max-width 100%
+  transition all .2s ease 0s
+  -webkit-user-drag none
 
 img:not([src]), img[src=""]
   opacity 0
@@ -205,9 +206,6 @@ img:not([src]), img[src=""]
   margin-top 8px
   color var(--sco-secondtext)
 
-.img-alt:hover
-  text-decoration none !important
-
 .is-center
   text-align center
   display flex
@@ -297,4 +295,9 @@ table thead
   background var(--sco-secondbg)
 
 b, strong
-  color var(--sco-lighttext)
+  color var(--sco-lighttext)
+
+.button--animated
+  border-radius 8px
+  transition .3s
+  position relative

package/source/css/_layout/header.styl

@@ -332,7 +332,7 @@
     transition .3s
     display flex
     height 35px
-    min-width 70px
+    min-width 50px
     justify-content center
     align-items center
     border-radius 40px
@@ -375,7 +375,12 @@
           transition all .3s, color 0s, opacity .3s
 
     if hexo-config('site.name.class') == text
-      span
+      span.title
+        letter-spacing normal
+        font-size 1rem
+        font-weight 700
+        padding 0 5px
+        line-height 2rem
         +maxWidth768()
           padding-left 8px
 

package/source/css/_layout/index.styl

@@ -19,21 +19,22 @@
     width calc(100% - 300px)
 
     +maxWidth1200()
-      width 100% !important
+      width 100%
 
   > div:first-child:not(.recent-posts)
     box-shadow var(--sco-shadow-border)
     padding 1rem 2rem
     border-radius 12px
-    width calc(100% - 300px)
-    background var(--sco-card-bg);
-    border var(--style-border);
+    background var(--sco-card-bg)
+    border var(--style-border)
     align-self flex-start
     animation slide-in .6s .1s backwards
     position relative
     overflow hidden
 
     +maxWidth768()
+      box-shadow none
+      border none
       padding 0 1rem
       background var(--sco-background)
 
@@ -41,6 +42,7 @@ span.tags-punctuation::before
   content: "\e071"
   font-family: scoicon, serif !important
   font-size: 12px
+  transition none
   margin-right: 2px
   opacity: .4
 
@@ -49,4 +51,56 @@ span.tags-punctuation::before
 
   #post-info &
     font-size 14px
-    line-height 32px
+    line-height 32px
+
+// snackbar
+.snackbar-container 
+  background var(--sco-lighttext)!important
+  color var(--sco-card-bg)!important
+  border-radius 0!important
+  display flex
+  justify-content center!important
+  max-width none!important
+  min-width 100%!important
+  margin 0!important
+  left 0!important
+  height 60px!important
+  transform none!important
+
+.snackbar-container p 
+  color var(--sco-card-bg)!important
+  font-weight 700!important
+  text-align center!important
+  font-size .8rem!important
+  display flex!important
+  justify-content center!important
+
+.snackbar-container .action 
+  color var(--sco-card-bg)!important
+  background var(--sco-lighttext)!important
+  padding 4px 6px!important
+  font-weight 700
+  border-radius 8px!important
+  transition .3s
+  border var(--style-border)!important
+.snackbar-container .action:hover 
+  color var(--sco-lighttext)!important
+  background var(--sco-card-bg)!important
+
+.snackbar-container::after 
+  position absolute
+  width 0
+  height 100%
+  left 0
+  top 0
+  background var(--sco-white)
+  opacity .1
+  content ""
+  animation snackbar-progress var(--sco-snackbar-time) linear forwards
+  pointer-events none
+
+@keyframes snackbar-progress 
+  from 
+    width 0
+  to 
+    width 100%

package/source/css/_mode/index.styl

@@ -42,20 +42,6 @@
   --sco-hl-bg $hl_bg_dark
   --sco-hltools-bg $hltools_bg_dark
 
-  #universe
-    display block
-    position fixed
-    margin 0
-    padding 0
-    border 0
-    outline 0
-    left 0
-    top 0
-    width 100%
-    height 100%
-    pointer-events none
-    z-index 1
-
 [data-theme=light]
   --sco-theme $light_theme
   --sco-theme-op $light_theme_op
@@ -100,6 +86,4 @@
   --style-border-forever 2px solid var(--sco-main)
   --sco-navbg var(--sco-theme-op)
   --sco-hl-bg $hl_bg_light
-  --sco-hltools-bg $hltools_bg_light
-  #universe
-    display none
+  --sco-hltools-bg $hltools_bg_light

package/source/css/_page/_home/home-top.styl

@@ -337,55 +337,32 @@ div#banners
       display flex
       flex-direction row
       flex-wrap wrap
-      height calc(328px + .5rem)
+      justify-content space-between
+      height calc(328px + 0.5rem)
       align-content space-between
       width calc(50% - 0.25rem)
       position relative
       animation slide-in .6s .1s backwards
-      overflow-x visible
-      gap 0.5rem
 
     .recent-post-item
       display flex
-      width 200px
       flex-direction column
+      width calc(100% / 3 - 0.25rem)
       align-items flex-start
-      margin-left .5rem
       background var(--sco-card-bg)
       border-radius 12px
       overflow hidden
-      min-width 200px
       height 164px
       max-height 164px
       border var(--style-border-always)
       transition .3s
       position relative
       box-shadow var(--sco-shadow-border)
-      +minWidth1300()
-        width calc(100% / 3 - 0.35rem)
-        margin-left 0
 
-      +minWidth1200()
-        display flex
-        width calc(100% / 3 - 0.35rem)
-        flex-direction column
-        align-items flex-start
-        margin-left 0
-        background var(--sco-card-bg)
-        border-radius 12px
-        overflow hidden
+      +maxWidth1200()
+        width 200px
         min-width 200px
-        height 164px
-        max-height 164px
-        border var(--style-border-always)
-        transition .3s
-        position relative
-        box-shadow var(--sco-shadow-border)
-
-      +maxWidth768()
-        border-radius 8px
-        box-shadow none
-        clip-path inset(0 0 0 0 round 8px)
+        margin-left .5rem
 
         &:last-child
           margin-right 1rem
@@ -395,7 +372,6 @@ div#banners
 
       .post_cover
         width 100%
-        -webkit-mask-image -webkit-radial-gradient(center, #fff, #000)
 
         a
           height 100px
@@ -421,7 +397,7 @@ div#banners
             transition .3s
             cursor pointer
 
-      .recent-post-info
+      /.recent-post-info
         padding .3rem .5rem .3rem .5rem
         transition .3s
 
@@ -438,6 +414,9 @@ div#banners
           font-size .8rem
           padding 0
 
+          &:hover
+            color var(--sco-fontcolor)
+
 
     .todayCard
       display none

package/source/css/_page/_home/pagination.styl

@@ -31,6 +31,9 @@
       i
         +maxWidth768()
           display none
+  .space
+    +maxWidth768()
+      display none
 
   .page-number
     display inline-block

package/source/css/_page/_home/recent-post.styl

@@ -56,10 +56,11 @@
         color var(--sco-theme)
 
     .post_cover
+      position relative
       transition 1s
       width 100%
-      overflow: hidden
-      height: 100%
+      overflow hidden
+      height 100%
 
       +minWidth1300()
         height 225px
@@ -102,6 +103,12 @@
       display inline-block
       overflow hidden
 
+      span.tags-punctuation
+        transition .3s
+
+        &:hover
+          color var(--sco-main)
+
       .recent-post-info-top
         position relative
         transition .3s
@@ -154,7 +161,7 @@
             &:visited
               color var(--sco-card-bg)
 
-      > .article-meta-wrap
+      /.article-meta-wrap
         position absolute
         bottom 16px
         transition .3s

package/source/css/_page/about/author.styl

@@ -0,0 +1,94 @@
+#about-page
+  .author-info
+    display flex
+    align-items center
+    margin 0 0 16px 0
+
+    .author-tag-left
+      display flex
+      flex-direction column
+      align-items flex-end
+
+      .author-tag
+        &:first-child,
+        &:last-child
+          margin-right -16px
+
+    .author-tag-right
+      display flex
+      flex-direction column
+      align-items flex-start
+
+      .author-tag
+        &:first-child,
+        &:last-child
+          margin-left -16px
+
+    +maxWidth768()
+      .author-tag-left, .author-tag-right
+        display none
+
+    .author-tag
+      transform translate(0, -4px)
+      padding 1px 8px
+      background var(--sco-card-bg)
+      border var(--style-border-always)
+      border-radius 40px
+      margin-top 6px
+      font-size 14px
+      font-weight 700
+      box-shadow var(--sco-shadow-lightblack)
+      animation 6s ease-in-out 0s infinite normal none running floating
+
+      &:nth-child(1)
+        animation-delay 0s
+
+      &:nth-child(2)
+        animation-delay .6s
+
+      &:nth-child(3)
+        animation-delay 1.2s
+
+      &:nth-child(4)
+        animation-delay 1.8s
+
+    .author-img
+      margin 0 30px
+      border-radius 50%
+      width 180px
+      height 180px
+      position relative
+      background var(--sco-secondbg)
+      user-select none
+      transition .3s
+
+      &:hover
+        transform scale(1.1)
+
+      +maxWidth768()
+        width 120px
+        height 120px
+
+        &::before
+          bottom -5px
+          right -5px
+
+      img
+        border-radius 200px
+
+      &::before
+        content ''
+        -webkit-transition 1s
+        -moz-transition 1s
+        -o-transition 1s
+        -ms-transition 1s
+        transition 1s
+        width 30px
+        height 30px
+        background var(--sco-green)
+        position absolute
+        border-radius 50%
+        border 5px solid var(--sco-background)
+        bottom 5px
+        right 10px
+        z-index 2

package/source/css/_page/about/buff.styl

@@ -0,0 +1,34 @@
+#about-page
+  .author-content-item.buff
+    font-size 36px
+    font-weight 700
+    line-height 1.1
+    display flex
+    align-items flex-start
+    flex-direction column
+    justify-content center
+    background linear-gradient(120deg, #ff27e8 0, #ff8000 100%)
+    color var(--sco-white)
+    background-size 200%
+    animation gradient 15s ease infinite
+    min-height 200px
+    height fit-content
+    width 59%
+
+    .card-content
+      display flex
+      flex-direction column
+      justify-content center
+
+    .buff-title
+      display flex
+      flex-direction column
+
+      span:first-child
+        opacity 0.6
+        margin-bottom 8px
+
+    .title1
+      opacity .8
+      font-size .6rem
+      margin-bottom .5rem