hexo-theme-solitude 1.4.0 → 1.4.2

package/source/css/_global/index.styl

@@ -54,8 +54,4 @@
   --card-box-shadow 0 3px 8px 6px rgba(7, 17, 27, 0.06)
   --card-hover-box-shadow 0 3px 8px 6px rgba(7, 17, 27, 0.15)
   --offset 0px
-  --hlscrollbar-bg #121212
-
-  +maxWidth768()
-    --style-border 0px solid var(--sco-none)
-    --style-border-hover 0px solid var(--sco-main)
+  --hlscrollbar-bg #121212

package/source/css/_layout/basic.styl

@@ -192,7 +192,6 @@ button
 
 img
   border-style none
-  border-radius 8px
   max-width 100%
   transition all .2s ease 0s
   -webkit-user-drag none
@@ -295,4 +294,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/_mode/index.styl

@@ -86,4 +86,9 @@
   --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
+  --sco-hltools-bg $hltools_bg_light
+
+:root
+  +maxWidth768()
+    --style-border 0px solid var(--sco-none)
+    --style-border-hover 0px solid var(--sco-main)

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

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

@@ -0,0 +1,27 @@
+#about-page
+  .author-content-item.careers
+    min-height 400px
+
+    img
+      position absolute
+      left 0
+      bottom 20px
+      width 100%
+      transition .6s
+      user-select none
+
+    .careers-group
+      margin-top 12px
+
+    .careers-item
+      display flex
+      align-items center
+
+      .circle
+        width 16px
+        height 16px
+        margin-right 8px
+        border-radius 16px
+
+      .name
+        color var(--sco-secondtext)

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

@@ -0,0 +1,78 @@
+#about-page
+  .myInfoAndSayHello
+    display flex
+    flex-direction column
+    justify-content center
+    color var(--sco-white)
+    background linear-gradient(120deg, #5b27ff 0, #00d4ff 100%)
+    background-size 200%
+    animation gradient 15s ease infinite
+    width 59%
+
+    .title1
+      opacity .8
+      line-height 1.3
+
+    .title2
+      font-size 36px
+      font-weight 700
+      line-height 1.1
+      margin .5rem 0
+
+    .inline-word
+      word-break keep-all
+      white-space nowrap
+
+  .aboutsiteTips
+    display flex
+    justify-content center
+    align-items flex-start
+    flex-direction column
+    width 39%
+
+    h2
+      margin-right auto
+      font-size 36px
+      font-family Helvetica
+      line-height 1.06
+      letter-spacing -.02em
+      color var(--sco-fontcolor)
+      margin-top 0
+
+    .mask
+      height 36px
+      position relative
+      overflow hidden
+      margin-top 4px
+
+      span
+        display block
+        box-sizing border-box
+        position absolute
+        top 36px
+        padding-bottom var(--offset)
+        background-size 100% 100%
+        -webkit-background-clip text
+        background-clip text
+        -webkit-text-fill-color transparent
+        background-repeat no-repeat
+
+        &[data-show]
+          transform translateY(-100%)
+          transition .5s transform ease-in-out
+
+        &[data-up]
+          transform translateY(-200%)
+          transition .5s transform ease-in-out
+
+      span:nth-child(1)
+        background-image linear-gradient(45deg, #0ecffe 50%, #07a6f1)
+
+      span:nth-child(2)
+        background-image linear-gradient(45deg, #18e198 50%, #0ec15d)
+
+      span:nth-child(3)
+        background-image linear-gradient(45deg, #8a7cfb 50%, #633e9c)
+
+      span:nth-child(4)
+        background-image linear-gradient(45deg, #fa7671 50%, #f45f7f)

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

@@ -0,0 +1,41 @@
+#about-page
+  .author-content-item.game-apex
+    min-height 300px
+    overflow hidden
+    color var(--sco-white)
+    width 59%
+
+    &::after
+      box-shadow 0 -69px 203px 11px #04120f inset
+      position absolute
+      content ''
+      width 100%
+      height 100%
+      top 0
+      left 0
+
+    .card-content
+      position absolute
+      width 100%
+      height 100%
+      top 0
+      left 0
+      z-index 2
+      display flex
+      flex-direction column
+      padding 1rem 2rem
+
+  .author-content-item.game-jl
+    width 39%
+    min-height 300px
+    overflow hidden
+    color var(--sco-white)
+
+    &::after
+      box-shadow 0 -69px 203px 11px #415dc9 inset
+      position absolute
+      content ''
+      width 100%
+      height 100%
+      top 0
+      left 0

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

@@ -1 +1,39 @@
-@import "./tenyear.styl"
+#about-page
+  display flex
+  padding-top 1rem
+  flex-direction column
+  align-items center
+
+  .author-title
+    font-size 2rem
+    font-weight 700
+    margin 1rem 0
+    line-height 1
+
+@import "tenyear"
+
+@import "author"
+
+@import "contentinfo"
+
+@import "skills"
+
+@import "oneself"
+
+@import "buff"
+
+@import "game"
+
+@import "personalities"
+
+@import "myphoto"
+
+@import "careers"
+
+@import "like"
+
+@import "maxim"
+
+@import "statistic"
+
+@import "reward"

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

@@ -0,0 +1,29 @@
+#about-page
+  .author-content-item.like-technology
+    background-size cover
+    min-height 230px
+    color var(--sco-white)
+
+    &::after
+      box-shadow 0 -69px 203px 11px #050b20 inset
+      position absolute
+      content ''
+      width 100%
+      height 100%
+      top 0
+      left 0
+
+  .author-content-item.like-music
+    background-size cover
+    min-height 400px
+    color var(--sco-white)
+    overflow hidden
+
+    &::after
+      box-shadow 0 -69px 203px 11px #0e0e0e inset
+      position absolute
+      content ''
+      width 100%
+      height 100%
+      top 0
+      left 0

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

@@ -0,0 +1,23 @@
+#about-page
+  .author-content-item.maxim
+    font-size 36px
+    font-weight 700
+    line-height 1.1
+    display flex
+    align-items flex-start
+    flex-direction column
+    justify-content center
+    width 39%
+
+    .maxim-title
+      display flex
+      flex-direction column
+
+      span:first-child
+        opacity 0.6
+        margin-bottom 8px
+
+    .title1
+      opacity .8
+      font-size .6rem
+      margin-bottom .5rem

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

@@ -0,0 +1,34 @@
+#about-page
+  .author-content-item.myphoto
+    height 60%
+    min-height 240px
+    position relative
+    overflow hidden
+    width 39%
+    display flex
+    align-items center
+    justify-content center
+
+    img
+      position absolute
+      height 100%
+      min-width 100%
+      object-fit cover
+      transition .6s
+      user-select none
+
+    &:hover
+      img
+        min-width 105%
+        transition 2s
+
+    .myphoto-title
+      position absolute
+      bottom 0
+      left 0
+      width 100%
+      background var(--sco-maskbgdeep)
+      padding .5rem 2rem
+      backdrop-filter saturate(180%) blur(20px)
+      -webkit-backdrop-filter blur(20px)
+      transform translateZ(0)

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

@@ -0,0 +1,91 @@
+#about-page
+  .author-content-item-group
+    &.column
+      display flex
+      flex-direction column
+      width 49%
+      justify-content space-between
+
+      +maxWidth768()
+        width 100% !important
+
+    &.mapAndInfo
+      width 59%
+
+  .author-content-item
+    +minWidth1300()
+      animation slide-in .6s 0s backwards
+
+    &.map
+      background var(--site-about-oneself-map--light) no-repeat center
+      min-height 160px
+      max-height 400px
+      position relative
+      overflow hidden
+      margin-bottom 0.5rem
+      height 60%
+      background-size 100%
+      transition 1s ease-in-out
+
+      .map-title
+        position absolute
+        bottom 0
+        left 0
+        width 100%
+        background var(--sco-maskbg)
+        padding 0.5rem 2rem
+        backdrop-filter saturate(180%) blur(20px)
+        transition 1s ease-in-out
+        font-size 20px
+        transform translateZ(0)
+
+        +maxWidth768()
+          padding 1rem
+
+        b
+          color var(--sco-fontcolor)
+
+      +maxWidth768()
+        margin-bottom 0
+
+      [data-theme=dark] &
+        background var(--site-about-oneself-map--dark) no-repeat center
+        background-size 100%
+
+      &:hover
+        background-size 120%
+        transition 4s ease-in-out
+        background-position-x 0
+        background-position-y 36%
+
+        .map-title
+          bottom -100%
+
+  .author-content-item.selfInfo
+    display flex
+    min-height 100px
+    max-height 400px
+    justify-content space-between
+    align-items center
+    flex-wrap wrap
+    height -webkit-fill-available
+    height 40%
+
+    +maxWidth1300()
+      height 70%
+
+    div
+      display flex
+      flex-direction column
+      margin .5rem 2rem .5rem 0
+
+    .selfInfo-title
+      opacity .8
+      font-size .6rem
+      line-height 1
+      margin-bottom 8px
+
+    .selfInfo-content
+      font-weight 700
+      font-size 34px
+      line-height 1

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

@@ -0,0 +1,25 @@
+.author-content-item.personalities
+  overflow hidden
+  position relative
+  width 59%
+  +maxWidth768()
+    min-height 360px
+
+  .title2
+    font-size 36px
+    font-weight 700
+    line-height 1.1
+
+  .image
+    position absolute
+    right -40px
+    bottom -10rem
+    transition transform 2s cubic-bezier(.13, .45, .21, 1.02)
+    user-select none
+
+    +maxWidth768()
+      right -70px
+
+  &:hover
+    .image
+      transform rotate(-10deg)

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

@@ -0,0 +1,113 @@
+#about-page
+  .author-content-item
+    &.single.reward
+      .author-content-item
+        .author-content-item-title
+          color var(--sco-red)
+
+      .reward-list-updateDate
+        color var(--sco-gray)
+        font-size 14px
+
+      .author-content-item-description
+        font-size 16px
+        margin-top .5rem
+
+      .reward-list-all
+        display flex
+        flex-wrap wrap
+        flex-direction row
+        margin 1rem -.25rem .5rem
+
+        .post-reward
+          position absolute
+          right 2rem
+          top 2rem
+
+          .reward-main
+            top 60px
+            right 0
+            left auto
+            bottom auto
+            width fit-content
+            box-shadow var(--sco-shadow-border)
+
+            .reward-all::before
+              bottom auto
+              top -16px
+
+          .reward-button
+            padding 8px 12px
+            background var(--sco-red)
+            border-radius 12px
+            color var(--sco-white)
+            display flex
+            align-items center
+            z-index 1
+            transition .3s
+            cursor pointer
+            box-shadow none
+            width fit-content
+            height fit-content
+            line-height 2
+            user-select none
+
+            +maxWidth768()
+              display none
+
+          &:hover
+            .reward-button
+              filter brightness(1.1)
+
+        .reward-list-item
+          padding 1rem
+          border-radius 12px
+          border var(--style-border-always)
+          width calc((100% / 6) - .5rem)
+          margin 0 .25rem .5rem .25rem
+          box-shadow var(--sco-shadow-border)
+          flex-direction column
+          justify-content space-between
+
+          +maxWidth1200()
+            width calc((100% / 4) - .5rem)
+
+          +maxWidth900()
+            width calc((100% / 2) - .5rem)
+
+          +maxWidth768()
+            width 100%
+
+          .reward-list-item-name
+            font-size 1rem
+            font-weight 700
+            line-height 1
+            margin-bottom .5rem
+            white-space nowrap
+            overflow hidden
+            text-overflow ellipsis
+
+          .reward-list-bottom-group
+            display flex
+            align-items center
+            justify-content space-between
+
+          .reward-list-item-money
+            padding 4px
+            background var(--sco-fontcolor)
+            color var(--sco-card-bg)
+            font-size 12px
+            line-height 1
+            border-radius 4px
+            margin-right 4px
+            white-space nowrap
+
+          .reward-list-item-time
+            font-size 12px
+            color var(--sco-secondtext)
+            white-space nowrap
+
+    .reward-list-tips
+      p
+        font-size 12px
+        color var(--sco-secondtext)