hexo-theme-solitude 1.1.3 → 1.2.1

package/source/css/_post/relatedPost.styl

@@ -0,0 +1,160 @@
+.relatedPosts
+  margin-top: 2rem
+  -webkit-user-select: none
+
+  > .relatedPosts-list
+    > div
+      position: relative
+      display: inline-block
+      overflow: hidden
+      margin: 3px
+      width: calc(33.333% - 6px)
+      height: 200px
+      background: var(--sco-main)
+      vertical-align: bottom
+
+    .cover
+      width: 360px
+      min-width: 45%
+      height: 100%
+      transition: all .6s ease 0s
+      object-fit: cover
+      filter: brightness(.9)
+      max-width: 45%
+
+      &::after
+        content: ' '
+        display: block
+        position: absolute
+        z-index: 0
+        top: 0
+        left: 0
+        width: 100%
+        height: 100%
+        background: url(https://bu.dusays.com/2023/03/03/6401a79030db5.png) 50%
+        background-size: cover
+
+    .content
+      padding: 0 1rem
+      width: 100%
+
+      .date
+        color: var(--light-grey)
+        font-size: 90%
+
+      .title
+        color: var(--sco-white)
+        -webkit-line-clamp: 2
+        margin-right: auto
+
+    a
+      display: flex
+      width: 100%
+      height: 100%
+
+  > .headline
+    margin-bottom: .8rem
+    font-weight: 700
+    font-size: 20px
+    display: flex
+    align-items: center
+
+    span
+      margin-right: auto
+      margin-left: 8px
+
+    a
+      font-weight: 400
+
+  &-link
+    display: block
+    justify-content: space-between
+    margin-left: 8px
+    font-size: 13px
+
+.relatedPosts-list
+  display: flex
+  flex-wrap: wrap
+  justify-content: space-between
+  flex-direction: column
+
+@media screen and (max-width: 768px)
+  .relatedPosts
+    > .relatedPosts-list
+      > div
+        margin: 2px
+        width: calc(50% - 4px)
+        height: 150px
+
+@media screen and (max-width: 600px)
+  .relatedPosts
+    > .relatedPosts-list
+      > div
+        width: calc(100% - 4px)
+
+@media screen and (min-width: 768px)
+  #post
+    > div.relatedPosts
+      > div.relatedPosts-list
+        > div
+          -webkit-mask-image: -webkit-radial-gradient(center, #fff, #000)
+          border-radius: 12px
+
+  .relatedPosts
+    > .headline
+      font-size: .8em
+
+  @media screen and (max-width: 1300px)
+    #post
+      > div.relatedPosts
+        > div.relatedPosts-list
+          > div:nth-child(7)
+            display: none
+
+          > div:nth-child(8)
+            display: none
+
+.relatedPosts
+  > .relatedPosts-list
+    > div
+      background: var(--sco-secondbg)
+      border: var(--style-border)
+      transition: .3s
+      cursor: pointer
+      overflow: hidden
+      width: 100%
+      margin-bottom: 8px
+
+      &:hover
+        background: var(--sco-main)
+
+      .content
+        .title
+          color: var(--sco-fontcolor)
+          font-weight: 700
+          line-height: 1.5
+          -webkit-line-clamp: 4
+          font-size: .9rem
+          text-align: left
+          overflow: hidden
+
+        .date
+          color: var(--sco-fontcolor)
+          display: none
+
+      &:hover
+        a
+          .title
+            color: var(--sco-white)
+
+@media screen and (max-width: 768px)
+  .relatedPosts
+    display: none
+
+    > .relatedPosts-list
+      > div
+        border-radius: 4px
+
+@media screen and (min-width: 768px)
+  .relatedPosts
+    margin-top: 1rem

package/source/css/_post/reward.styl

@@ -0,0 +1,217 @@
+.reward-main
+  animation: .3s ease .1s 1 normal both running donate_effcet
+
+.post-reward
+  position: relative
+  margin-top: 4rem
+  text-align: center
+
+  &:hover
+    > .reward-main
+      display: block
+
+  .reward-main
+    position: absolute
+    bottom: 40px
+    left: -96px
+    z-index: 100
+    display: none
+    padding: 0 0 15px
+    width: fit-content
+
+    .reward-all
+      display: inline-block
+      margin: 0
+      padding: 1rem .5rem
+      border-radius: 4px
+      background: var(--sco-maskbgdeep)
+
+      &:before
+        position: absolute
+        bottom: -10px
+        left: 0
+        width: 100%
+        height: 20px
+        content: ""
+
+      &:after
+        position: absolute
+        right: 0
+        bottom: 2px
+        left: 0
+        margin: 0 auto
+        width: 0
+        height: 0
+        border-top: 13px solid var(--reward-pop)
+        border-right: 13px solid transparent
+        border-left: 13px solid transparent
+        content: ""
+
+      .reward-item
+        display: inline-block
+        padding: 0 8px
+        list-style-type: none
+        vertical-align: top
+
+        img
+          width: 130px
+          height: 130px
+
+        .post-qr-code-desc
+          padding-top: .4rem
+          width: 130px
+          color: #858585
+
+  .reward-button
+    background: var(--sco-red)
+    color: var(--sco-white)
+    padding: 0 16px
+    height: 40px
+    line-height: 39px
+    box-shadow: var(--sco-shadow-red)
+    display: inline-block
+    cursor: pointer
+    transition: all .4s ease 0s
+
+  &:hover
+    .reward-button
+      color: var(--sco-white)
+      background: var(--sco-theme)
+      box-shadow: none
+
+  .reward-main
+    .reward-all
+      .reward-item
+        .post-qr-code-desc
+          padding-top: 0
+          margin-top: -8px
+          margin-bottom: 8px
+
+  .reward-main
+    .reward-all
+      border-radius: 12px
+      background: var(--sco-card-bg)
+      border: var(--style-border-always)
+      padding: .8rem
+      display: flex
+      box-shadow: var(--sco-shadow-border)
+      flex-direction: column
+      align-items: center
+
+.reward-dec
+  font-size: .6rem
+
+.reward-text
+  margin-bottom: 0
+  font-weight: 700
+
+a.reward-main-btn
+  background: var(--sco-secondbg)
+  color: var(--sco-fontcolor)
+  display: flex
+  flex-direction: column
+  border-radius: 12px
+  padding: 4px 0
+  border: var(--style-border-always)
+  margin: 8px
+  width: 100%
+
+  &:hover
+    color: var(--sco-white)
+    background: var(--sco-red)
+    background-image: url(https://bu.dusays.com/2023/11/01/6541f7aeb5752.gif)
+    box-shadow: var(--sco-shadow-red)
+
+.reward-title
+  font-weight: 700
+  color: var(--sco-red)
+
+.reward-link.mode
+  background: var(--sco-green)
+  color: var(--sco-white)
+  padding: 0 16px
+  height: 40px
+  line-height: 39px
+  box-shadow: var(--sco-shadow-green)
+  border-radius: 8px
+  margin-left: .5rem
+  text-align: center
+  transition: .3s
+
+  a
+    color: var(--sco-white)
+
+  i
+    margin-right: 4px
+
+  &:hover
+    background: var(--sco-theme)
+    box-shadow: none
+
+.post-reward
+  margin-top: 0
+  display: flex
+  justify-content: center
+
+  &:hover
+    > .reward-main
+      display: none
+
+  .reward-main
+    z-index: 1003
+
+@media screen and (min-width: 768px)
+  .post-reward:hover
+    > .reward-main
+      display: flex !important
+      justify-content: left
+
+@media screen and (max-width: 768px)
+  .post-reward
+    .reward-main
+      justify-content: center !important
+      position: fixed
+      bottom: 0
+      left: 0
+      right: 0
+      z-index: 1003
+      width: 100%
+      margin: auto
+      padding: 0
+
+    .reward-main
+      .reward-all
+        width: 100%
+        display: flex
+        flex-wrap: wrap
+        justify-content: space-around
+        padding: 30px 0 60px 0
+        border-radius: 12px 12px 0 0
+
+  #post
+    .tag_share
+      .post-meta__tags
+        margin: 0 .5rem 0 0
+
+  a.reward-main-btn
+    margin: 4px auto
+
+.post-reward
+  .reward-main
+    .reward-all:after
+      display: none
+
+.reward-group
+  display: flex
+  margin-top: .5rem
+
+.post-reward
+  .reward-main
+    .reward-all
+      .reward-item:first-child
+        img
+          border-color: var(--sco-green)
+
+      .reward-item:last-child
+        img
+          border-color: var(--sco-blue)

package/source/css/_search/algolia-search.styl

@@ -0,0 +1,206 @@
+.search-dialog
+  position fixed
+  top 5rem
+  left 50%
+  z-index 1001
+  display none
+  margin-left -15rem
+  padding 1rem
+  width 30rem
+  box-shadow var(--sco-shadow-lightblack)
+  background var(--sco-card-bg)
+  border var(--style-border)
+  transition 0.3s
+  border-radius 12px
+
+  +maxWidth768()
+    top 0px
+    left 0px
+    margin 0px
+    width 100%
+    height 100%
+
+  .search-close-button
+    &:hover
+      color var(--sco-main)
+
+  .search-box
+    padding-top 8px
+    max-width 100%
+
+    input
+      height 100%
+      width 100%
+      padding 0.25rem 0.7rem
+      outline 0px
+      border var(--style-border)
+      border-radius 8px
+      background var(--sco-secondbg)
+      color var(--sco-fontcolor)
+
+      &:focus
+        border var(--style-border-hover)
+
+  .search-close-button
+    position absolute
+    top 0.8rem
+    right 1rem
+    color var(--sco-gray)
+    font-size 1.4em
+    line-height 1
+    cursor pointer
+    transition color .2s ease-in-out 0s
+
+#search-mask
+  position fixed
+  inset 0px
+  z-index 1000
+  display none
+  background rgba(0, 0, 0, 0.6)
+  backdrop-filter blur(12px)
+  -webkit-backdrop-filter blur(12px)
+  transform translateZ(0)
+  background var(--sco-maskbgdeep)
+
+.search-nav
+  display flex
+  align-items center
+  justify-content space-between
+  padding 0 0.2rem 0.7rem 0.2rem
+
+.search-dialog-title
+  font-weight bold
+  color var(--sco-main)
+  font-size 1.4em
+  line-height 1
+
+.search-box
+  input
+    &::placeholder
+      color var(--sco-gray)
+
+#algolia-search
+  #search-results
+    padding 8px
+    max-height calc(80vh - 130px)
+    overflow-y auto
+
+    +maxWidth768()
+      max-height 80vh !important
+
+  .ais-Hits-list
+    padding 0
+
+  .ais-Hits-item
+    margin 10px 0
+
+  .algolia-hit-item-content
+    margin 0
+    padding-left 10px
+    font-size 14px
+    color var(--sco-gray)
+
+  .algolia-hit-item-link
+    width auto
+    max-width 100%
+    white-space nowrap
+    text-overflow ellipsis
+    overflow hidden
+    font-weight bold
+
+  mark
+    color var(--sco-theme)
+    font-style normal
+    background var(--sco-card-bg)
+
+  .ais-Hits--empty
+    text-align center
+    font-weight 600
+
+  .algolia-stats
+    color var(--sco-gray)
+    font-size .8rem
+    font-weight bold
+
+  .ais-SearchBox
+    padding-top: 8px
+    margin 0 auto
+    width 100%
+    min-width 100%
+    position relative
+
+  .ais-SearchBox-input
+    border-radius 8px
+    border var(--style-border)
+    padding 0.25rem 0.7rem
+    outline 0
+    background var(--sco-secondbg)
+    color var(--search-input-color)
+    width 100%
+    height 100%
+
+  .ais-Pagination-list.pagination
+    margin 0.2rem 0 0
+    padding 0
+    text-align center
+
+  .ais-Pagination-item.pagination-item
+    margin 0 0.2rem
+    padding 0
+    display inline-block
+
+    a
+      border-radius 4px
+      background var(--sco-main)
+      color var(--sco-white)
+      cursor pointer
+      display inline-block
+      min-width 1.2rem
+      text-align center
+      line-height 1.2rem
+
+  search-icon
+    animation sco-spin 1.2s linear infinite
+    opacity .6
+    font-size 2rem
+
+#search-mask
+  backdrop-filter blur(12px)
+  -webkit-backdrop-filter blur(12px)
+  transform translateZ(0)
+  background var(--sco-maskbgdeep)
+
+#algolia-input-panel
+  margin-bottom 8px
+
+.search-dialog
+  border-radius 12px !important
+  box-shadow var(--sco-shadow-lightblack)
+  background var(--sco-card-bg)
+  border var(--style-border)
+  transition .3s
+
+  &:hover
+    border var(--style-border-hover)
+    box-shadow var(--sco-shadow-theme)
+
+.search-dialog__title
+  padding 0 0 0.7rem
+  color var(--sco-main)
+  font-size 1.4em
+  line-height 1
+
+#algolia-tips
+  padding-top 12px
+  color var(--sco-secondtext)
+  right 0
+  margin auto
+
+  i
+    font-size 22px
+
+.algolia-tips-text
+  margin-left .4rem
+
+#algolia-search-results
+  padding-top 8px

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

@@ -0,0 +1,112 @@
+.search-dialog 
+	position fixed
+	top 5rem
+	left 50%
+	z-index 1001
+	display none
+	margin-left -15rem
+	padding 1rem
+	width 30rem
+	box-shadow var(--sco-shadow-lightblack)
+	background var(--sco-card-bg)
+	border var(--style-border)
+	transition 0.3s
+	border-radius 12px
+
+	+maxWidth768()
+		top 0px
+		left 0px
+		margin 0px
+		width 100%
+		height 100%
+
+	.search-close-button 
+		color var(--sco-main)
+		font-size 1.2em
+		line-height 1
+		cursor pointer
+		transition color 0.2s ease-in-out 0s
+
+		&:hover 
+			color rgb(48, 122, 246)
+
+	.search-box 
+		padding-top 8px
+		max-width 100%
+
+		input 
+			height 100%
+			width 100%
+			padding 0.25rem 0.7rem
+			outline 0px
+			border var(--style-border)
+			border-radius 8px
+			background var(--sco-secondbg)
+			color var(--sco-fontcolor)
+
+			&:focus 
+				border var(--style-border-hover)
+
+#search-mask 
+	position fixed
+	inset 0px
+	z-index 1000
+	display none
+	background rgba(0, 0, 0, 0.6)
+	backdrop-filter blur(12px)
+	-webkit-backdrop-filter blur(12px)
+	transform translateZ(0)
+	background var(--sco-maskbgdeep)
+
+.search-wrap 
+	display none
+
+#loading-database,
+#loading-status 
+	text-align center
+	padding-top 10px
+
+.search-nav 
+	display flex
+	align-items center
+	justify-content space-between
+	padding 0 0.2rem 0.7rem 0.2rem
+
+.search-dialog-title 
+	font-weight bold
+	color var(--sco-main)
+	font-size 1.4em
+	line-height 1
+
+#search-results 
+	max-height calc(80vh - 130px)
+	overflow-y auto
+
+	+maxWidth768()
+		max-height 80vh !important
+
+	.search__hit-item 
+		font-weight bold
+		margin 10px 0
+
+	.search-result 
+		margin 0
+		font-weight 500
+
+	.search-keyword 
+		color var(--sco-theme)
+		font-style normal
+
+#search__hits-empty 
+	text-align center
+	font-weight 600
+
+.search__hits-count 
+	color var(--sco-gray)
+	font-size .8rem
+	font-weight bold
+
+.search-box 
+	input 
+		&::placeholder 
+			color var(--sco-gray)