hexo-theme-solitude 1.1.3 → 1.2.1

package/source/css/_layout/base.styl

@@ -0,0 +1,392 @@
+*
+  box-sizing border-box
+
+html
+  line-height 1.15
+  -webkit-text-size-adjust 100%
+  text-size-adjust 100%
+  height: 100%;
+  font-size: 20px
+  overflow-y: overlay
+
+main
+  display block
+
+body
+  position relative
+  min-height 100%
+  background var(--sco-background)
+  color var(--sco-fontcolor)
+  font-size 16px
+  font-family "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei"
+  line-height 2
+  -webkit-tap-highlight-color transparent
+  margin 0
+
+::selection
+  background var(--sco-fontcolor)
+  color var(--sco-background)
+
+i.scoicon
+  font-size 22px
+  line-height 1
+
+svg.scoicon
+  width 1em
+  height 1em
+  vertical-align -0.15em
+  fill currentColor
+  overflow hidden
+
+svg.scoicon.tab
+  width 1.5em
+  height 1.5em
+  vertical-align -0.15em
+  fill currentColor
+  overflow hidden
+  padding-right 5px
+
+#page img
+  border-radius 12px
+
+#page p a:not(.headerlink)
+  text-decoration none
+  border-bottom 2px solid var(--sco-lighttext)
+  color var(--sco-fontcolor)
+  font-weight 700
+  padding 0 4px
+  border-radius 4px 4px 0 0
+
+#page p a:hover
+  text-decoration none
+
+h1
+  font-size 2em
+  margin .67em 0
+
+h1, h2, h3, h4, h5, h6
+  position relative
+  margin 1rem 0 .7rem
+  color var(--sco-fontcolor)
+  font-weight 700
+
+h1 code, h2 code, h3 code, h4 code, h5 code, h6 code
+  font-size inherit !important
+
+hr
+  box-sizing content-box
+  height 0
+  overflow visible
+  display: none
+
+pre
+  font-family monospace, monospace
+
+a
+  color var(--sco-fontcolor)
+  text-decoration none
+  transition all .2s ease 0s
+  overflow-wrap break-word
+  -webkit-user-drag none
+
+abbr[title]
+  border-bottom none
+  text-decoration underline dotted
+
+b, strong
+  font-weight bolder
+
+code, kbd, samp
+  font-family monospace, monospace
+  font-size 1em
+
+small
+  font-size 80%
+
+sub, sup
+  font-size 75%
+  line-height 0
+  position relative
+  vertical-align baseline
+
+sub
+  bottom -.25em
+
+sup
+  top -.5em
+
+button, input, optgroup, select, textarea
+  font-family inherit
+  font-size 100%
+  line-height 1.15
+  margin 0
+
+button, input
+  overflow visible
+
+input::placeholder
+  color var(--sco-gray)!important
+
+button, select
+  text-transform none
+
+[type=button], [type=reset], [type=submit], button
+  appearance button
+
+fieldset
+  padding .35em .75em .625em
+
+legend
+  box-sizing border-box
+  color inherit
+  display table
+  max-width 100%
+  padding 0
+  white-space normal
+
+progress
+  vertical-align baseline
+
+textarea
+  overflow auto
+
+[type=checkbox], [type=radio]
+  box-sizing border-box
+  padding 0
+
+[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button
+  height auto
+
+[type=search]
+  appearance textfield
+  outline-offset -2px
+
+[type=search]::-webkit-search-decoration
+  appearance none
+
+input[type=checkbox] + label::before, input[type=radio] + label::before
+  content ''
+  display inline-block
+  width 16px
+  height 16px
+  border 1px solid #999
+  background-color #fff
+  margin-right 5px
+  vertical-align middle
+
+::-webkit-file-upload-button
+  appearance button
+  font inherit
+
+summary
+  display list-item
+
+template
+  display none
+
+[hidden]
+  display none
+
+input::placeholder
+  color var(--sco-fontcolor)
+
+.table-wrap
+  overflow-x scroll
+  margin 0 0 1rem
+
+table
+  display table
+  width 100%
+  border-spacing 0
+  border-collapse collapse
+  empty-cells show
+
+table thead
+  background rgba(153, 169, 191, .1)
+
+table td, table th
+  padding .3rem .6rem
+  border 1px solid var(--light-grey)
+  vertical-align middle
+
+::selection
+  background #0079ff
+  color #f7f7f7
+
+button
+  padding 0
+  outline 0
+  border none
+  background 0 0
+  cursor pointer
+
+a:hover
+  color var(--sco-lighttext)
+
+img
+  max-width 100%
+  transition all .2s ease 0s;
+  border-style none
+
+img:not([src]), img[src=""]
+  opacity 0
+
+.img-alt
+  margin -.5rem 0 .5rem
+  color #858585
+
+.img-alt:hover
+  text-decoration none !important
+
+.is-center
+  text-align center
+  display flex
+  flex-wrap wrap
+  justify-content center
+  flex-direction row
+  align-items center
+
+.copy-true
+  user-select all
+
+.pull-left
+  float left
+
+.pull-right
+  float right
+
+.button--animated
+  position relative
+  z-index 1
+  transition color 1s ease 0s
+
+.button--animated::before
+  position absolute
+  inset 0
+  z-index -1
+  background var(--btn-hover-color)
+  content ""
+  transition transform .5s ease-out 0s
+  transform scaleX(0)
+  transform-origin 0 50%
+
+.button--animated:hover::before
+  transition-timing-function cubic-bezier(.45, 1.64, .47, .66)
+  transform scaleX(1)
+
+blockquote
+  border-left .2rem solid #49b1f5
+  border: var(--style-border-always);
+  background-color: var(--sco-secondbg);
+  color: var(--sco-secondtext);
+  border-radius: 8px;
+  margin: 1rem 0;
+  padding: .5rem .8rem
+
+  .pullquote
+    position relative
+    max-width 45%
+    font-size 110%
+
+    .left
+      left 0
+      margin 1em .5em 0 0
+
+    .right
+      right 0
+      margin 1em 0 0 .5em
+
+
+blockquote a
+  color var(--blockquote-color)
+
+blockquote p
+  margin 0 !important
+  padding: 0
+
+li, ul
+  list-style none
+  display block
+  margin 0
+  padding 0
+
+.li-style
+  width 100%
+  height 25px
+  text-align center
+
+.fireworks
+  position fixed
+  top 0
+  left 0
+  z-index 9999
+  pointer-events none
+
+.katex-wrap
+  overflow auto
+
+.katex-wrap::-webkit-scrollbar
+  display none
+
+.video-container
+  position relative
+  overflow hidden
+  margin-bottom .8rem
+  padding-top 56.25%
+  height 0
+
+.video-container iframe
+  position absolute
+  top 0
+  left 0
+  margin-top 0
+  width 100%
+  height 100%
+
+::-webkit-scrollbar
+  width 6px
+  height 6px
+
+::-webkit-scrollbar-thumb
+  background var(--sco-scrollbar)
+  border-radius 8px
+  cursor pointer
+
+::-webkit-scrollbar-thumb:hover
+  background var(--sco-main)
+  opacity 1
+  display block !important
+
+::-webkit-scrollbar-track
+  background-color var(--sco-none)
+
+[data-theme=dark] img
+  filter brightness(1)
+
+a.extend.next
+  right 0
+
+a.extend.prev
+  left 0
+
+.table-wrap
+  margin 1rem 0
+  border-radius 8px
+
+table td, table th
+  border var(--style-border-always)
+
+table thead
+  background var(--sco-secondbg)
+
+b, strong
+  color var(--sco-lighttext)
+
+h1, h2, h3, h4, h5, h6
+  margin-top 1rem
+  padding-top 0
+  padding-left 0 !important
+  font-weight 700
+
+figure
+  margin-top .5rem !important

package/source/css/_layout/footer.styl

@@ -0,0 +1,359 @@
+#footer
+  position: relative
+  background: linear-gradient(180deg, var(--sco-card-bg-none) 0, var(--sco-card-bg) 25%)
+  display: flex
+  flex-direction: column
+  margin-top: .5rem
+
+  &:before
+    position: absolute !important
+    width: 100% !important
+    height: 100% !important
+    content: '' !important
+    z-index: -1
+
+#footer-wrap
+  position: relative
+  color: var(--sco-fontcolor)
+  display: flex
+  flex-wrap: wrap
+  justify-content: space-around
+  padding: 20px 50px 0 50px
+  text-align: left
+  max-width: 1200px
+  margin: 0 auto
+  margin-top: 1rem
+
+  a
+    padding: 4px 12px
+    border-radius: 5px
+    color: var(--sco-fontcolor)
+    height: 44px
+    line-height: 36px
+
+    &:hover
+      cursor: pointer
+      border-radius: 5px
+      color: var(--sco-hovertext)
+      background-color: var(--sco-none)
+
+  .footer-separator
+    margin: 0 .2rem
+
+  .icp-icon
+    padding: 0 4px
+    vertical-align: text-bottom
+    max-height: 1.4em
+    width: auto
+
+  h1
+    font-size: 1.5rem
+    margin: 0
+
+  h3
+    padding: 0 12px
+
+  p
+    margin: 0 0 0 .2rem
+    font-size: .8rem
+    opacity: .8
+
+  i
+    margin-right: .5rem
+    width: 22px
+    font-size: 18px
+    display: inline-block
+
+  #letlogo
+    display: flex
+    flex-direction: column
+    align-self: center
+    margin: auto 0
+    max-width: 200px
+
+  #letlink
+    display: flex
+    flex-direction: row
+    justify-content: space-around
+    margin: 0 0 1rem 0
+
+    .link_group
+      display: flex
+      flex-direction: column
+      margin-right: 20px
+      min-width: 180px
+
+#weblogo i
+  font-size: 2rem
+  line-height: 2rem
+  letter-spacing: -10px
+
+div#footer_deal
+  justify-content: center
+  display: flex
+  padding-top: 2rem
+  align-items: center
+
+div#sco-footer-bar
+  display: none
+
+  a.footer-bar-link
+    padding: 4px 16px
+    background: var(--sco-secondbg)
+    border-radius: 20px
+    margin-top: 8px
+    font-size: 14px
+    cursor: pointer
+    border: var(--style-border-always)
+
+    &:hover
+      background: var(--sco-main)
+      color: var(--sco-white)
+      transform: scale(1.1)
+      border-color: var(--sco-main)
+
+  .footer-logo
+    font-size: 24px
+
+  .footer-bar-description
+    color: var(--sco-secondtext)
+    font-weight: 700
+
+.post div#sco-footer-bar
+  display: flex
+  flex-direction: column
+  align-items: center
+  margin-top: 16px
+
+#sco-footer
+  display: flex
+  flex-direction: row
+  width: 100%
+  max-width: 1200px
+  justify-content: space-between
+  flex-wrap: wrap
+  margin: 1rem auto 3rem
+  padding: 0 1rem
+
+  .footer-links
+    display: flex
+    flex-direction: column
+
+  .footer-item
+    font-size: .8rem
+    line-height: .8rem
+    color: var(--sco-fontcolor)
+    margin-right: auto
+    overflow: hidden
+    white-space: nowrap
+    text-overflow: ellipsis
+    max-width: 120px
+    cursor: pointer
+    padding: 8px
+    border-radius: 12px
+
+    &:hover
+      color: var(--sco-theme)
+      background: var(--sco-main-op-light)
+
+  .footer-group
+    min-width: 120px
+
+  .footer-title-group
+    display: flex
+    align-items: center
+    margin: 1rem 0 .7rem 0
+
+    a
+      margin-left: 8px
+
+      &:hover i
+        color: var(--sco-main)
+        opacity: 1
+
+    i
+      line-height: 1
+      color: var(--sco-secondtext)
+      transition: .3s
+      font-size: 16px
+      opacity: .6
+
+    .footer-title
+      margin 0
+
+  .footer-title
+    color: var(--sco-secondtext)
+    font-size: .8rem
+    margin-left: 8px !important
+
+  .random-friends-btn
+    display: flex
+
+#footer-bar
+  padding: 1rem
+  color: var(--sco-fontcolor)
+  margin-top: 1rem
+  background: var(--sco-secondbg)
+  display: flex
+  overflow: hidden
+  z-index: 1002
+  transition: .3s
+  border-top: var(--style-border-always)
+
+  .footer-bar-links
+    display: flex
+    justify-content: space-between
+    max-width: 1400px
+    width: 100%
+    margin: 0 auto
+    flex-wrap: wrap
+    align-items: center
+    line-height: 1
+
+  .footer-bar-left
+    display: flex
+    flex-wrap: wrap
+    min-height: 32px
+    align-items: center
+
+  .footer-bar-link
+    margin-top: 8px
+    margin-bottom: 8px
+    margin-right: 1rem
+    color: var(--sco-fontcolor)
+    font-size: .8rem
+    font-weight: 700
+    white-space: nowrap
+
+    &:hover
+      color: var(--sco-theme)
+
+  .footer-bar-right
+    display: flex
+    flex-direction: row
+    flex-wrap: wrap
+    align-items: center
+
+  > div > div.footer-bar-left > span
+    margin-right: 1rem
+
+#cookies-window
+  min-width: 300px
+  background: var(--sco-maskbgdeep)
+  color: var(--sco-fontcolor)
+  padding: 8px 16px
+  display: flex
+  flex-direction: column
+  bottom: 20px
+  right: 20px
+  position: fixed
+  border-radius: 12px
+  transition: .3s
+  z-index: 1002
+  user-select: none
+  backdrop-filter: saturate(180%) blur(20px)
+  -webkit-backdrop-filter: saturate(180%) blur(20px)
+  transform: translateZ(0)
+  border: var(--style-border)
+  animation: barrageIn .6s cubic-bezier(.42, 0, .3, 1.11)
+
+  &.cw-hide
+    opacity: 0
+    animation: barrageOut .6s cubic-bezier(.42, 0, .3, 1.11)
+    z-index: -1
+
+  .cookies-window-title
+    padding-bottom: 4px
+    border-bottom: var(--style-border)
+    font-size: 12px
+    font-weight: 700
+
+  .cookies-window-content
+    font-size: 14px
+    display: flex
+    justify-content: space-around
+    align-items: center
+
+.cookie-to
+  margin-right: 4px
+  font-weight: 700
+
+.cookies-link
+  margin-left: auto
+  font-size: 16px
+
+.cookies-link i.scoicon
+  font-size: 16px
+
+a.deal_link
+  display: flex
+  margin: 1rem 27px
+  color: var(--sco-card-bg)
+  border-radius: 3rem
+  width: 32px
+  height: 32px
+  background: var(--sco-fontcolor)
+  justify-content: center
+  align-items: center
+  transition: .3s
+
+  &:hover
+    color: var(--sco-white)
+    background: var(--sco-main)
+    transform: scale(1.1)
+
+blockquote footer
+  padding: 0 0 .5rem
+
+blockquote footer cite::before
+  padding: 0 .3em
+  content: "—"
+
+img.footer_mini_logo
+  width: 50px
+  height: 50px
+  margin: 0 1rem
+  cursor: pointer
+  transition: cubic-bezier(0, 0, 0, 1.29) .5s
+  -webkit-user-select: none
+  border-radius: 50px
+
+  &:hover
+    -webkit-backface-visibility: hidden
+    -webkit-transform-style: preserve-3d
+    transform: scale(1.2)
+
+#footer_deal i
+  font-size: .9rem
+  line-height: .9rem
+  height: .9rem
+
+@media screen and (max-width: 768px)
+  img.footer_mini_logo
+    display: none
+
+  div#footer_deal
+    flex-wrap: wrap
+    flex-direction: row
+
+  #footer
+    background: linear-gradient(180deg, var(--sco-background) 0, var(--sco-card-bg) 25%)
+    margin-top: 0
+    z-index: 999
+
+  #letlink
+    flex-direction: column !important
+    text-align: center !important
+
+  #letlogo
+    display: none !important
+
+  #footer-wrap
+    margin-top: 1rem !important
+
+@media screen and (max-width: 1300px)
+  #cookies-window
+    display: none
+
+[data-theme=dark] #sco-footer .footer-item:hover
+  background: var(--sco-theme-op)