hexo-theme-solitude 1.1.3 → 1.2.2

package/source/css/_page/index.styl

@@ -0,0 +1,131 @@
+@import "category.styl"
+
+@import "equipment.styl"
+
+@import "error.styl"
+
+@import "home.styl"
+@import "homeTop.styl"
+
+@import "link.styl"
+
+@import "rss.styl"
+
+@import "moment.styl"
+
+if hexo-config('says.enable')
+  @import "says.styl"
+
+@import "tag.styl"
+
+if hexo-config('about.enable')
+  @import "about.styl"
+
+.author-content.author-content-item.sharePage
+  height 19rem
+  background-size cover
+  color var(--sco-white)
+  overflow hidden
+  margin-top 0
+
+.author-content-item
+  width 49%
+  border-radius 12px
+  background var(--sco-card-bg)
+  border var(--style-border-always)
+  box-shadow var(--sco-shadow-border)
+  position relative
+  padding 1rem 2rem
+  overflow hidden
+
+  &.single
+    width 100%
+
+  .author-content-item-title
+    font-size 36px
+    font-weight 700
+    line-height 1
+
+  .author-content-item-tips
+    opacity .8
+    font-size .6rem
+    margin-bottom .5rem
+
+  .content-bottom
+    margin-top auto
+    display flex
+    align-items center
+    justify-content space-between
+
+    .icon-group
+      display flex
+
+      i
+        display inline-block
+        width 22px
+        height 18px
+        margin-right .5rem
+
+  .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-title
+      margin-bottom .5rem
+
+    .banner-button-group
+      position absolute
+      bottom 1.5rem
+      right 2rem
+
+      .banner-button
+        height 40px
+        width 118px
+        border-radius 20px
+        justify-content center
+        background var(--sco-black-op)
+        color var(--sco-white)
+        display flex
+        align-items center
+        z-index 1
+        transition .3s
+        cursor pointer
+        backdrop-filter saturate(180%) blur(20px)
+        -webkit-backdrop-filter blur(20px)
+        transform translateZ(0)
+
+        &:hover
+          background var(--sco-main)
+          color var(--sco-white)
+
+        i
+          margin-right 8px
+          font-size 22px
+
+@media screen and (max-width: 768px)
+  .author-content-item
+    .card-content
+      .banner-button-group
+        right 1rem
+        bottom 1rem
+
+      .banner-button-group
+        .banner-button
+          background 0 0 !important
+          color var(--sco-white)
+          padding 0
+          width fit-content
+
+          i
+            margin-right 0
+            font-size 1.5rem
+
+      .banner-button-text
+        display none

package/source/css/_page/link.styl

@@ -0,0 +1,433 @@
+// link and tlink
+.flink#article-container
+  .flink-desc
+    margin .2rem 0 .5rem
+
+  .flink-list
+    overflow auto
+    padding 10px 10px 0
+    text-align center
+
+    > .flink-list-item
+      position relative
+      float left
+      overflow hidden
+      margin 15px 7px
+      width calc(25% - 12px)
+      height 90px
+      border-radius 5px
+      line-height 17px
+      transform translateZ(0)
+      transition all .3s ease 0s
+
+      &:hover
+        background #006cf2
+        transform scale(1.05)
+
+      a
+        color var(--sco-fontcolor)
+        text-decoration none
+
+        img
+          float left
+          margin 15px 10px
+          width 60px
+          height 60px
+          border-radius 35px
+          transition all .3s ease 0s
+
+        .img-alt
+          display none
+
+        .flink-item-name
+          display block
+          padding 0 10px 0 0
+          font-weight 700
+          font-size 1.43em
+          max-width calc(100% - 12px)
+          overflow hidden
+          text-overflow ellipsis
+          white-space nowrap
+
+        .flink-item-desc
+          display block
+          padding 4px 10px 0 0
+          height 50px
+          font-size .93em
+
+    &.mini
+      > .flink-list-item
+        height 60px
+
+        a
+          img
+            width 30px
+            height 30px
+            min-width 30px
+            min-height 30px
+
+@media screen and (max-width: 1200px)
+  .flink#article-container .flink-list > .flink-list-item
+    width calc(25% - 12px) !important
+
++maxWidth1024()
+  .flink#article-container .flink-list > .flink-list-item
+    width calc(33.3333% - 12px) !important
+
++maxWidth768()
+  .flink#article-container .flink-list > .flink-list-item
+    width calc(50% - 12px) !important
+
++maxWidth600()
+  .flink#article-container .flink-list > .flink-list-item
+    width calc(100% - 12px) !important
+
+
+.flink#article-container
+  .flink-list.mini
+    > .flink-list-item a .flink-item-desc
+      display none
+
+  .site-card-group
+    display flex
+    flex-wrap wrap
+    justify-content flex-start
+    margin -8px
+    align-items stretch
+
+  .site-card
+    margin 8px
+    width calc(20% - 16px)
+    display block
+    line-height 1.4
+    height 100%
+
+    .img
+      width 100%
+      height 120px
+      overflow hidden
+      border-radius 12px 12px 0 0
+      background #f6f6f6
+      transition all .3s ease 0s
+
+      img
+        width 100%
+        height 100%
+        transition transform 2s ease 0s
+        object-fit cover
+
+    .info
+      margin-top 8px
+
+      img
+        width 32px
+        height 32px
+        border-radius 16px
+        float left
+        margin-right 8px
+        margin-top 2px
+
+      span
+        display block
+
+      .title
+        font-weight 600
+        color #444
+        display -webkit-box
+        overflow hidden
+        -webkit-line-clamp 1
+        transition all .3s ease 0s
+
+      .desc
+        overflow-wrap break-word
+        line-height 1.2
+        color #888
+        display -webkit-box
+        -webkit-box-orient vertical
+        overflow hidden
+        -webkit-line-clamp 2
+
+    .img-alt
+      display none
+
+    &:hover .info .title
+      color #ff5722
+
+@media screen and (max-width: 1200px)
+  .flink#article-container .site-card
+    width calc(20% - 16px) !important
+
++maxWidth1024()
+  .flink#article-container .site-card
+    width calc(25% - 16px) !important
+
++maxWidth768()
+  .flink#article-container .site-card
+    width calc(33.3333% - 16px) !important
+
++maxWidth600()
+  .flink#article-container .site-card
+    width calc(50% - 16px) !important
+
+@media screen and (max-width: 500px)
+  .flink#article-container .site-card .img
+    height 100px
+
+.flink#article-container
+  .flink-list
+    padding 0
+    margin .5rem -6px 1rem -6px
+    overflow-x hidden
+
+  .flink-desc
+    margin 0
+    color var(--sco-secondtext)
+
+  .flink-list > .flink-list-item a .flink-item-desc
+    white-space normal
+    padding 5px 10px 16px 0
+    color var(--sco-fontcolor)
+    text-align left
+    height 40px
+    text-overflow ellipsis
+    opacity .7
+    display -webkit-box
+    overflow hidden
+    -webkit-box-orient vertical
+    -webkit-line-clamp 2
+
+  .flink-list > .flink-list-item:hover a .flink-item-desc
+    color var(--sco-white)
+
+  .flink-list > .flink-list-item a .flink-item-name
+    text-align left
+    font-size 19px
+    line-height 20px
+    color var(--sco-fontcolor)
+
+  .flink-list > .flink-list-item:hover a .flink-item-name
+    color var(--sco-white)
+
+  .flink-list > .flink-list-item a
+    display flex
+    border none
+    width 100%
+    height 100%
+    align-items center
+
+  .flink-list > .flink-list-item a:hover
+    background 0 0
+
+  .flink-list > .flink-list-item a img
+    border-radius 32px
+    margin 15px 20px 15px 15px
+    transition .3s
+    background var(--sco-background)
+    min-width 60px
+    min-height 60px
+
+  .flink-list > .flink-list-item:hover a img
+    transition .6s
+    width 0
+    height 0
+    opacity 0
+    margin .5rem
+    min-width 0
+    min-height 0
+
+  .flink-list > .flink-list-item a span
+    transition .3s
+
+  .flink-list > .flink-list-item:hover a .flink-item-desc
+    overflow hidden
+    width 100%
+
+  .flink-list > .flink-list-item
+    margin 6px 6px
+    transition .3s
+    border-radius 12px
+    transition-timing-function ease-in-out
+    position relative
+    width calc(20% - 12px)
+    border var(--style-border)
+    box-shadow var(--sco-shadow-border)
+    background var(--sco-card-bg)
+    display flex
+
+.flink-list-item
+  .flink-item-info
+    display flex
+    flex-direction column
+    justify-content center
+    width calc(100% - 90px)
+    height fit-content
+
+  &:hover .flink-item-info
+    min-width calc(100% - 20px)
+
+
+.flink#article-container
+  .flink-list > .flink-list-item:hover
+    transform scale(1)
+    background var(--sco-theme)
+    border var(--style-border-hover)
+    box-shadow var(--sco-shadow-main)
+
+  .site-card
+    .info .title
+      color var(--sco-fontcolor)
+      text-align left
+
+    &:hover .info .title
+      color var(--sco-white)
+
+    &:hover .info
+      height 120px
+
+    .site-card-text
+      display flex
+      flex-direction column
+      align-items flex-start
+
+    .info .desc
+      font-size .7rem
+      color var(--sco-fontcolor)
+      opacity .7
+      transition .3s
+      text-align left
+
+    &:hover .info .desc
+      color var(--sco-white)
+
+    border var(--style-border)
+    border-radius 12px
+    transition .3s
+    transition-timing-function ease-in-out
+    overflow hidden
+    height 200px
+    position relative
+    width calc(100% / 7 - 16px)
+    background var(--sco-card-bg)
+    box-shadow var(--sco-shadow-border)
+
+    &:hover .site-card-tag
+      left -50px
+
+    .info
+      display flex
+      border none
+      padding .5rem
+      width 100%
+      height 90px
+      margin 0
+      border-radius 0 0 12px 12px
+
+    .img img
+      border-radius 0
+      transform scale(1.03)
+      transition .3s
+      margin 0
+      max-width 100%
+
+.site-card-tag
+  position absolute
+  top 0
+  left 0
+  padding 4px 8px
+  background-color var(--sco-blue)
+  box-shadow var(--sco-shadow-blue)
+  color var(--sco-white)
+  z-index 1
+  border-radius 12px 0 12px 0
+  transition .3s
+  font-size .6rem
+
+  &.vip
+    background -moz-linear-gradient(38deg, #e5b085 0, #d48f16 100%)
+    background -webkit-linear-gradient(38deg, #e5b085 0, #d48f16 100%)
+    background linear-gradient(38deg, #e5b085 0, #d48f16 100%)
+    overflow hidden
+    box-shadow var(--sco-shadow-yellow)
+
+  &.power
+    background-color var(--sco-purple)
+
+  &.speed
+    background var(--sco-green)
+    box-shadow var(--sco-shadow-green)
+
+.light
+  cursor pointer
+  position absolute
+  top 0
+  width 100px
+  height 50px
+  background-image -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0))
+  background-image -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0))
+  -webkit-animation light_tag 4s both infinite
+  -moz-animation light_tag 4s both infinite
+  -ms-animation light_tag 4s both infinite
+  animation light_tag 4s both infinite
+
+.flink-list-item:hover .site-card-tag
+  left -70px
+
++minWidth768()
+  .flink#article-container
+    .site-card:hover
+      .info .desc
+        -webkit-line-clamp 4
+        transition .3s
+        color var(--sco-white)
+        width 100%
+
+      .info
+        background var(--sco-theme)
+
+
++minWidth768()
+  .flink#article-container
+    .site-card:hover
+      .img img
+        transform scale(1.1)
+        filter brightness(.3)
+
+      .img
+        height 80px
+
+.flink#article-container
+  .site-card
+    .img
+      -webkit-mask-image -webkit-radial-gradient(center, #fff, #000)
+      border-radius 0
+      height 120px
+      width 100%
+      display flex
+      border none
+      padding 0 !important
+
+    .info img
+      border-radius 32px
+      transition .3s !important
+      margin 2px 8px 0 0
+      width 20px
+      height 20px
+      min-width 20px
+      min-height 20px
+      background var(--sco-secondbg)
+
+    &:hover
+      .info img
+        width 0
+        height 0
+        opacity 0
+        min-width 0
+        min-height 0
+
+      border var(--style-border-hover)
+      box-shadow var(--sco-shadow-main)
+
+  .site-card-group
+    padding 20px 0
+#friendlink_checkboxs input
+  margin-right 4px

package/source/css/_page/moment.styl

@@ -0,0 +1,179 @@
+#random-post
+  min-height 32px
+  background var(--sco-card-bg)
+  border var(--style-border-always)
+  box-shadow var(--sco-shadow-border)
+  padding 20px 30px
+  border-radius 12px
+  margin-top 8px
+
+.random-friends-post
+  text-decoration none
+  border-bottom 2px solid var(--sco-lighttext)
+  color var(--sco-fontcolor)
+  font-weight 700
+  padding 0 4px
+
+.random-friends-post:hover
+  text-decoration none
+  border-bottom 2px solid var(--sco-none)
+  color var(--sco-white)
+  background var(--sco-main)
+  border-radius 4px
+  box-shadow var(--sco-shadow-main)
+
+.random-post-start
+  transition-duration .3s
+
+.random-post-start:hover
+  color var(--sco-hovertext)
+
+.title-h2-a a.random-post-start
+  opacity .6
+
+.moments-list
+  display: flex
+  flex-direction: column
+
+  .article-sort-item-info
+    display: flex
+    flex-direction: column
+
+    .article-sort-item-title
+      color: var(--sco-lighttext)
+
+      &:hover
+        color: var(--sco-hovertext)
+
+#friend_link_moments
+  border: none !important
+
+.moments-article-img
+  height: 100%
+  margin: 0 !important
+
+.tab-item-content
+  #moments_container
+    .moments-item
+      a
+        border-bottom: none
+        padding: 0
+        margin-right: auto
+        width: auto
+
+        &:hover
+          background: 0 0
+          color: var(--sco-lighttext)
+          box-shadow: none
+
+    h2
+      display: none
+
+#friend_moments_list
+  .moments-sort-item
+    margin: 1rem 0
+
+.moments-sort-item-img
+  border-radius: 12px
+
+.moments-item-time
+  order: 1
+
+.moments-sort-item-title
+  color: var(--sco-lighttext)
+  border-bottom: none !important
+  padding: 0 !important
+
+  &:hover
+    color: var(--sco-hovertext) !important
+    background: 0 0 !important
+    box-shadow: none !important
+
+.moments_load_button
+  color: var(--sco-fontcolor) !important
+  background: var(--sco-card-btn-bg) !important
+  padding: 12px 16px !important
+  border-radius: 12px !important
+  transition: .3s
+  width: 100%
+  margin-top: 1rem
+  margin-bottom: 1rem
+  border: 0 !important
+
+  &:hover
+    color: var(--sco-white) !important
+    background: var(--sco-main) !important
+    transition: .3s
+
+.moments-item-title
+  color: var(--sco-lighttext)
+  font-size: 1rem
+  order: 0
+  width: 100%
+  font-weight: 700
+  -webkit-line-clamp: 1 !important
+  overflow: hidden
+  -webkit-box-orient: vertical
+
+.moments-item-info
+  display: flex
+  flex-direction: column
+
+.moments_post_time
+  display: none
+
+  i
+    margin-right: 8px
+
+.moments-item-title
+  font-weight: 700
+
+.moments_post_info_number
+  float: right
+
+.moments-item-img
+  width: 60px !important
+  height: 60px !important
+
+  img
+    border-radius: 99px
+    width: 80px
+    height: 80px
+    overflow: hidden
+
+.moments-item
+  margin-left: 0 !important
+  box-shadow: none !important
+
+#hexo-circle-of-friends-root
+  margin: 0 -8px
+
+#cf-container
+  a
+    width: fit-content
+
+.title-h2-a
+  display: flex
+  align-items: center
+  justify-content: space-between
+  margin-top: .5rem
+
+  a
+    margin-left: .5rem
+    color: var(--sco-secondtext)
+    font-weight: 700
+
+    &:hover
+      color: var(--sco-hovertext)
+
+  .title-h2-a-left
+    display: flex
+    align-items: center
+
+    h2
+      margin-top: 0 !important
+      margin-bottom: 0 !important
+
+  .title-h2-a-right
+    font-size: 14px
+    color: var(--sco-secondtext)