hexo-theme-fluid 1.8.13 → 1.9.1

package/source/css/_pages/_base/_widget/header.styl

@@ -1,7 +1,166 @@
+// Rewrite navbar
+.navbar
+  background-color transparent
+  font-size 0.875rem
+  box-shadow 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
+  -webkit-box-shadow 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
+
+  .navbar-brand
+    color var(--navbar-text-color)
+
+  .navbar-toggler .animated-icon span
+    background-color var(--navbar-text-color)
+
+  .nav-item .nav-link
+    display block
+    color var(--navbar-text-color)
+    transition color .2s ease-in-out, background-color .2s ease-in-out
+
+    &:hover
+      color var(--link-hover-color)
+
+    &:focus
+      color var(--navbar-text-color)
+
+    i
+      font-size 0.875rem
+
+  .navbar-toggler
+    border-width 0
+    outline 0
+
+  &.scrolling-navbar
+    will-change background, padding
+    -webkit-transition background 0.5s ease-in-out, padding 0.5s ease-in-out
+    transition background 0.5s ease-in-out, padding 0.5s ease-in-out
+
+    @media (min-width: 600px)
+      &
+        padding-top 12px
+        padding-bottom 12px
+
+      & .navbar-nav > li
+        -webkit-transition-duration 1s
+        transition-duration 1s
+
+    &.top-nav-collapse
+      padding-top 5px
+      padding-bottom 5px
+
+  .dropdown-menu
+    font-size 0.875rem
+    color var(--navbar-text-color)
+    background-color rgba(0, 0, 0, 0.3)
+    border none
+    -webkit-transition background .5s ease-in-out,padding .5s ease-in-out
+    transition background .5s ease-in-out,padding .5s ease-in-out
+
+    @media (max-width: 991.98px)
+      text-align center
+
+  .dropdown-item
+    color var(--navbar-text-color)
+
+    &:hover, &:focus
+      color var(--link-hover-color)
+      background-color rgba(0, 0, 0, 0.1)
+
+  @media (min-width: 992px)
+    .dropdown:hover > .dropdown-menu
+      display block
+
+    .dropdown > .dropdown-toggle:active
+      pointer-events none
+
+    .dropdown-menu
+      top 95%
+
+  .animated-icon
+    width 30px
+    height 20px
+    position relative
+    margin 0
+    -webkit-transform rotate(0deg)
+    -moz-transform rotate(0deg)
+    -o-transform rotate(0deg)
+    transform rotate(0deg)
+    -webkit-transition .5s ease-in-out
+    -moz-transition .5s ease-in-out
+    -o-transition .5s ease-in-out
+    transition .5s ease-in-out
+    cursor pointer
+
+    span
+      display block
+      position absolute
+      height 3px
+      width 100%
+      border-radius 9px
+      opacity 1
+      left 0
+      -webkit-transform rotate(0deg)
+      -moz-transform rotate(0deg)
+      -o-transform rotate(0deg)
+      transform rotate(0deg)
+      -webkit-transition .25s ease-in-out
+      -moz-transition .25s ease-in-out
+      -o-transition .25s ease-in-out
+      transition .25s ease-in-out
+      background #ffffff
+
+      &:nth-child(1)
+        top 0
+
+      &:nth-child(2)
+        top 10px
+
+      &:nth-child(3)
+        top 20px
+
+    &.open
+      span
+        &:nth-child(1)
+          top 11px
+          -webkit-transform rotate(135deg)
+          -moz-transform rotate(135deg)
+          -o-transform rotate(135deg)
+          transform rotate(135deg)
+
+        &:nth-child(2)
+          opacity 0
+          left -60px
+
+        &:nth-child(3)
+          top 11px
+          -webkit-transform rotate(-135deg)
+          -moz-transform rotate(-135deg)
+          -o-transform rotate(-135deg)
+          transform rotate(-135deg)
+
+.navbar .dropdown-collapse, .top-nav-collapse, .navbar-col-show
+  if $navbar-glass-enable
+    ground-glass($navbar-glass-px, $navbar-bg-color, $navbar-glass-alpha)
+  else
+    background-color var(--navbar-bg-color)
+
 @media (max-width: 767px)
-  #subtitle
+  .navbar
+    font-size 1rem
+    line-height 2.5rem
+
+.banner-text
+  color var(--subtitle-color)
+  max-width calc(960px - 6rem)
+  width 80%
+  overflow-wrap break-word
+
+@media (max-width: 767px)
+  #subtitle, .typed-cursor
     font-size 1.5rem
 
 @media (max-width: 575px)
-  #subtitle
+  .banner-text
+    font-size 0.9rem
+
+  #subtitle, .typed-cursor
     font-size 1.35rem

package/source/css/_pages/_base/_widget/modal.styl

@@ -0,0 +1,100 @@
+// Rewrite modal
+.modal-dialog .modal-content
+  background-color var(--board-bg-color)
+  border 0
+  border-radius .125rem
+  -webkit-box-shadow 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15)
+  box-shadow 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15)
+
+.modal-dialog .modal-content .modal-header
+  border-bottom-color var(--line-color)
+  transition border-bottom-color .2s ease-in-out
+
+.close
+  color var(--text-color)
+
+  &:hover
+    color var(--link-hover-color)
+
+  &:focus
+    outline 0
+
+.modal-dialog .modal-content .modal-header
+  border-top-left-radius .125rem
+  border-top-right-radius .125rem
+  border-bottom 1px solid #dee2e6
+
+.md-form
+  position relative
+  margin-top 1.5rem
+  margin-bottom 1.5rem
+
+.md-form
+  input[type]
+    -webkit-box-sizing content-box
+    box-sizing content-box
+    background-color transparent
+    border none
+    border-bottom 1px solid #ced4da
+    border-radius 0
+    outline none
+    -webkit-box-shadow none
+    box-shadow none
+    transition border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out
+
+    $normal = #4285f4
+
+    &:focus:not([readonly])
+      border-bottom 1px solid $normal
+      -webkit-box-shadow 0 1px 0 0 $normal
+      box-shadow 0 1px 0 0 $normal
+
+      & + label
+        color: $normal
+
+    $valid = #00c851
+
+    &.valid, &:focus.valid
+      border-bottom 1px solid $valid
+      -webkit-box-shadow 0 1px 0 0 $valid
+      box-shadow 0 1px 0 0 $valid
+
+      & + label
+        color: $valid
+
+    $invalid = #f44336
+
+    &.invalid, &:focus.invalid
+      border-bottom 1px solid $invalid
+      -webkit-box-shadow 0 1px 0 0 $invalid
+      box-shadow 0 1px 0 0 $invalid
+
+      & + label
+        color $invalid
+
+    &.validate
+      margin-bottom 2.5rem
+
+    &.form-control
+      height auto
+      padding .6rem 0 .4rem 0
+      margin 0 0 .5rem 0
+      color var(--text-color)
+      background-color transparent
+      border-radius 0
+
+  label
+    font-size 0.8rem
+    position absolute
+    top -1rem
+    left 0
+    color #757575
+    cursor text
+    transition color .2s ease-out
+
+.modal-open[style]
+  padding-right: 0 !important
+  overflow auto
+
+  #navbar[style]
+    padding-right 1rem !important

package/source/css/_pages/_base/_widget/ngrogress.styl

@@ -0,0 +1,12 @@
+// Rewrite nprogress
+$npColor = theme-config("fun_features.progressbar.color", "#29d")
+#nprogress
+  .bar
+    height theme-config-unit("fun_features.progressbar.height_px", 3, "px") !important
+    background-color $npColor !important
+  .peg
+    box-shadow 0 0 14px $npColor, 0 0 8px $npColor !important
+
+  @media (max-width: 575px)
+    .bar
+      display none

package/source/css/_pages/_base/_widget/noscript.styl

@@ -0,0 +1,12 @@
+.noscript-warning
+  background-color #f55
+  color #fff
+  font-family sans-serif
+  font-size 1rem
+  font-weight bold
+  position fixed
+  left 0
+  bottom  0
+  text-align center
+  width 100%
+  z-index 99

package/source/css/_pages/_base/_widget/pagination.styl

@@ -0,0 +1,23 @@
+// Rewrite pagination
+.pagination
+  margin-top 3rem
+  justify-content center
+
+  .space
+    align-self flex-end
+
+  .page-number, .current, .extend
+    outline 0
+    border 0
+    background-color transparent
+    font-size .9rem
+    padding .5rem .75rem
+    line-height 1.25
+    border-radius .125rem
+
+  .page-number
+    margin 0 .05rem
+
+  .page-number:hover, .current
+    transition background-color .2s ease-in-out
+    background-color var(--link-hover-bg-color)

package/source/css/_pages/_base/_widget/scroll-btn.styl

@@ -6,19 +6,14 @@
   cursor pointer
   bottom 0
 
-  i
+  i.iconfont
     font-size 2rem
     font-weight bold
     display inline-block
     position relative
     padding-top 2rem
-    color #ff
-    -webkit-transform translateZ(0)
-    -moz-transform translateZ(0)
-    -ms-transform translateZ(0)
-    -o-transform translateZ(0)
+    color var(--subtitle-color)
     transform translateZ(0)
-    -webkit-animation scroll-down 1.5s infinite
     animation scroll-down 1.5s infinite
 
 #scroll-top-button
@@ -34,7 +29,6 @@
   display flex
   display -webkit-flex
   align-items center
-  -webkit-box-shadow 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
   box-shadow 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
 
   i
@@ -43,17 +37,10 @@
     color var(--sec-text-color)
 
   &:hover i, &:active i
-    -webkit-animation-name scroll-top
     animation-name scroll-top
-    -webkit-animation-duration 1s
     animation-duration 1s
-    -webkit-animation-delay .1s
     animation-delay .1s
-    -webkit-animation-timing-function ease-in-out
     animation-timing-function ease-in-out
-    -webkit-animation-iteration-count infinite
     animation-iteration-count infinite
-    -webkit-animation-fill-mode forwards
     animation-fill-mode forwards
-    -webkit-animation-direction alternate
     animation-direction alternate

package/source/css/_pages/_base/_widget/toc.styl

@@ -0,0 +1,75 @@
+#toc
+  visibility hidden
+
+.toc-header
+  margin-bottom .5rem
+  font-weight bold
+  line-height 1.2
+
+  &, & > i
+    font-size 1.25rem
+
+.toc-body
+  max-height 75vh
+  overflow-y auto
+  overflow -moz-scrollbars-none
+  -ms-overflow-style none
+
+  ol
+    list-style none
+    padding-inline-start 1rem
+
+  &::-webkit-scrollbar
+    display none
+
+.tocbot-list
+  position relative
+
+  ol
+    list-style none
+    padding-left 1rem
+
+  a
+    font-size 0.95rem
+
+.tocbot-link
+  color var(--text-color)
+
+.tocbot-active-link
+  font-weight bold
+  color var(--link-hover-color)
+
+.tocbot-is-collapsed
+  max-height 0
+
+.tocbot-is-collapsible
+  overflow hidden
+  transition all .3s ease-in-out
+
+.toc-list-item
+  white-space nowrap
+  overflow hidden
+  text-overflow ellipsis
+
+  &.is-active-li::before
+    height 1rem
+    margin 0.25rem 0
+    visibility visible
+
+  &::before
+    width 0.15rem
+    height 0.2rem
+    position absolute
+    left 0.25rem
+    content ""
+    border-radius 2px
+    margin 0.65rem 0
+    background var(--link-hover-color)
+    visibility hidden
+    transition height .1s ease-in-out, margin .1s ease-in-out, visibility .1s ease-in-out
+
+.sidebar
+  position -webkit-sticky
+  position sticky
+  top 2rem
+  padding 3rem 0

package/source/css/_pages/_base/base.styl

@@ -5,10 +5,8 @@ html
   letter-spacing $letter-spacing
 
 html, body
-  font-family $font-family
-
-html, body, header
   height 100%
+  font-family $font-family
   overflow-wrap break-word
 
 body
@@ -34,6 +32,7 @@ code
 
 table
   font-size inherit
+  color var(--post-text-color)
 
 img[lazyload]
   object-fit cover
@@ -46,3 +45,24 @@ img[lazyload]
 
 *[align="right"]
   text-align right
+
+::-webkit-scrollbar
+  width 6px
+  height 6px
+
+::-webkit-scrollbar-thumb
+  background-color var(--scrollbar-color)
+  border-radius 6px
+
+  &:hover
+    background-color var(--scrollbar-hover-color)
+
+::-webkit-scrollbar-corner
+  background-color transparent
+
+label
+  margin-bottom 0
+
+i.iconfont
+  font-size 1em
+  line-height 1

package/source/css/_pages/_base/color-schema.styl

@@ -1,5 +1,5 @@
 :root
-  --color-mode 'light'
+  --color-mode "light"
   --body-bg-color $body-bg-color
   --board-bg-color $board-bg-color
   --text-color $text-color
@@ -9,8 +9,16 @@
   --post-link-color $post-link-color
   --link-hover-color $link-hover-color
   --link-hover-bg-color $link-hover-bg-color
+  --line-color $line-color
   --navbar-bg-color $navbar-bg-color
   --navbar-text-color $navbar-text-color
+  --subtitle-color $subtitle-color
+  --scrollbar-color $scrollbar-color
+  --scrollbar-hover-color $scrollbar-hover-color
+  --button-bg-color $button-bg-color
+  --button-hover-bg-color $button-hover-bg-color
+  --highlight-bg-color $highlight-bg-color
+  --inlinecode-bg-color $inlinecode-bg-color
 
 dark-colors()
   --body-bg-color $body-bg-color-dark
@@ -22,77 +30,41 @@ dark-colors()
   --post-link-color $post-link-color-dark
   --link-hover-color $link-hover-color-dark
   --link-hover-bg-color $link-hover-bg-color-dark
+  --line-color $line-color-dark
   --navbar-bg-color $navbar-bg-color-dark
   --navbar-text-color $navbar-text-color-dark
-
-  img, .note, .label
+  --subtitle-color $subtitle-color-dark
+  --scrollbar-color $scrollbar-color-dark
+  --scrollbar-hover-color $scrollbar-hover-color-dark
+  --button-bg-color $button-bg-color-dark
+  --button-hover-bg-color $button-hover-bg-color-dark
+  --highlight-bg-color $highlight-bg-color-dark
+  --inlinecode-bg-color $inlinecode-bg-color-dark
+
+  img
     -webkit-filter brightness(.9)
     filter brightness(.9)
     transition filter .2s ease-in-out
 
-  .page-header
-    color #ddd
-    transition color .2s ease-in-out
-
-  .markdown-body
-
-    :not(pre) > code
-      background-color rgba(#3e4b5e, .35)
-      transition background-color .2s ease-in-out
-
-    pre, td.gutter, td.code > .code-wrapper
-      -webkit-filter brightness(.9)
-      filter brightness(.9)
-      transition filter .2s ease-in-out
-
-    td.gutter pre
-      -webkit-filter initial
-      filter initial
-
-    h1, h2
-      border-bottom-color $line-color-dark
-      transition border-bottom-color .2s ease-in-out
-
-    h1, h2, h3, h6, h5, h6
-      color #ddd
-      transition all .2s ease-in-out
-
-    table
-      tr
-        background-color var(--board-bg-color)
-        transition background-color .2s ease-in-out
-      tr:nth-child(2n)
-        background-color var(--board-bg-color)
-        transition background-color .2s ease-in-out
-      th, td
-        border-color $line-color-dark
-        transition border-color .2s ease-in-out
-
-  hr, .markdown-body hr
-    border-top-color $line-color-dark
-    transition border-top-color .2s ease-in-out
-
   .navbar .dropdown-collapse, .top-nav-collapse, .navbar-col-show
     if $navbar-glass-enable
       ground-glass($navbar-glass-px, $navbar-bg-color-dark, $navbar-glass-alpha)
 
-  .note :not(pre) > code
-    background-color rgba(27, 31, 35, .05)
-
-  .modal-dialog .modal-content .modal-header
-    border-bottom-color $line-color-dark
-    transition border-bottom-color .2s ease-in-out
+  .license-box
+    background-color rgba(#3e4b5e, .35)
+    transition background-color .2s ease-in-out
 
   .gt-comment-admin .gt-comment-content
     background-color transparent
     transition background-color .2s ease-in-out
 
-@media (prefers-color-scheme: dark)
-  :root
-    --color-mode 'dark'
+if (hexo-config("dark_mode.enable"))
+  @media (prefers-color-scheme: dark)
+    :root
+      --color-mode "dark"
 
-  :root:not([data-user-color-scheme])
-    dark-colors()
+    :root:not([data-user-color-scheme])
+      dark-colors()
 
-[data-user-color-scheme='dark']
-  dark-colors()
+  [data-user-color-scheme="dark"]
+    dark-colors()

package/source/css/_pages/_base/inline.styl

@@ -42,10 +42,10 @@
 
 .hover-with-bg
   display inline-block
-  padding .45rem
+  line-height 1
 
   &:hover
     background-color var(--link-hover-bg-color)
     transition-duration .2s
     transition-timing-function ease-in-out
-    border-radius .15rem
+    border-radius .2rem

package/source/css/_pages/_category/category-bar.styl

@@ -0,0 +1,59 @@
+.category-bar
+
+  .category-list
+    max-height 85vh
+    overflow-y auto
+    overflow-x hidden
+
+    &::-webkit-scrollbar
+      display none
+
+    & > .category-sub > a
+      font-weight bold
+      font-size 1.2rem
+
+    .category-item-action i
+      margin 0
+
+    .category-subitem
+      &.list-group-item
+        padding-left .5rem
+        padding-right 0
+
+    .category-collapse
+      .category-post-list
+        margin-top .25rem
+        margin-bottom .5rem
+
+      .category-post
+        font-size .9rem
+        line-height 1.75
+
+    .category-item-action:hover
+      background-color initial
+
+  .list-group-item
+    padding 0
+
+    &.active
+      color var(--link-hover-color)
+      background-color initial
+      font-weight bold
+      font-family "iconfont"
+      font-style normal
+      -webkit-font-smoothing antialiased
+
+      &::before
+        content "\e61f"
+        font-weight initial
+        position absolute
+        left -1.25rem
+
+  .list-group-count
+    margin-left .2rem
+    margin-right .2rem
+    font-size .9em
+
+  .list-group-item-action
+    &:focus, &:hover
+      background-color initial

package/source/css/_pages/_category/category-chain.styl

@@ -0,0 +1,6 @@
+.category-chains
+  display flex
+  flex-wrap wrap
+
+  & > *:not(:last-child)
+    margin-right 1em