chore(style): update code style

assets/css/_partial/_navbar.scss

@@ -32,10 +32,10 @@
 
       &.active {
         font-weight: 900;
-        color: $navbar-active-color;
+        color: $navbar-hover-color;
 
         .dark-theme & {
-          color: $navbar-active-color-dark;
+          color: $navbar-hover-color-dark;
         }
       }
     }

assets/css/_partial/_pagination.scss

@@ -31,11 +31,11 @@
     }
 
     &:hover a {
-      color: $pagination-link-active-color;
+      color: $pagination-link-hover-color;
     }
 
     .dark-theme &:hover a {
-      color: $pagination-link-active-color-dark;
+      color: $pagination-link-hover-color-dark;
     }
 
     &:before,
@@ -44,14 +44,14 @@
       content: "";
       width: 0;
       height: 3px;
-      background: $pagination-link-active-color;
+      background: $pagination-link-hover-color;
       transition: 0.3s;
       bottom: 0px;
     }
 
     .dark-theme &:before,
     .dark-theme &:after {
-      background: $pagination-link-active-color-dark;
+      background: $pagination-link-hover-color-dark;
     }
 
     &:before .active,
@@ -77,11 +77,11 @@
 
     &.active {
       a {
-        color: $pagination-link-active-color;
+        color: $pagination-link-hover-color;
       }
 
       .dark-theme & a {
-        color: $pagination-link-active-color-dark;
+        color: $pagination-link-hover-color-dark;
       }
 
       &:before,

assets/css/_partial/_post/_comment.scss

@@ -0,0 +1,3 @@
+.post-comment {
+  padding: 4rem 0;
+}

assets/css/_partial/_post/_footer.scss

@@ -0,0 +1,94 @@
+.post-footer {
+  margin-top: 3rem;
+
+  .post-info {
+    border-bottom: 1px solid $global-border-color;
+    padding: 1rem 0 0.3rem;
+
+    .dark-theme & {
+      border-bottom: 1px solid $global-border-color-dark;
+    }
+
+    .post-info-line {
+      display: flex;
+      justify-content: space-between;
+
+      .post-info-mod {
+        font-size: 0.8em;
+        color: $global-font-secondary-color;
+
+        .dark-theme & {
+          color: $global-font-secondary-color-dark;
+        }
+      }
+
+      .post-info-license {
+        font-size: 0.8em;
+        color: $global-font-secondary-color;
+
+        .dark-theme & {
+          color: $global-font-secondary-color-dark;
+        }
+      }
+
+      .post-info-md
+      a {
+        font-size: 0.8em;
+        color: $post-link-color;
+
+        .dark-theme & {
+          color: $post-link-color-dark;
+        }
+
+        &:hover {
+          color: $post-link-hover-color;
+
+          .dark-theme & {
+            color: $post-link-hover-color-dark;
+          }
+        }
+      }
+    }
+  }
+
+  .post-info-more {
+    padding: 0.3rem 0 1rem;
+    display: flex;
+    justify-content: space-between;
+    font-size: 0.9rem;
+  }
+
+  .post-nav {
+    &::before,
+    &::after {
+      content: ' ';
+      display: table;
+    }
+
+    & a.prev,
+    & a.next {
+      font-size: 1rem;
+      font-weight: 600;
+
+      transition-duration: .3s;
+      transition-property: transform;
+      transition-timing-function: ease-out;
+    }
+
+    & a.prev {
+      float: left;
+    }
+
+    & a.prev:hover {
+      transform: translateX(-4px);
+    }
+
+    & a.next {
+      float: right;
+    }
+
+    & a.next:hover {
+      transform: translateX(4px);
+    }
+  }
+}

assets/css/_partial/_post/_toc.scss

@@ -0,0 +1,134 @@
+.post-toc {
+  display: block;
+  position: absolute;
+  width: 240px;
+  max-width: 300px;
+  margin-left: 980px;
+  padding: .8rem;
+  border-left: 1px solid $global-border-color;
+  word-wrap: break-word;
+  box-sizing: border-box;
+  top: 12rem;
+
+  .dark-theme & {
+    border-left: 1px solid $global-border-color-dark;
+  }
+
+  .post-toc-title {
+    font-weight: 400;
+    text-transform: uppercase;
+  }
+
+  .post-toc-content {
+    &.always-active ul {
+      display: block;
+    }
+
+    >nav>ul {
+      margin: .625rem 0;
+    }
+
+    ul {
+      text-indent: -0.85rem;
+      padding-left: .625rem;
+      list-style: none;
+
+      a::before {
+        content: "|";
+        font-weight: bolder;
+        margin-right: .5rem;
+        color: $post-link-color;
+
+        .dark-theme & {
+          color: $post-link-color-dark;
+        }
+      }
+
+      ul {
+        padding-left: 1.25rem;
+        display: none;
+      }
+
+      .has-active > ul {
+        display: block;
+      }
+    }
+
+    .toc-link.active {
+      font-weight: bold;
+      color: $post-link-hover-color;
+
+      .dark-theme & {
+        color: $post-link-hover-color-dark;
+      }
+
+      &::before {
+        font-weight: bolder;
+        color: $post-link-hover-color;
+
+        .dark-theme & {
+          color: $post-link-hover-color-dark;
+        }
+      }
+    }
+  }
+}
+
+.post-toc-mobile {
+  display: none;
+  padding-top: .8rem;
+
+  details {
+    summary {
+      .post-toc-title {
+        display: block;
+        display: flex;
+        justify-content: space-between;
+        font-size: 1.2em;
+        font-weight: bold;
+        line-height: 2em;
+        padding: 0 .625rem;
+        background: $code-background-color;
+
+        i.details {
+          line-height: 2em;
+        }
+
+        .dark-theme & {
+          background: $code-background-color-dark;
+        }
+      }
+
+      &::-webkit-details-marker {
+        display: none;
+      }
+    }
+  }
+
+  details[open] {
+    i.details {
+      transform: rotate(180deg);
+    }
+  }
+
+  .post-toc-content {
+    border: 2px solid $code-background-color;
+
+    >nav>ul {
+      margin: .625rem 0;
+    }
+
+    ul {
+      padding-left: .625rem;
+      list-style: none;
+
+      ul {
+        padding-left: 1.25rem;
+      }
+    }
+
+    .dark-theme & {
+      border: 2px solid $code-background-color-dark;
+    }
+  }
+}