🎨 Try to add different schema css style.

assets/css/style-gemini.css

@@ -2,23 +2,29 @@
 {{ $P := .Site.Params -}}
 
 {{- with $P.sidebar -}}
+{{- $width := (int (math.Max .width 240)) -}}
+{{- $pad := (add $width .offset) }}
 .main {
 {{ if eq .position "right" }}
   flex-direction: row-reverse;
 {{- end }}
 }
 .header-inner {
-  width: {{ .width }}px;
+  width: {{ $width }}px;
 }
 .main-inner {
-  width: calc(100% - {{ add .width .offset }}px);
+  width: calc(100% - {{ $pad }}px);
 }
 .sidebar {
-  width: {{ .width }}px;
+  width: {{ $width }}px;
   visibility: inherit;
 }
 .sidebar-inner {
-  padding: {{ .padding }} 10px;
+  padding: {{ .padding }}px 10px;
+}
+.footer-inner {
+  padding-{{ .position }}: {{ $pad }}px;
+  width: calc(100% - 20px);
 }
 {{- end }}
 
@@ -31,8 +37,11 @@
 {{- end }}
 }
 
-.back-to-top {
+.site-state-item {
-  bottom: 30px;
+  border-left: 1px solid #eee;
+}
+.site-state-item:first-child {
+  border-left: none;
 }
 
 .rss-link {
@@ -93,3 +102,7 @@
   margin-top: 5px;
 {{- end }}
 }
+
+.back-to-top {
+  bottom: 30px;
+}

layouts/_default/baseof.html

@@ -38,11 +38,6 @@
       {{ partial "partials/footer.html" . }}
     </div>
   </footer>
-
-  <div class="back-to-top" role="button" aria-label="返回顶部">
-    <i class="fa fa-arrow-up"></i>
-    <span>0%</span>
-  </div>
 </body>
 
 </html>

layouts/partials/head/css.html

@@ -1,6 +1,6 @@
   <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.1.1/css/all.min.css" integrity="sha256-DfWjNxDkM94fVBWx1H5BMMp0Zq7luBlV8QRcSES7s+0=" crossorigin="anonymous">
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/animate.css@3.1.1/animate.min.css" integrity="sha256-PR7ttpcvz8qrF57fur/yAx1qXMFJeJFiA6pSzWi0OIE=" crossorigin="anonymous">
   <!-- NexT theme css style -->
-  <link rel="stylesheet" href="/css/main.css">  
+  <link rel="stylesheet" href="/css/main-gemini.css">  
-{{- $style := resources.Get "css/style.css" | resources.ExecuteAsTemplate "css/style.css" . }}
+{{- $style := resources.Get "css/style-gemini.css" | resources.ExecuteAsTemplate "css/style-gemini.css" . }}
   <link rel="stylesheet" href="{{ $style.RelPermalink }}">  

layouts/partials/header/sidebar.html

@@ -64,5 +64,9 @@
                 {{ end }}
             </div>
         </div>
+        <div class="back-to-top" role="button" aria-label="返回顶部">
+          <i class="fa fa-arrow-up"></i>
+          <span>0%</span>
+        </div>
     </div>
 </aside>

static/css/main-gemini.css

@@ -12,7 +12,7 @@
   --table-row-odd-bg-color: #f9f9f9;
   --table-row-hover-bg-color: #f5f5f5;
   --menu-item-bg-color: #f5f5f5;
-  --theme-color: #222;
+  --theme-color: #000;
   --btn-default-bg: #fff;
   --btn-default-color: #555;
   --btn-default-border-color: #555;
@@ -400,6 +400,30 @@ td {
   top: -5px;
   transform: rotate(-45deg);
 }
+/*!
+  Theme: Default
+  Description: Original highlight.js style
+  Author: (c) Ivan Sagalaev <maniac@softwaremaniacs.org>
+  Maintainer: @highlightjs/core-team
+  Website: https://highlightjs.org/
+  License: see project LICENSE
+  Touched: 2021
+*/pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{background:#f3f3f3;color:#444}.hljs-comment{color:#697070}.hljs-punctuation,.hljs-tag{color:#444a}.hljs-tag .hljs-attr,.hljs-tag .hljs-name{color:#444}.hljs-attribute,.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-name,.hljs-selector-tag{font-weight:700}.hljs-deletion,.hljs-number,.hljs-quote,.hljs-selector-class,.hljs-selector-id,.hljs-string,.hljs-template-tag,.hljs-type{color:#800}.hljs-section,.hljs-title{color:#800;font-weight:700}.hljs-link,.hljs-operator,.hljs-regexp,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-symbol,.hljs-template-variable,.hljs-variable{color:#ab5656}.hljs-literal{color:#695}.hljs-addition,.hljs-built_in,.hljs-bullet,.hljs-code{color:#397300}.hljs-meta{color:#1f7199}.hljs-meta .hljs-string{color:#38a}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}
+@media (prefers-color-scheme: dark) {
+pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
+  Theme: StackOverflow Dark
+  Description: Dark theme as used on stackoverflow.com
+  Author: stackoverflow.com
+  Maintainer: @Hirse
+  Website: https://github.com/StackExchange/Stacks
+  License: MIT
+  Updated: 2021-05-15
+
+  Updated for @stackoverflow/stacks v0.64.0
+  Code Blocks: /blob/v0.64.0/lib/css/components/_stacks-code-blocks.less
+  Colors: /blob/v0.64.0/lib/css/exports/_stacks-constants-colors.less
+*/.hljs{color:#fff;background:#1c1b1b}.hljs-subst{color:#fff}.hljs-comment{color:#999}.hljs-attr,.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-section,.hljs-selector-tag{color:#88aece}.hljs-attribute{color:#c59bc1}.hljs-name,.hljs-number,.hljs-quote,.hljs-selector-id,.hljs-template-tag,.hljs-type{color:#f08d49}.hljs-selector-class{color:#88aece}.hljs-link,.hljs-regexp,.hljs-selector-attr,.hljs-string,.hljs-symbol,.hljs-template-variable,.hljs-variable{color:#b5bd68}.hljs-meta,.hljs-selector-pseudo{color:#88aece}.hljs-built_in,.hljs-literal,.hljs-title{color:#f08d49}.hljs-bullet,.hljs-code{color:#ccc}.hljs-meta .hljs-string{color:#b5bd68}.hljs-deletion{color:#de7176}.hljs-addition{color:#76c490}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}
+}
 code,
 kbd,
 figure.highlight,
@@ -1251,9 +1275,76 @@ pre code {
 .use-motion .menu-item {
   visibility: hidden;
 }
+.github-corner :hover .octo-arm {
+  animation: octocat-wave 560ms ease-in-out;
+}
+.github-corner svg {
+  color: #fff;
+  fill: var(--theme-color);
+  position: absolute;
+  right: 0;
+  top: 0;
+  z-index: 5;
+}
+@media (max-width: 991px) {
+  .github-corner svg {
+    color: var(--theme-color);
+    fill: #fff;
+  }
+  .github-corner .github-corner:hover .octo-arm {
+    animation: none;
+  }
+  .github-corner .github-corner .octo-arm {
+    animation: octocat-wave 560ms ease-in-out;
+  }
+}
+@-moz-keyframes octocat-wave {
+  0%, 100% {
+    transform: rotate(0);
+  }
+  20%, 60% {
+    transform: rotate(-25deg);
+  }
+  40%, 80% {
+    transform: rotate(10deg);
+  }
+}
+@-webkit-keyframes octocat-wave {
+  0%, 100% {
+    transform: rotate(0);
+  }
+  20%, 60% {
+    transform: rotate(-25deg);
+  }
+  40%, 80% {
+    transform: rotate(10deg);
+  }
+}
+@-o-keyframes octocat-wave {
+  0%, 100% {
+    transform: rotate(0);
+  }
+  20%, 60% {
+    transform: rotate(-25deg);
+  }
+  40%, 80% {
+    transform: rotate(10deg);
+  }
+}
+@keyframes octocat-wave {
+  0%, 100% {
+    transform: rotate(0);
+  }
+  20%, 60% {
+    transform: rotate(-25deg);
+  }
+  40%, 80% {
+    transform: rotate(10deg);
+  }
+}
 .sidebar-inner {
   color: #999;
-  max-height: calc(100vh - 36px);
+  max-height: calc(100vh - 40px);
   padding: 20px 10px;
   text-align: center;
   display: flex;
@@ -1277,9 +1368,7 @@ pre code {
   border: 1px solid #eee;
   max-width: 120px;
   padding: 2px;
-}
+  border-radius: 50%;
-.site-author-image:hover {
-  transform: rotateZ(360deg);
 }
 .site-author-name {
   color: var(--text-color);
@@ -1508,10 +1597,6 @@ pre code {
 }
 .site-state-item {
   padding: 0 15px;
-  border-left: 1px solid #eee;
-}
-.site-state-item:first-child {
-  border-left: none;
 }
 .site-state-item a {
   border-bottom: 0;
@@ -1580,6 +1665,12 @@ pre code {
   display: inline-block;
   margin: 0 5px;
 }
+.busuanzi-count #busuanzi_container_site_uv {
+  display: none;
+}
+.busuanzi-count #busuanzi_container_site_pv {
+  display: none;
+}
 @-moz-keyframes icon-animate {
   0%, 100% {
     transform: scale(1);
@@ -1651,40 +1742,26 @@ pre code {
 }
 .back-to-top {
   font-size: 12px;
-  bottom: -100px;
+  margin: 0px -10px -20px;
-  box-sizing: border-box;
+  opacity: 0;
-  color: #fff;
+  transition: opacity 0.2s ease-in-out;
-  padding: 0 6px;
-  transition: bottom 0.2s ease-in-out;
-  background: #222;
-  cursor: pointer;
-  opacity: 0.6;
-  position: fixed;
-  z-index: 30;
-  right: 30px;
-  width: 24px;
-}
-.back-to-top span {
-  display: none;
-}
-@media (max-width: 991px) {
-  .back-to-top {
-    right: 20px;
-  }
-}
-.back-to-top:hover {
-  opacity: 0.8;
-}
-@media (max-width: 991px) {
-  .back-to-top {
-    opacity: 0.8;
-  }
-}
-.back-to-top:hover {
-  color: #fc6423;
 }
 .back-to-top.back-to-top-on {
-  bottom: 30px;
+  cursor: pointer;
+  opacity: 0.6;
+}
+.back-to-top.back-to-top-on:hover {
+  opacity: 0.8;
+}
+.reading-progress-bar {
+  --progress: 0;
+  background: #37c6c0;
+  height: 3px;
+  position: fixed;
+  z-index: 50;
+  width: var(--progress);
+  left: 0;
+  bottom: 0;
 }
 .rtl.post-body p,
 .rtl.post-body a,
@@ -2059,6 +2136,9 @@ pre code {
   flex-basis: 100%;
   height: 0;
 }
+#busuanzi_container_page_pv {
+  display: none;
+}
 .post-nav {
   border-top: 1px solid #eee;
   display: flex;
@@ -2175,6 +2255,10 @@ pre code {
 .post-reward div span {
   display: block;
 }
+.post-reward div:hover span {
+  animation: next-roll 0.1s infinite linear;
+  pointer-events: none;
+}
 .post-reward img {
   display: inline-block;
   margin: 0.8em 2em 0;
@@ -2213,6 +2297,39 @@ pre code {
     transform: rotateZ(-30deg);
   }
 }
+.followme {
+  color: #bbb;
+  padding: 1em 1.5em;
+  text-align: center;
+  background: var(--card-bg-color);
+  border-left: 3px solid #ff2a2a;
+  margin: 1em 0 0;
+}
+.followme .social-list {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+}
+.followme .social-list .social-item {
+  margin: 0.5em 2em;
+}
+@media (max-width: 991px) {
+  .followme .social-list .social-item {
+    margin: 0.5em 0.75em;
+  }
+}
+.followme .social-list .social-link {
+  border: 0;
+  display: inline-block;
+  text-align: center;
+}
+.followme .social-list .social-link .icon {
+  font-size: 1.75em;
+}
+.followme .social-list .social-link .label {
+  display: block;
+  font-size: 14px;
+}
 .category-all-page .category-all-title {
   text-align: center;
 }
@@ -2502,7 +2619,7 @@ ul.breadcrumb li:last-child {
   background: var(--content-bg-color);
   border-radius: initial;
   box-shadow: 0 2px 2px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.06), 0 1px 5px 0 rgba(0,0,0,0.12);
-  width: 300px;
+  width: 280px;
 }
 @media (max-width: 991px) {
   .header-inner {
@@ -2536,7 +2653,7 @@ ul.breadcrumb li:last-child {
 .main-inner {
   border-radius: initial;
   box-sizing: border-box;
-  width: calc(100% - 318px);
+  width: calc(100% - 300px);
 }
 @media (max-width: 991px) {
   .main-inner {
@@ -2544,9 +2661,9 @@ ul.breadcrumb li:last-child {
     width: 100%;
   }
 }
-.footer-inner {
+/* .footer-inner {
-  padding-left: 318px;
+  padding-left: 300px;
-}
+} */
 @media (max-width: 991px) {
   .footer-inner {
     padding-left: 0;
@@ -2624,17 +2741,6 @@ ul.breadcrumb li:last-child {
   padding: 2px 5px;
   text-shadow: 1px 1px 0 rgba(0,0,0,0.1);
 }
-.main-menu .menu-item-active::after {
-  background: #bbb;
-  border-radius: 50%;
-  content: ' ';
-  height: 6px;
-  margin-top: -3px;
-  position: absolute;
-  right: 15px;
-  top: 50%;
-  width: 6px;
-}
 .sub-menu {
   margin: 0;
   padding: 6px 0;
@@ -2659,11 +2765,11 @@ ul.breadcrumb li:last-child {
   border-bottom-color: #fc6423;
 }
 .sidebar {
-  margin-top: 18px;
+  margin-top: 20px;
   position: -webkit-sticky;
   position: sticky;
-  top: 18px;
+  top: 20px;
-  width: 300px;
+  width: 280px;
   visibility: hidden;
 }
 @media (max-width: 991px) {
@@ -2739,6 +2845,13 @@ ul.breadcrumb li:last-child {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+.back-to-top {
+  background: var(--body-bg-color);
+  margin: -12px -10px -18px;
+}
+.back-to-top.back-to-top-on {
+  margin-top: 16px;
+}
 .main-inner > .sub-menu,
 .main-inner > .post-block,
 .main-inner > .tabs-comment,
@@ -2755,7 +2868,7 @@ ul.breadcrumb li:last-child {
 .main-inner > .pagination:not(:first-child):not(.sub-menu) {
   border-radius: initial;
   box-shadow: 0 2px 2px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.06), 0 1px 5px 0 rgba(0,0,0,0.12), 0 -1px 0.5px 0 rgba(0,0,0,0.09);
-  margin-top: 18px;
+  margin-top: 20px;
 }
 @media (min-width: 768px) and (max-width: 991px) {
   .main-inner > .sub-menu:not(:first-child):not(.sub-menu),
@@ -2812,12 +2925,12 @@ ul.breadcrumb li:last-child {
     padding: 8px;
   }
   .posts-expand .post-button {
-    margin: 18px 0;
+    margin: 20px 0;
   }
   .post-block {
-    padding: 18px;
+    padding: 20px;
   }
   .comments {
-    padding: 10px 18px;
+    padding: 10px 20px;
   }
 }