use LoveIt theme, self hosted

themes/LoveIt/assets/css/_core/_base.scss

@@ -0,0 +1,55 @@
+html {
+  font-family: $global-font-family;
+  font-weight: $global-font-weight;
+  font-display: swap;
+  font-size: $global-font-size;
+  line-height: $global-line-height;
+  width:100%;
+}
+
+/* scrollbar, only support webkit */
+::-webkit-scrollbar {
+  width: .5rem;
+  height: .5rem;
+}
+
+::-webkit-scrollbar-thumb {
+  background-color: $scrollbar-color;
+
+  &:hover {
+    background-color: $scrollbar-hover-color;
+  }
+}
+
+::selection {
+  background-color: $selection-color;
+
+  [theme=dark] & {
+    background-color: $selection-color-dark;
+  }
+}
+
+body {
+  background-color: $global-background-color;
+  color: $global-font-color;
+  @include overflow-wrap(break-word);
+  scrollbar-color: auto;
+
+  &[theme=dark] {
+    color: $global-font-color-dark;
+    background-color: $global-background-color-dark;
+  }
+}
+
+@include ms;
+@include link(true, true);
+
+@import "../_partial/mask";
+@import "../_partial/icon";
+@import "../_partial/details";
+@import "../_partial/fixed-button";
+@import "../_partial/cookieconsent";
+
+img {
+  @include object-fit(contain);
+}

themes/LoveIt/assets/css/_core/_layout.scss

@@ -0,0 +1,15 @@
+/** Layout **/
+.wrapper {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+  width: 100%;
+
+  main {
+    flex: 1 0 auto;
+
+    .container {
+      padding: 0 1rem;
+    }
+  }
+}

themes/LoveIt/assets/css/_core/_media.scss

@@ -0,0 +1,80 @@
+@media only screen and (max-width: 1440px) {
+  .page {
+    width: 56%;
+  }
+}
+
+@media only screen and (max-width: 1200px) {
+  .page {
+    width: 52%;
+  }
+
+  #header-desktop .header-wrapper {
+    padding-right: 1rem;
+  }
+
+  .search-dropdown.desktop {
+    right: 1rem;
+  }
+}
+
+@media only screen and (max-width: 960px) {
+  #toc-auto {
+    display: none;
+  }
+
+  #toc-static {
+    display: block;
+  }
+
+  .page {
+    width: 80%;
+  }
+
+  #header-desktop .header-wrapper {
+    padding-left: 1rem;
+  }
+}
+
+@media only screen and (max-width: 680px) {
+  #header-desktop {
+    display: none;
+  }
+
+  #header-mobile {
+    display: block;
+  }
+
+  body.blur {
+    overflow: hidden;
+  }
+
+  .page {
+    width: 100%;
+
+    [header-mobile] & {
+      padding-top: $header-height;
+    }
+
+    [header-mobile=normal] & {
+      padding-top: 0;
+    }
+
+    .categories-card {
+      .card-item {
+        width: 100%;
+      }
+    }
+  }
+
+  .copyright {
+    .copyright-line {
+      .icp-splitter {
+        display: none;
+      }
+      .icp-br {
+        display: block;
+      }
+    }
+  }
+}

themes/LoveIt/assets/css/_custom.scss

@@ -0,0 +1,4 @@
+// ==============================
+// Custom style
+// 自定义样式
+// ==============================

themes/LoveIt/assets/css/_mixin/_blur.scss

@@ -0,0 +1,5 @@
+@mixin blur {
+  .blur & {
+    @include filter(blur(1.5px));
+  }
+}

themes/LoveIt/assets/css/_mixin/_compatibility.scss

@@ -0,0 +1,110 @@
+@mixin border-radius($value) {
+  -webkit-border-radius: $value;
+  -moz-border-radius: $value;
+  border-radius: $value;
+}
+
+@mixin box-shadow($values...) {
+  -webkit-box-shadow: $values;
+  box-shadow: $values;
+}
+
+@mixin transition($values...) {
+  -webkit-transition: $values;
+  -moz-transition: $values;
+  -o-transition: $values;
+  transition: $values;
+}
+
+@mixin transform($value) {
+  -webkit-transform: $value;
+  -moz-transform: $value;
+  -ms-transform: $value;
+  -o-transform: $value;
+  transform: $value;
+}
+
+@mixin filter($value) {
+  -webkit-filter: $value;
+  -moz-filter: $value;
+  -ms-filter: $value;
+  filter: $value;
+}
+
+@mixin flex($value) {
+  -webkit-flex: $value;
+  flex: $value;
+}
+
+@mixin box($orient) {
+  display: -moz-box;
+  display: -webkit-box;
+  display: box;
+
+  -webkit-box-orient: $orient;
+  -moz-box-orient: $orient;
+  box-orient: $orient;
+}
+
+@mixin placeholder($color) {
+  input::-webkit-input-placeholder{
+    color: $color;
+  }
+
+  input:-moz-placeholder{
+    color: $color;
+  }
+
+  input::-moz-placeholder{
+    color: $color;
+  }
+
+  input:-ms-input-placeholder{
+    color: $color;
+  }
+
+  input::placeholder {
+    color: $color;
+  }
+}
+
+@mixin max-content($property) {
+  #{$property}: -webkit-max-content;
+  #{$property}: -moz-max-content;
+  #{$property}: intrinsic;
+  #{$property}: max-content;
+}
+
+@mixin tab-size($value) {
+  -moz-tab-size: $value;
+  -o-tab-size: $value;
+  tab-size: $value;
+}
+
+@mixin appearance($value) {
+  -moz-appearance: $value;
+  -webkit-appearance: $value;
+}
+
+@mixin overflow-wrap($value) {
+  word-wrap: $value;
+  overflow-wrap: $value;
+}
+
+@mixin line-break($value) {
+  -webkit-line-break: $value;
+  -ms-line-break: $value;
+  line-break: $value;
+}
+
+@mixin ms {
+  input::-ms-clear {
+    display: none;
+  }
+}
+
+@mixin object-fit($value) {
+  -o-object-fit: $value;
+  object-fit: $value;
+  font-family: 'object-fit: #{$value};';
+}

themes/LoveIt/assets/css/_mixin/_details.scss

@@ -0,0 +1,7 @@
+@mixin details-transition-open {
+  @include transition(max-height 0.8s cubic-bezier(0, 1, 0, 1) -0.1s);
+}
+
+@mixin details-transition-close {
+  @include transition(max-height 0.8s cubic-bezier(0.5, 0, 1, 0) 0s);
+}

themes/LoveIt/assets/css/_mixin/_index.scss

@@ -0,0 +1,4 @@
+@import "_compatibility";
+@import "_link";
+@import "_blur";
+@import "_details";

themes/LoveIt/assets/css/_mixin/_link.scss

@@ -0,0 +1,20 @@
+@mixin link($light, $dark) {
+  a, a::before, a::after {
+    text-decoration: none;
+
+    color: if($light, $global-link-color, $single-link-color);
+
+    [theme=dark] & {
+      color: if($dark, $global-link-color-dark, $single-link-color-dark);
+    }
+  }
+
+  a:active,
+  a:hover {
+    color: if($light, $global-link-hover-color, $single-link-hover-color);
+
+    [theme=dark] & {
+      color: if($dark, $global-link-hover-color-dark, $single-link-hover-color-dark);
+    }
+  }
+}

themes/LoveIt/assets/css/_override.scss

@@ -0,0 +1,4 @@
+// ==============================
+// Override Variables
+// 覆盖变量
+// ==============================

themes/LoveIt/assets/css/_page/_404.scss

@@ -0,0 +1,6 @@
+#content-404 {
+  font-size: 1.8rem;
+  line-height: 3rem;
+  @include transform(translateY(30vh));
+  text-align: center;
+}

themes/LoveIt/assets/css/_page/_archive.scss

@@ -0,0 +1,13 @@
+.archive {
+  .single-title {
+    text-align: right;
+  }
+
+  .group-title {
+    margin-top: 1.5rem;
+    margin-bottom: 1rem;
+  }
+
+  @import "../_partial/_archive/terms";
+  @import "../_partial/_archive/tags";
+}

themes/LoveIt/assets/css/_page/_home.scss

@@ -0,0 +1,182 @@
+.home {
+  .home-profile {
+    @include transform(translateY( 16vh));
+    padding: 0 0 .5rem;
+    text-align: center;
+
+    .home-avatar {
+      padding: .5rem;
+
+      img {
+        display: inline-block;
+        width: 8rem;
+        height: auto;
+        margin: 0 auto;
+        @include border-radius(100%);
+        @include box-shadow(0 0 0 .3618em rgba(0, 0, 0, .05));
+        @include transition(all 0.4s ease);
+
+        &:hover {
+          position: relative;
+          @include transform(translateY(-.75rem));
+        }
+      }
+    }
+
+    .home-title {
+      font-size: 1.25rem;
+      font-weight: bold;
+      margin: 0;
+      padding: .5rem;
+    }
+
+    .home-subtitle {
+      font-size: 1rem;
+      font-weight: normal;
+      margin: 0;
+      padding: .5rem;
+    }
+
+    .links {
+      padding: .5rem;
+      font-size: 1.5rem;
+
+      a * {
+        vertical-align: text-bottom;
+      }
+
+      img {
+        height: 1.5rem;
+        padding: 0 .25rem;
+      }
+    }
+
+    .home-disclaimer {
+      font-size: 1rem;
+      line-height: 1.5rem;
+      font-weight: normal;
+      margin: 0;
+      padding: .5rem;
+      color: $global-font-secondary-color;
+
+      [theme=dark] & {
+        color: $global-font-secondary-color-dark;
+      }
+    }
+  }
+}
+
+.home[posts] {
+  .home-profile {
+    @include transform(translateY(0));
+    padding-top: 2rem;
+  }
+
+  .home-avatar img {
+    width: 6rem;
+  }
+
+  .summary {
+    padding-top: 1rem;
+    padding-bottom: .8rem;
+    color: $global-font-color;
+    border-bottom: 1px dashed $global-border-color;
+
+    [theme=dark] & {
+      color: $global-font-color-dark;
+      border-bottom: 1px dashed $global-border-color-dark;
+    }
+
+    .featured-image-preview {
+      width: 100%;
+      padding: 30% 0 0;
+      position: relative;
+      margin: 0.6rem auto;
+      @include transition(transform 0.4s ease);
+
+      img {
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        left: 0;
+        top: 0;
+        @include object-fit(none);
+      }
+
+      img.lazyloaded {
+        @include object-fit(cover);
+      }
+
+      &:hover {
+        @include transform(scale(1.01));
+      }
+    }
+
+    .single-title {
+      font-size: 1.25rem;
+      line-height: 140%;
+      margin: 0.4rem 0;
+    }
+
+    .content {
+      @include box(vertical);
+      -webkit-line-clamp: 3;
+      margin-top: .3rem;
+      width: 100%;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      @include overflow-wrap(break-word);
+      color: $global-font-secondary-color;
+
+      [theme=dark] & {
+        color: $global-font-secondary-color-dark;
+      }
+
+      h2,
+      h3,
+      h4,
+      h5,
+      h6,
+      p {
+        font-size: 1rem;
+        line-height: 1.5;
+        display: inline;
+
+        &::after {
+          content: "\A";
+          white-space: pre;
+        }
+      }
+
+      h2 {
+        font-size: 1.125rem;
+      }
+
+      @include link(false, true);
+
+      b, strong {
+        color: $global-font-secondary-color;
+
+        [theme=dark] & {
+          color: $global-font-secondary-color-dark;
+        }
+      }
+    }
+
+    .post-footer {
+      margin-top: .4rem;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      font-size: .875rem;
+
+      @include link(false, false);
+
+      .post-tags {
+        padding: 0;
+
+        @include link(true, true);
+      }
+    }
+  }
+}

themes/LoveIt/assets/css/_page/_index.scss

@@ -0,0 +1,22 @@
+.page {
+  position: relative;
+  max-width: 800px;
+  width: 60%;
+  margin: 0 auto;
+
+  [header-desktop] & {
+    padding-top: $header-height;
+  }
+
+  [header-desktop=normal] & {
+    padding-top: 0;
+  }
+
+  @include blur;
+}
+
+@import "_single";
+@import "_special";
+@import "_archive";
+@import "_home";
+@import "_404";

themes/LoveIt/assets/css/_page/_single.scss

@@ -0,0 +1,331 @@
+@import "../_partial/_single/toc";
+
+.single {
+  .single-title {
+    margin: 1rem 0 .5rem;
+    font-size: 1.6rem;
+    font-weight: bold;
+    line-height: 140%;
+  }
+
+  .single-subtitle {
+    margin: .4rem 0;
+    font-size: 1.2rem;
+    font-weight: normal;
+    font-style: italic;
+    line-height: 100%;
+  }
+
+  .post-meta {
+    font-size: .875rem;
+    color: $global-font-secondary-color;
+
+    span {
+      display: inline-block;
+    }
+
+    [theme=dark] & {
+      color: $global-font-secondary-color-dark;
+    }
+
+    @include link(false, true);
+
+    .author {
+      font-size: 1.05rem;
+    }
+  }
+
+  .featured-image {
+    margin: .5rem 0 1rem 0;
+
+    img {
+      display: block;
+      max-width: 100%;
+      height: auto;
+      margin: 0 auto;
+      overflow: hidden;
+    }
+
+    img.lazyloaded {
+      width: 100%;
+    }
+  }
+
+  .content {
+    > h2 {
+      font-size: 1.5rem;
+
+      & code {
+        font-size: 1.25rem;
+      }
+    }
+
+    > h3 {
+      font-size: 1.375rem;
+
+      & code {
+        font-size: 1.125rem;
+      }
+    }
+
+    > h4 {
+      font-size: 1.25rem;
+
+      & code {
+        font-size: 1rem;
+      }
+    }
+
+    > h5 {
+      font-size: 1.125rem;
+    }
+
+    > h6 {
+      font-size: 1rem;
+    }
+
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+      font-weight: bold;
+      margin: 1.2rem 0;
+
+      [theme=dark] & {
+        font-weight: bolder;
+      }
+    }
+
+    > h2,
+    > h3,
+    > h4,
+    > h5,
+    > h6 {
+      > .header-mark::before {
+        content: "|";
+        margin-right: .3125rem;
+        color: $single-link-color;
+
+        [theme=dark] & {
+          color: $single-link-color-dark;
+        }
+      }
+    }
+
+    > h2 > .header-mark::before {
+      content: "#";
+    }
+
+    p {
+      margin: .5rem 0;
+    }
+
+    b, strong {
+      font-weight: bold;
+
+      [theme=dark] & {
+        color: #ddd;
+      }
+    }
+
+    @include link(false, false);
+
+    a {
+      @include overflow-wrap(break-word);
+
+      [theme=dark] & b, [theme=dark] & strong {
+        color: $single-link-color-dark;
+      }
+    }
+
+    [theme=dark] a:hover b, [theme=dark] a:hover strong {
+      color: $single-link-hover-color-dark;
+    }
+
+    ul, ol {
+      margin: .5rem 0;
+      padding-left: 2.5rem;
+    }
+
+    ul {
+      list-style-type: disc;
+    }
+
+    ruby {
+      background: $code-background-color;
+
+      rt {
+        color: $global-font-secondary-color;
+      }
+
+      [theme=dark] & {
+        background: $code-background-color-dark;
+
+        rt {
+          color: $global-font-secondary-color-dark;
+        }
+      }
+    }
+
+    .table-wrapper {
+      overflow-x: auto;
+
+      &::-webkit-scrollbar {
+        background-color: $table-background-color;
+
+        [theme=dark] & {
+          background-color: $table-background-color-dark;
+        }
+      }
+
+      > table {
+        width: 100%;
+        max-width: 100%;
+        margin: .625rem 0;
+        border-spacing: 0;
+        background: $table-background-color;
+        border-collapse: collapse;
+
+        [theme=dark] & {
+          background: $table-background-color-dark;
+        }
+
+        thead {
+          background: $table-thead-color;
+
+          [theme=dark] & {
+            background-color: $table-thead-color-dark;
+          }
+        }
+
+        th, td {
+          padding: .3rem 1rem;
+          border: 1px solid darken($table-thead-color, 2%);
+
+          [theme=dark] & {
+            border-color: darken($table-thead-color-dark, 2%);
+          }
+        }
+      }
+    }
+
+    img {
+      max-width: 100%;
+      min-height: 1em;
+    }
+
+    figure {
+      margin: .5rem;
+      text-align: center;
+
+      .image-caption:not(:empty) {
+        min-width: 20%;
+        max-width: 80%;
+        display: inline-block;
+        padding: .5rem;
+        margin: 0 auto;
+        font-size: .875rem;
+        color: #969696;
+      }
+
+      img {
+        display: block;
+        height: auto;
+        margin: 0 auto;
+        overflow: hidden;
+      }
+    }
+
+    .lazyloading {
+      @include object-fit(none);
+    }
+
+    blockquote {
+      display: block;
+      border-left: .5rem solid $blockquote-color;
+      background-color: rgba($blockquote-color, .2);
+      padding: .25rem .75rem;
+      margin: 1rem 0;
+
+      [theme=dark] & {
+        border-left-color: $blockquote-color-dark;
+        background-color: rgba($blockquote-color-dark, .2);
+      }
+    }
+
+    .footnotes {
+      color: $global-font-secondary-color;
+
+      [theme=dark] & {
+        color: $global-font-secondary-color-dark;
+      }
+
+      p {
+        margin: .25rem 0;
+      }
+    }
+
+    @import "../_partial/_single/code";
+    @import "../_partial/_single/instagram";
+    @import "../_partial/_single/admonition";
+    @import "../_partial/_single/echarts";
+    @import "../_partial/_single/mapbox";
+    @import "../_partial/_single/music";
+    @import "../_partial/_single/bilibili";
+
+    hr {
+      margin: 1rem 0;
+      position: relative;
+      border-top: 1px dashed $global-border-color;
+      border-bottom: none;
+
+      [theme=dark] & {
+        border-top: 1px dashed $global-border-color-dark;
+      }
+    }
+
+    kbd {
+      display: inline-block;
+      padding: .25rem;
+      background-color: $global-background-color;
+      border: 1px solid $global-border-color;
+      border-bottom-color: $global-border-color;
+      @include border-radius(3px);
+      @include box-shadow(inset 0 -1px 0 $global-border-color);
+      font-size: .8rem;
+      font-family: $code-font-family;
+      color: $code-color;
+
+      [theme=dark] & {
+        background-color: $global-background-color-dark;
+        border: 1px solid $global-border-color-dark;
+        border-bottom-color: $global-border-color-dark;
+        @include box-shadow(inset 0 -1px 0 $global-border-color-dark);
+        color: $code-color-dark;
+      }
+    }
+
+    .typeit {
+      .code {
+        padding: .375rem;
+        font-size: .875rem;
+        font-family: $code-font-family;
+        font-weight: bold;
+        word-break: break-all;
+      }
+    }
+
+    .version {
+      height: 1.25em;
+      vertical-align: text-bottom;
+    }
+  }
+
+  @import "../_partial/_single/footer";
+  @import "../_partial/_single/comment";
+}
+
+.lg-toolbar .lg-icon::after {
+  color: #999;
+}

themes/LoveIt/assets/css/_page/_special.scss

@@ -0,0 +1,5 @@
+.special {
+  .single-title, .single-subtitle {
+    text-align: right;
+  }
+}

themes/LoveIt/assets/css/_partial/_archive/_tags.scss

@@ -0,0 +1,27 @@
+.tag-cloud-tags {
+  margin: 10px 0;
+
+  @include link(true, true);
+
+  a {
+    display: inline-block;
+    position: relative;
+    margin: 5px 10px;
+    @include overflow-wrap(break-word);
+    @include transition(all ease-out 0.3s);
+
+    &:active,
+    &:focus,
+    &:hover {
+      @include transform(scale(1.2));
+    }
+
+    sup {
+      color: $global-font-secondary-color;
+
+      [theme=dark] & {
+        color: $global-font-secondary-color-dark;
+      }
+    }
+  }
+}

themes/LoveIt/assets/css/_partial/_archive/_terms.scss

@@ -0,0 +1,82 @@
+.categories-card {
+  margin: 0 auto;
+  margin-top: 3rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-direction: row;
+  flex-wrap: wrap;
+  line-height: 1.6rem;
+
+  .card-item {
+    font-size: .875rem;
+    text-align: left;
+    width: 45%;
+    display: flex;
+    align-items: flex-start;
+    margin-top: 2rem;
+    min-height: 10rem;
+    padding: 0 2%;
+    position: relative;
+
+    .card-item-wrapper {
+      width: 100%;
+      overflow: hidden;
+
+      .card-item-title {
+        font-size: 1.2rem;
+        font-weight: bold;
+        display: inline-block;
+        margin-top: 1rem;
+        margin-bottom: .75rem;
+      }
+
+      span {
+        float: right;
+        padding-right: 1rem;
+      }
+    }
+  }
+}
+
+.archive-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  box-sizing: border-box;
+  margin: .25rem 0 .25rem 1.5rem;
+}
+
+.archive-item-link {
+  min-width: 10%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+
+  &:hover {
+    color: $global-link-hover-color;
+    background-color: transparent;
+  }
+
+  [theme=dark] & {
+    color: $global-link-color-dark;
+
+    &:hover {
+      color: $global-link-hover-color-dark;
+    }
+  }
+}
+
+.archive-item-date {
+  width: 4em;
+  text-align: right;
+  color: $global-font-secondary-color;
+
+  [theme=dark] & {
+    color: $global-font-secondary-color-dark;
+  }
+}
+
+.more-post {
+  text-align: right;
+}

themes/LoveIt/assets/css/_partial/_cookieconsent.scss

@@ -0,0 +1,17 @@
+.cc-window.cc-banner {
+  .cc-btn {
+    color: $global-font-color;
+
+    &:hover, &:focus {
+      background-color: #ccc;
+    }
+
+    [theme=dark] & {
+      color: $global-font-color;
+
+      &:hover, &:focus {
+        background-color: #fff;
+      }
+    }
+  }
+}

themes/LoveIt/assets/css/_partial/_details.scss

@@ -0,0 +1,33 @@
+.details {
+  .details-summary {
+    &:hover {
+      cursor: pointer;
+    }
+  }
+
+  i.details-icon {
+    color: $global-font-secondary-color;
+    @include transition(transform 0.2s ease);
+
+    [theme=dark] & {
+      color: $global-font-secondary-color-dark;
+    }
+  }
+
+  .details-content {
+    max-height: 0;
+    overflow-y: hidden;
+    @include details-transition-open;
+  }
+
+  &.open {
+    i.details-icon {
+      @include transform(rotate(90deg));
+    }
+
+    .details-content {
+      max-height: $MAX_LENGTH;
+      @include details-transition-close;
+    }
+  }
+}

themes/LoveIt/assets/css/_partial/_fixed-button.scss

@@ -0,0 +1,46 @@
+#fixed-buttons {
+  display: none;
+}
+
+.fixed-button {
+  display: none;
+  z-index: 100;
+  position: fixed;
+  right: 1.5rem;
+  font-size: 1rem;
+  line-height: 1.3rem;
+  padding: .6rem .6rem;
+  color: $global-font-secondary-color;
+  background: $header-background-color;
+  @include border-radius(2rem);
+  @include transition(color 0.4s ease);
+
+  @include blur;
+
+  &:hover, &:active {
+    color: $global-font-color;
+    cursor: pointer;
+  }
+
+  &:active, &:focus, &:hover {
+    outline: none;
+  }
+
+  [theme=dark] & {
+    color: $global-font-secondary-color-dark;
+    background: $header-background-color-dark;
+
+    &:hover, &:active {
+      color: $global-font-color-dark;
+    }
+  }
+}
+
+#back-to-top {
+  display: block;
+  bottom: 1.5rem;
+}
+
+#view-comments {
+  bottom: 4.5rem;
+}

themes/LoveIt/assets/css/_partial/_footer.scss

@@ -0,0 +1,21 @@
+footer {
+  height: 2rem;
+  width: 100%;
+  text-align: center;
+  line-height: 1.25rem;
+  padding: 1rem 0;
+
+  .footer-container {
+    font-size: .875rem;
+
+    .footer-line {
+      width: 100%;
+
+      .icp-br {
+        display: none;
+      }
+    }
+  }
+
+  @include blur;
+}

themes/LoveIt/assets/css/_partial/_header.scss

@@ -0,0 +1,468 @@
+header {
+  width: 100%;
+  z-index: 150;
+  background-color: $header-background-color;
+  @include transition(box-shadow 0.3s ease);
+
+  [theme=dark] & {
+    background-color: $header-background-color-dark;
+  }
+
+  .logo {
+    min-height: 1.5em;
+    height: 1.5em;
+    vertical-align: text-bottom;
+  }
+
+  .logo, .header-title-pre {
+    padding-right: .25rem;
+  }
+
+  .header-title-post {
+    padding-left: .25rem;
+  }
+
+  &:hover {
+    @include box-shadow(0 0 1.5rem 0 rgba(0, 0, 0, .1));
+  }
+}
+
+.header-wrapper {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  box-sizing: border-box;
+  width: 100%;
+}
+
+.header-title {
+  font-family: $header-title-font-family;
+  font-weight: bold;
+  margin-right: .5rem;
+  min-width: 10%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  @include flex(10);
+}
+
+.menu .menu-item {
+  position: relative;
+}
+
+.language-select {
+  position: absolute;
+  opacity: 0;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+
+  &:hover {
+    cursor: pointer;
+  }
+}
+
+.search {
+  position: relative;
+
+  input {
+    color: transparent;
+    box-sizing: border-box;
+    height: 2.5rem;
+    width: 2.5rem;
+    @include border-radius(.5rem);
+    border: none;
+    outline: none;
+    background-color: $header-background-color;
+    vertical-align: baseline !important;
+    @include transition(width 0.3s ease);
+
+    [theme=dark] & {
+      background-color: $header-background-color-dark;
+    }
+  }
+
+  @include placeholder(transparent);
+
+  .search-button {
+    margin: 0;
+    position: absolute;
+    left: auto;
+    right: 1rem;
+  }
+
+  .search-toggle {
+    left: .5rem;
+    right: auto;
+  }
+
+  .search-loading {
+    display: none;
+  }
+
+  .search-clear {
+    display: none;
+  }
+
+  .open &, &.mobile {
+    input {
+      color: $global-font-color;
+      background-color: $search-background-color;
+      padding: 0 2rem 0 2rem;
+    }
+
+    [theme=dark] & {
+      input {
+        color: $global-font-color-dark;
+        background-color: $search-background-color-dark;
+      }
+
+      @include placeholder($global-font-secondary-color-dark);
+    }
+
+    @include placeholder($global-font-secondary-color);
+
+    .search-button {
+      color: $global-font-secondary-color;
+
+      [theme=dark] & {
+        color: $global-font-secondary-color-dark;
+      }
+    }
+
+    .search-clear:hover {
+      color: #ff6b6b;
+    }
+
+    .search-toggle:hover {
+      cursor: default;
+    }
+  }
+}
+
+.theme-switch i {
+  @include transform(rotate(225deg));
+}
+
+#header-desktop {
+  display: block;
+  position: fixed;
+  height: $header-height;
+  line-height: $header-height;
+
+  [header-desktop=normal] & {
+    position: static;
+  }
+
+  .header-wrapper {
+    padding: 0 2rem 0 10vh;
+
+    .header-title {
+      font-size: $header-title-font-size;
+    }
+
+    .menu {
+      overflow: hidden;
+      white-space: nowrap;
+
+      .menu-inner {
+        float: right;
+      }
+
+      .menu-item {
+        margin: 0 .5rem;
+
+        &.delimiter {
+          border-left: 1.5px solid $global-font-color;
+
+          [theme=dark] & {
+            border-left-color: $global-border-color-dark;
+          }
+        }
+
+        &.language {
+          margin-right: 0;
+        }
+
+        &.search {
+          margin: 0 -.5rem 0 0;
+        }
+      }
+
+      a.active {
+        font-weight: 900;
+        color: $header-hover-color;
+
+        [theme=dark] & {
+          color: $header-hover-color-dark;
+        }
+      }
+    }
+  }
+
+  &.open .header-wrapper .menu .menu-item.search {
+    margin: 0 .25rem 0 .5rem;
+
+    input {
+      width: 24rem;
+    }
+  }
+}
+
+#header-mobile {
+  display: none;
+  position: fixed;
+  height: $header-height;
+  line-height: $header-height;
+
+  [header-mobile=normal] & {
+    position: static;
+  }
+
+  .header-container {
+    padding: 0;
+    margin: 0;
+
+    .header-wrapper {
+      padding: 0 1rem;
+      font-size: 1.125rem;
+      @include transition(margin-top 0.3s ease);
+
+      .header-title {
+        font-size: $header-title-font-size;
+        max-width: 80%;
+      }
+
+      .menu-toggle {
+        line-height: 4rem;
+        cursor: pointer;
+        @include transition(width 0.3s ease);
+
+        span {
+          display: block;
+          background: $global-font-color;
+          width: 1.5rem;
+          height: 2px;
+          @include border-radius(3px);
+          @include transition(all 0.3s ease-in-out);
+
+          [theme=dark] & {
+            background: $global-font-color-dark;
+          }
+        }
+
+        span:nth-child(1) {
+          margin-bottom: .5rem;
+        }
+
+        span:nth-child(3) {
+          margin-top: .5rem;
+        }
+
+        &.active {
+          span:nth-child(1) {
+            @include transform(rotate(45deg) translate(.4rem, .5rem));
+          }
+
+          span:nth-child(2) {
+            opacity: 0
+          }
+
+          span:nth-child(3) {
+            @include transform(rotate(-45deg) translate(.4rem, -.5rem));
+          }
+        }
+      }
+    }
+
+    .menu {
+      text-align: center;
+      background: $header-background-color;
+      border-top: 2px solid $global-border-color;
+      display: none;
+      padding-top: .5rem;
+      @include box-shadow(0 .125rem .25rem rgba(0, 0, 0, .1));
+
+      .search-wrapper {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        box-sizing: border-box;
+        padding: ($header-height - 2.5rem) / 2 1rem;
+        line-height: 2.5rem;
+      }
+
+      .search {
+        flex-grow: 10;
+
+        .algolia-autocomplete, input {
+          width: 100%;
+        }
+      }
+
+      .search-button {
+        top: 0;
+      }
+
+      .search-cancel {
+        display: none;
+        margin-left: .75rem;
+      }
+
+      .menu-item {
+        display: block;
+        line-height: 2.5rem;
+      }
+
+      &.active {
+        display: block;
+      }
+
+      [theme=dark] & {
+        background: $header-background-color-dark;
+        border-top-color: $global-border-color-dark;
+      }
+    }
+  }
+
+  &.open {
+    .header-wrapper {
+      margin-top: -$header-height;
+    }
+
+    .menu {
+      padding-top: 0;
+      border-top: none;
+
+      .menu-item {
+        display: none;
+      }
+
+      .search-cancel {
+        display: inline;
+      }
+    }
+  }
+}
+
+.search-dropdown {
+  position: fixed;
+  z-index: 200;
+  top: $header-height;
+  @include box-shadow(0 .125rem .25rem rgba(0, 0, 0, .1));
+
+  &.desktop {
+    right: 2rem;
+    width: 30rem;
+  }
+
+  &.mobile {
+    right: 0;
+    width: 100%;
+  }
+
+  .dropdown-menu {
+    right: 0 !important;
+    background-color: $global-background-color;
+
+    [theme=dark] & {
+      background-color: $global-background-color-dark;
+    }
+
+    .suggestions {
+      overflow-y: auto;
+      max-height: calc(100vh - #{$header-height});
+
+      .suggestion {
+        padding: .75rem 1rem;
+
+        .suggestion-title {
+          display: inline-block;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          font-size: 1rem;
+          font-weight: bold;
+          max-width: 75%;
+        }
+
+        .suggestion-date {
+          font-size: .875rem;
+          float: right;
+          text-align: right;
+          color: $global-font-secondary-color;
+
+          [theme=dark] & {
+            color: $global-font-secondary-color-dark;
+          }
+        }
+
+        .suggestion-context {
+          line-height: 1.25rem;
+          @include box(vertical);
+          -webkit-line-clamp: 2;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          @include overflow-wrap(break-word);
+          color: $global-font-secondary-color;
+
+          [theme=dark] & {
+            color: $global-font-secondary-color-dark;
+          }
+        }
+
+        em {
+          font-style: normal;
+          background-color: $selection-color;
+
+          [theme=dark] & {
+            background-color: $selection-color-dark;
+          }
+        }
+
+        &.cursor {
+          background: darken($code-background-color, 5%);
+
+          [theme=dark] & {
+            background: lighten($code-background-color-dark, 5%);
+          }
+        }
+
+        &:hover {
+          cursor: pointer;
+        }
+      }
+    }
+
+    .search-empty {
+      padding: 1rem;
+      text-align: center;
+
+      .search-query {
+        font-weight: bold;
+
+        [theme=dark] & {
+          color: #ddd;
+        }
+      }
+    }
+
+    .search-footer {
+      padding: .5rem 1rem;
+      float: right;
+      font-size: .8rem;
+      color: $global-font-secondary-color;
+
+      [theme=dark] {
+        color: $global-font-secondary-color-dark;
+      }
+
+      @include link(false, false);
+
+      a {
+        font-size: 1rem;
+      }
+    }
+  }
+}

themes/LoveIt/assets/css/_partial/_icon.scss

@@ -0,0 +1,17 @@
+svg.icon {
+  display: inline-block;
+  width: 1.25em;
+  height: 1em;
+  text-align: center;
+
+  path {
+    fill: currentColor;
+  }
+}
+
+img.emoji {
+  height: 1em;
+  width: 1em;
+  margin: 0 .05em 0 .1em;
+  vertical-align: -.1em;
+}

themes/LoveIt/assets/css/_partial/_mask.scss

@@ -0,0 +1,16 @@
+#mask {
+  background-repeat: no-repeat;
+  background-position: center;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: -1;
+  background-color: rgba(0, 0, 0, 0);
+
+  .blur & {
+    z-index: 100;
+    background-color: rgba(0, 0, 0, .25);
+  }
+}

themes/LoveIt/assets/css/_partial/_pagination.scss

@@ -0,0 +1,91 @@
+.pagination {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  list-style: none;
+  white-space: nowrap;
+  width: 100%;
+  padding: 1rem 0 0;
+
+  a {
+    font-size: .8rem;
+    color: #bfbfbf;
+    letter-spacing: .1rem;
+    font-weight: 700;
+    padding: 5px 5px;
+    text-decoration: none;
+    @include transition(0.3s);
+  }
+
+  li {
+    padding-bottom: 3px;
+    margin: 0 20px;
+    box-sizing: border-box;
+    position: relative;
+    display: inline;
+
+    &.disabled {
+      display: none;
+    }
+
+    &:hover a {
+      color: $pagination-link-hover-color;
+    }
+
+    [theme=dark] &:hover a {
+      color: $pagination-link-hover-color-dark;
+    }
+
+    &:before,
+    &:after {
+      position: absolute;
+      content: "";
+      width: 0;
+      height: 3px;
+      background: $pagination-link-hover-color;
+      @include transition(0.3s);
+      bottom: 0px;
+    }
+
+    [theme=dark] &:before,
+    [theme=dark] &:after {
+      background: $pagination-link-hover-color-dark;
+    }
+
+    &:before .active,
+    &:after .active {
+      width: 100%;
+    }
+
+    &:before {
+      left: 50%;
+    }
+
+    &:after {
+      right: 50%;
+    }
+
+    &:hover {
+
+      &:before,
+      &:after {
+        width: 50%;
+      }
+    }
+
+    &.active {
+      a {
+        color: $pagination-link-hover-color;
+      }
+
+      [theme=dark] & a {
+        color: $pagination-link-hover-color-dark;
+      }
+
+      &:before,
+      &:after {
+        width: 60%;
+      }
+    }
+  }
+}

themes/LoveIt/assets/css/_partial/_single/_admonition.scss

@@ -0,0 +1,67 @@
+.admonition {
+  position: relative;
+  margin: 1rem 0;
+  padding: 0 .75rem;
+  background-color: map-get($admonition-background-color-map, 'note');
+  border-left: .25rem solid map-get($admonition-color-map, 'note');
+  overflow: auto;
+
+  .admonition-title {
+    font-weight: bold;
+    margin: 0 -0.75rem;
+    padding: .25rem 1.8rem;
+    border-bottom: 1px solid map-get($admonition-background-color-map, 'note');
+    background-color: opacify(map-get($admonition-background-color-map, 'note'), 0.15);
+  }
+
+  &.open .admonition-title {
+    background-color: map-get($admonition-background-color-map, 'note');
+  }
+
+  .admonition-content {
+    padding: .5rem 0;
+  }
+
+  i.icon {
+    font-size: 0.85rem;
+    color: map-get($admonition-color-map, 'note');
+    position: absolute;
+    top: .6rem;
+    left: .4rem;
+  }
+
+  i.details-icon {
+    position: absolute;
+    top: .6rem;
+    right: .3rem;
+  }
+
+  @each $type, $color in $admonition-color-map {
+    &.#{$type} {
+      border-left-color: $color;
+
+      i.icon {
+        color: $color;
+      }
+    }
+  }
+
+  @each $type, $color in $admonition-background-color-map {
+    &.#{$type} {
+      background-color: $color;
+
+      .admonition-title {
+        border-bottom-color: $color;
+        background-color: opacify($color, 0.15);
+      }
+
+      &.open .admonition-title {
+        background-color: $color;
+      }
+    }
+  }
+
+  &:last-child {
+    margin-bottom: .75rem;
+  }
+}

themes/LoveIt/assets/css/_partial/_single/_bilibili.scss

@@ -0,0 +1,16 @@
+.bilibili {
+  position: relative;
+  width: 100%;
+  height: 0;
+  padding-bottom: 75%;
+  margin: 3% auto;
+  text-align: center;
+
+  iframe {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    left: 0;
+    top: 0;
+  }
+}

themes/LoveIt/assets/css/_partial/_single/_code.scss

@@ -0,0 +1,385 @@
+code {
+  display:inline-block;
+  max-width: 100%;
+  padding: 0 .4rem;
+  @include overflow-wrap(break-word);
+  @include line-break(anywhere);
+  font-size: $code-font-size;
+  font-family: $code-font-family;
+  color: $code-color;
+
+  [theme=dark] & {
+    color: $code-color-dark;
+  }
+}
+
+pre {
+  margin: 0;
+  padding: .25rem 0 .25rem .5rem;
+  @include tab-size(4);
+
+  code {
+    padding: 0;
+  }
+
+  img {
+    min-height: 1em;
+    max-height: 1.2em;
+    vertical-align: text-bottom;
+  }
+}
+
+code, pre, .highlight table, .highlight tr, .highlight td {
+  background: $code-background-color;
+
+  [theme=dark] & {
+    background: $code-background-color-dark;
+  }
+}
+
+.highlight, .gist {
+  font-family: $code-font-family;
+  font-size: $code-font-size;
+
+  .table-wrapper {
+    > table,
+    > table thead,
+    > table tr,
+    > table td {
+      margin: 0;
+      padding: 0;
+      border: none !important;
+      white-space: nowrap;
+    }
+  }
+}
+
+.highlight {
+  line-height: 1.4em;
+  margin: .5rem 0;
+
+  > .chroma {
+    position: relative;
+
+    .code-header {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      box-sizing: border-box;
+      width: 100%;
+      font-family: $global-font-family;
+      font-weight: bold;
+      color: $code-info-color;
+      background: darken($code-background-color, 8%);
+
+      [theme=dark] & {
+        color: $code-info-color-dark;
+        background: darken($code-background-color-dark, 6%);
+      }
+
+      &:hover {
+        cursor: pointer;
+      }
+
+      .code-title {
+        width: 100%;
+        padding: .4rem;
+      }
+
+      .code-title::after {
+        padding-left: .2rem;
+        content: 'Code';
+      }
+
+      @each $type, $text in $code-type-map {
+        &.#{$type} .code-title::after {
+          content: $text;
+        }
+      }
+    }
+
+    .lntd:first-child {
+      min-width: 1.6rem;
+      text-align: right;
+    }
+
+    .lntd:last-child {
+      width: 100%;
+
+      pre {
+        @include max-content(min-width);
+      }
+    }
+
+    .ln {
+      padding-right: .75rem;
+    }
+
+    .hl {
+      display: block;
+      background-color: darken($code-background-color, 10%);
+
+      [theme=dark] & {
+        background-color: darken($code-background-color-dark, 5%);
+      }
+    }
+
+    .ln, .lnt {
+      color: $global-font-secondary-color;
+
+      [theme=dark] & {
+        color: $global-font-secondary-color-dark;
+      }
+    }
+
+    .arrow {
+      padding: 0 .2rem;
+      @include transition(transform 0.2s ease);
+    }
+
+    .ellipses {
+      padding: .4rem;
+    }
+
+    .copy {
+      display: none;
+      padding: .4rem;
+
+      &:hover {
+        cursor: pointer;
+        color: $global-link-hover-color;
+
+        [theme=dark] & {
+          color: $global-link-hover-color-dark;
+        }
+      }
+    }
+
+    .table-wrapper {
+      max-height: 0;
+      overflow-y: hidden;
+      @include details-transition-open;
+    }
+
+    &.open {
+      .code-header {
+        background: darken($code-background-color, 3%);
+
+        [theme=dark] & {
+          background: darken($code-background-color-dark, 3%);
+        }
+      }
+
+      .table-wrapper {
+        max-height: $MAX_LENGTH;
+        @include details-transition-close;
+      }
+
+      .arrow {
+        @include transform(rotate(90deg));
+      }
+
+      .ellipses {
+        display: none;
+      }
+
+      .copy {
+        display: inline;
+      }
+    }
+  }
+
+  /* Comment */  .c,
+  /* CommentHashbang */  .ch,
+  /* CommentMultiline */  .cm,
+  /* CommentSingle */  .c1,
+  /* CommentSpecial */  .cs,
+  /* CommentPreproc */  .cp,
+  /* CommentPreprocFile */  .cpf { font-style: italic }
+  /* GenericUnderline */  .gl { text-decoration: underline }
+
+  @each $class, $color in $code-highlight-color-map {
+    .#{$class} { color: $color; }
+  }
+
+  [theme=dark] & {
+    @each $class, $color in $code-highlight-color-map-dark {
+      .#{$class} { color: $color; }
+    }
+  }
+}
+
+.gist {
+  .gist-file, .gist-data, .gist-meta {
+    border: none;
+  }
+
+  .gist-meta {
+    padding: .4rem .8rem;
+    background-color: darken($code-background-color, 5%);
+
+    @include link(false, false);
+
+    [theme=dark] & {
+      background-color: darken($code-background-color-dark, 5%);
+    }
+  }
+
+  [theme=dark] & {
+    // imported from https://github.com/lonekorean/gist-syntax-themes/blob/master/stylesheets/one-dark.css
+    .highlight {
+      background: #141414;
+    }
+    .blob-num,
+    .blob-code-inner,
+    .highlight,
+    .pl-enm,
+    .pl-ko,
+    .pl-mo,
+    .pl-mp1 .pl-sf,
+    .pl-ms,
+    .pl-pdc1,
+    .pl-scp,
+    .pl-smc,
+    .pl-som,
+    .pl-va,
+    .pl-vpf,
+    .pl-vpu,
+    .pl-mdr {
+        color: #aab1bf;
+    }
+    .pl-mb,
+    .pl-pdb {
+        font-weight: 700;
+    }
+    .pl-c,
+    .pl-c span,
+    .pl-pdc {
+        color: #5b6270;
+        font-style: italic;
+    }
+    .pl-sr .pl-cce {
+        color: #56b5c2;
+        font-weight: 400;
+    }
+    .pl-ef,
+    .pl-en,
+    .pl-enf,
+    .pl-eoai,
+    .pl-kos,
+    .pl-mh .pl-pdh,
+    .pl-mr {
+        color: #61afef;
+    }
+    .pl-ens,
+    .pl-vi {
+        color: #be5046;
+    }
+    .pl-enti,
+    .pl-mai .pl-sf,
+    .pl-ml,
+    .pl-sf,
+    .pl-sr,
+    .pl-sr .pl-sra,
+    .pl-src,
+    .pl-st,
+    .pl-vo {
+        color: #56b5c2;
+    }
+    .pl-eoi,
+    .pl-mri,
+    .pl-pds,
+    .pl-pse .pl-s1,
+    .pl-s,
+    .pl-s1 {
+        color: #97c279;
+    }
+    .pl-k,
+    .pl-kolp,
+    .pl-mc,
+    .pl-pde {
+        color: #c578dd;
+    }
+    .pl-mi,
+    .pl-pdi {
+        color: #c578dd;
+        font-style: italic;
+    }
+    .pl-mp,
+    .pl-stp {
+        color: #818896;
+    }
+    .pl-mdh,
+    .pl-mdi,
+    .pl-mdr {
+        font-weight: 400;
+    }
+    .pl-mdht,
+    .pl-mi1 {
+        color: #97c279;
+        background: #020;
+    }
+    .pl-md,
+    .pl-mdhf {
+        color: #df6b75;
+        background: #200;
+    }
+    .pl-corl {
+        color: #df6b75;
+        text-decoration: underline;
+    }
+    .pl-ib {
+        background: #df6b75;
+    }
+    .pl-ii {
+        background: #e0c184;
+        color: #fff;
+    }
+    .pl-iu {
+        background: #e05151;
+    }
+    .pl-ms1 {
+        color: #aab1bf;
+        background: #373b41;
+    }
+    .pl-c1,
+    .pl-cn,
+    .pl-e,
+    .pl-eoa,
+    .pl-eoac,
+    .pl-eoac .pl-pde,
+    .pl-kou,
+    .pl-mm,
+    .pl-mp .pl-s3,
+    .pl-mq,
+    .pl-s3,
+    .pl-sok,
+    .pl-sv,
+    .pl-mb {
+        color: #d19965;
+    }
+    .pl-enc,
+    .pl-entc,
+    .pl-pse .pl-s2,
+    .pl-s2,
+    .pl-sc,
+    .pl-smp,
+    .pl-sr .pl-sre,
+    .pl-stj,
+    .pl-v,
+    .pl-pdb {
+        color: #e4bf7a;
+    }
+    .pl-ent,
+    .pl-entl,
+    .pl-entm,
+    .pl-mh,
+    .pl-pdv,
+    .pl-smi,
+    .pl-sol,
+    .pl-mdh,
+    .pl-mdi {
+        color: #df6b75;
+    }
+  }
+}

themes/LoveIt/assets/css/_partial/_single/_comment.scss

@@ -0,0 +1,3 @@
+#comments {
+  padding: 8rem 0 2rem;
+}

themes/LoveIt/assets/css/_partial/_single/_echarts.scss

@@ -0,0 +1,4 @@
+.echarts {
+  margin: .5rem 0;
+  text-align: center;
+}

themes/LoveIt/assets/css/_partial/_single/_footer.scss

@@ -0,0 +1,98 @@
+.post-footer {
+  margin-top: 3rem;
+
+  .post-info {
+    border-bottom: 1px solid $global-border-color;
+    padding: 1rem 0 0.3rem;
+
+    [theme=dark] & {
+      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;
+
+        [theme=dark] & {
+          color: $global-font-secondary-color-dark;
+        }
+
+        @include link(false, false);
+      }
+
+      .post-info-license {
+        font-size: 0.8em;
+        color: $global-font-secondary-color;
+
+        [theme=dark] & {
+          color: $global-font-secondary-color-dark;
+        }
+
+        @include link(false, false);
+      }
+
+      .post-info-md {
+        font-size: 0.8rem;
+        width: 8rem;
+
+        @include link(false, false);
+      }
+
+      .post-info-share {
+        a * {
+          vertical-align: text-bottom;
+        }
+      }
+    }
+  }
+
+  .post-info-more {
+    padding: 0.3rem 0 1rem;
+    display: flex;
+    justify-content: space-between;
+    font-size: 0.9rem;
+  }
+
+  .post-tags {
+    max-width: 65%;
+
+    * {
+      display: inline;
+    }
+  }
+
+  .post-nav {
+    &::before,
+    &::after {
+      content: ' ';
+      display: table;
+    }
+
+    & a.prev,
+    & a.next {
+      font-size: 1rem;
+      font-weight: 600;
+      @include transition(all 0.3s ease-out);
+    }
+
+    & a.prev {
+      float: left;
+    }
+
+    & a.prev:hover {
+      @include transform(translateX(-4px));
+    }
+
+    & a.next {
+      float: right;
+    }
+
+    & a.next:hover {
+      @include transform(translateX(4px));
+    }
+  }
+}

themes/LoveIt/assets/css/_partial/_single/_instagram.scss

@@ -0,0 +1,5 @@
+iframe.instagram-media {
+  [theme=dark] & {
+    border: none !important;
+  }
+}

themes/LoveIt/assets/css/_partial/_single/_mapbox.scss

@@ -0,0 +1,4 @@
+.mapbox {
+  margin: .5rem 0;
+  padding: .5rem 0;
+}

themes/LoveIt/assets/css/_partial/_single/_music.scss

@@ -0,0 +1,3 @@
+meting-js {
+  margin: .5rem 0;
+}

themes/LoveIt/assets/css/_partial/_single/_toc.scss

@@ -0,0 +1,157 @@
+.toc {
+  .toc-title {
+    font-size: $toc-title-font-size;
+    font-weight: bold;
+    text-transform: uppercase;
+  }
+
+  .toc-content {
+    font-size: $toc-content-font-size;
+
+    ul {
+      text-indent: -0.85rem;
+      padding-left: .8rem;
+      list-style: none;
+
+      a:first-child::before {
+        content: "|";
+        font-weight: bolder;
+        margin-right: .5rem;
+        color: $single-link-color;
+
+        [theme=dark] & {
+          color: $single-link-color-dark;
+        }
+      }
+
+      ul {
+        padding-left: 1.5rem;
+      }
+    }
+  }
+
+  ruby {
+    background: $code-background-color;
+
+    rt {
+      color: $global-font-secondary-color;
+    }
+
+    [theme=dark] & {
+      background: $code-background-color-dark;
+
+      rt {
+        color: $global-font-secondary-color-dark;
+      }
+    }
+  }
+}
+
+#toc-auto {
+  display: block;
+  position: absolute;
+  width: $MAX_LENGTH;
+  max-width: 0;
+  padding: 0 .8rem;
+  border-left: 4px solid $global-border-color;
+  @include overflow-wrap(break-word);
+  box-sizing: border-box;
+  top: 10rem;
+  left: 0;
+  visibility: hidden;
+
+  [header-desktop=normal] & {
+    top: 5rem;
+  }
+
+  @include blur;
+
+  [theme=dark] & {
+    border-left-color: $global-border-color-dark;
+  }
+
+  .toc-title {
+    margin: .8rem 0;
+  }
+
+  .toc-content {
+    &.always-active ul {
+      display: block;
+    }
+
+    > nav > ul {
+      margin: .625rem 0;
+    }
+
+    ul {
+      ul {
+        display: none;
+      }
+
+      .has-active > ul {
+        display: block;
+      }
+    }
+
+    a.active {
+      font-weight: bold;
+      color: $single-link-color;
+
+      [theme=dark] & {
+        color: $single-link-color-dark;
+      }
+
+      &::before {
+        color: $single-link-hover-color;
+
+        [theme=dark] & {
+          color: $single-link-hover-color-dark;
+        }
+      }
+    }
+  }
+}
+
+#toc-static {
+  display: none;
+  margin: .8rem 0;
+
+  &[kept=true] {
+    display: block;
+  }
+
+  .toc-title {
+    display: flex;
+    justify-content: space-between;
+    line-height: 2em;
+    padding: 0 .75rem;
+    background: darken($code-background-color, 6%);
+
+    [theme=dark] & {
+      background: darken($code-background-color-dark, 6%);
+    }
+  }
+
+  .toc-content {
+    background-color: $code-background-color;
+
+    > nav > ul {
+      margin: 0;
+      padding: .4rem 1rem .4rem 1.8rem;
+    }
+
+    [theme=dark] & {
+      background-color: $code-background-color-dark;
+    }
+  }
+
+  &.open {
+    .toc-title {
+      background: darken($code-background-color, 3%);
+
+      [theme=dark] & {
+        background: darken($code-background-color-dark, 3%);
+      }
+    }
+  }
+}

themes/LoveIt/assets/css/_variables.scss

@@ -0,0 +1,366 @@
+// ==============================
+// Variables
+// ==============================
+
+// ========== Global ========== //
+// Font and Line Height
+$global-font-family: system-ui, -apple-system, BlinkMacSystemFont, PingFang SC, Microsoft YaHei UI, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, Helvetica, Arial, sans-serif !default;
+$global-font-size: 16px;
+$global-font-weight: 400;
+$global-line-height: 1.5rem;
+
+// Color of the background
+$global-background-color: #fff !default;
+$global-background-color-dark: #292a2d !default;
+
+// Color of the text
+$global-font-color: #161209 !default;
+$global-font-color-dark: #a9a9b3 !default;
+
+// Color of the secondary text
+$global-font-secondary-color: #a9a9b3 !default;
+$global-font-secondary-color-dark: #5d5d5f !default;
+
+// Color of the link
+$global-link-color: #161209 !default;
+$global-link-color-dark: #a9a9b3 !default;
+
+// Color of the hover link
+$global-link-hover-color: #2d96bd !default;
+$global-link-hover-color-dark: #fff !default;
+
+// Color of the border
+$global-border-color: #f0f0f0 !default;
+$global-border-color-dark: #363636 !default;
+// ========== Global ========== //
+
+// ========== Scrollbar ========== //
+// Color of the scrollbar
+$scrollbar-color: #87878d !default;
+
+// Color of the hover scrollbar
+$scrollbar-hover-color: #a9a9b3 !default;
+// ========== Scrollbar ========== //
+
+// ========== Selection ========== //
+// Color of the selected text
+$selection-color: rgba(53, 166, 247, 0.25) !default;
+$selection-color-dark: rgba(50, 112, 194, 0.4) !default;
+// ========== Selection ========== //
+
+// ========== Header ========== //
+// Height of the header
+$header-height: 3.5rem !default;
+
+// Color of the header background
+$header-background-color: #f8f8f8 !default;
+$header-background-color-dark: #252627 !default;
+
+// Font style of the header title
+$header-title-font-family: $global-font-family !default;
+$header-title-font-size: 1.5rem !default;
+
+// Color of the hover header item
+$header-hover-color: #161209 !default;
+$header-hover-color-dark: #fff !default;
+
+// Color of the search background
+$search-background-color: #e9e9e9 !default;
+$search-background-color-dark: #363636 !default;
+// ========== Header ========== //
+
+// ========== Single Content ========== //
+// Font size of the TOC
+$toc-title-font-size: 1.2rem !default;
+$toc-content-font-size: 1rem !default;
+
+// Color of the single link
+$single-link-color: #2d96bd !default;
+$single-link-color-dark: #55bde2 !default;
+
+// Color of the hover single link
+$single-link-hover-color: #ef3982 !default;
+$single-link-hover-color-dark: #bdebfc !default;
+
+// Color of the table background
+$table-background-color: #fff !default;
+$table-background-color-dark: #272c34 !default;
+
+// Color of the table thead
+$table-thead-color: #ededed !default;
+$table-thead-color-dark: #20252b !default;
+
+// Color of the blockquote
+$blockquote-color: #6bd6fd !default;
+$blockquote-color-dark: #59c5ec !default;
+// ========== Single Content ========== //
+
+// ========== Pagination ========== //
+// Color of the link in pagination
+$pagination-link-color: #2d96bd !default;
+$pagination-link-color-dark: #a9a9b3 !default;
+
+// Color of the hover link in pagination
+$pagination-link-hover-color: #000 !default;
+$pagination-link-hover-color-dark: #fff !default;
+// ========== Pagination ========== //
+
+// ========== Code ========== //
+// Color of the code
+$code-color: #E74C3C !default;
+$code-color-dark: #E5BF78 !default;
+
+// Color of the code background
+$code-background-color: #f5f5f5 !default;
+$code-background-color-dark: #272C34 !default;
+
+$code-info-color: #9c9c9c !default;
+$code-info-color-dark: #b1b0b0 !default;
+
+// Font size of the code
+$code-font-size: .875rem !default;
+
+// Font family of the code
+$code-font-family: Source Code Pro, Menlo, Consolas, Monaco, monospace, $global-font-family !default;
+
+// Code type map
+$code-type-map: (
+  // Custom code type
+  language-bash: 'Bash',
+  language-c: 'C',
+  language-cs: 'C#',
+  language-cpp: 'C++',
+  language-clojure: 'Clojure',
+  language-coffeescript: 'CoffeeScript',
+  language-css: 'CSS',
+  language-dart: 'Dart',
+  language-diff: 'Diff',
+  language-erlang: 'Erlang',
+  language-go: 'Go',
+  language-go-html-template: 'Go HTML Template',
+  language-groovy: 'Groovy',
+  language-haskell: 'Haskell',
+  language-html: 'HTML',
+  language-http: 'HTTP',
+  language-xml: 'XML',
+  language-java: 'Java',
+  language-js: 'JavaScript',
+  language-javascript: 'JavaScript',
+  language-json: 'JSON',
+  language-kotlin: 'Kotlin',
+  language-latex: 'LaTeX',
+  language-less: 'Less',
+  language-lisp: 'Lisp',
+  language-lua: 'Lua',
+  language-makefile: 'Makefile',
+  language-markdown: 'Markdown',
+  language-matlab: 'Matlab',
+  language-objectivec: 'Objective-C',
+  language-php: 'PHP',
+  language-perl: 'Perl',
+  language-python: 'Python',
+  language-r: 'R',
+  language-ruby: 'Ruby',
+  language-rust: 'Rust',
+  language-scala: 'Scala',
+  language-scss: 'Scss',
+  language-shell: 'Shell',
+  language-sql: 'SQL',
+  language-swift: 'Swift',
+  language-tex: 'TeX',
+  language-toml: 'TOML',
+  language-ts: 'TypeScript',
+  language-typescript: 'TypeScript',
+  language-vue: 'Vue',
+  language-yml: 'YAML',
+  language-yaml: 'YAML',
+) !default;
+
+// Color map of the code highlight
+$code-highlight-color-map: (
+  /* Parentheses */ 'p': #a9a9b3,
+  /* Keyword */ 'k': #b501a9,
+  /* KeywordConstant */ 'kc': #b501a9,
+  /* KeywordDeclaration */ 'kd': #b501a9,
+  /* KeywordNamespace */ 'kn': #b501a9,
+  /* KeywordPseudo */ 'kp': #b501a9,
+  /* KeywordReserved */ 'kr': #b501a9,
+  /* KeywordType */ 'kt': #b501a9,
+  /* Name */ 'n': #333333,
+  /* NameAttribute */ 'na': #2b77fa,
+  /* NameBuiltin */ 'nb': #f74840,
+  /* NameBuiltinPseudo */ 'bp': #f74840,
+  /* NameClass */ 'nc': #cb8100,
+  /* NameConstant */ 'no': #2b77fa,
+  /* NameDecorator */ 'nd': #0086c1,
+  /* NameEntity */ 'ni': #2b77fa,
+  /* NameException */ 'ne': #2b77fa,
+  /* NameFunction */ 'nf': #2b77fa,
+  /* NameFunctionMagic */ 'fm': #1ccad6,
+  /* NameLabel */ 'nl': #2b77fa,
+  /* NameNamespace */ 'nn': #2b77fa,
+  /* NameOther */ 'nx': #333333,
+  /* NameProperty */ 'py': #2b77fa,
+  /* NameTag */ 'nt': #2b77fa,
+  /* NameVariable */ 'nv': #2b77fa,
+  /* NameVariableClass */ 'vc': #2b77fa,
+  /* NameVariableGlobal */ 'vg': #2b77fa,
+  /* NameVariableInstance */ 'vi': #2b77fa,
+  /* NameVariableMagic */ 'vm': #2b77fa,
+  /* Literal */ 'l': #2aa198,
+  /* LiteralDate */ 'ld': #2aa198,
+  /* LiteralString */ 's': #24a443,
+  /* LiteralStringAffix */ 'sa': #24a443,
+  /* LiteralStringBacktick */ 'sb': #24a443,
+  /* LiteralStringChar */ 'sc': #24a443,
+  /* LiteralStringDelimiter */ 'dl': #24a443,
+  /* LiteralStringDoc */ 'sd': #24a443,
+  /* LiteralStringDouble */ 's2': #24a443,
+  /* LiteralStringEscape */ 'se': #24a443,
+  /* LiteralStringHeredoc */ 'sh': #24a443,
+  /* LiteralStringInterpol */ 'si': #24a443,
+  /* LiteralStringOther */ 'sx': #24a443,
+  /* LiteralStringRegex */ 'sr': #24a443,
+  /* LiteralStringSingle */ 's1': #24a443,
+  /* LiteralStringSymbol */ 'ss': #24a443,
+  /* LiteralNumber */ 'm': #e2893c,
+  /* LiteralNumberBin */ 'mb': #e2893c,
+  /* LiteralNumberFloat */ 'mf': #e2893c,
+  /* LiteralNumberHex */ 'mh': #e2893c,
+  /* LiteralNumberInteger */ 'mi': #e2893c,
+  /* LiteralNumberIntegerLong */ 'il': #e2893c,
+  /* LiteralNumberOct */ 'mo': #e2893c,
+  /* Operator */ 'o': #f19b04,
+  /* OperatorWord */ 'ow': #b501a9,
+  /* Comment */ 'c': #a0a1a8,
+  /* CommentHashbang */ 'ch': #a0a1a8,
+  /* CommentMultiline */ 'cm': #a0a1a8,
+  /* CommentSingle */ 'c1': #a0a1a8,
+  /* CommentSpecial */ 'cs': #a0a1a8,
+  /* CommentPreproc */ 'cp': #a0a1a8,
+  /* CommentPreprocFile */ 'cpf': #a0a1a8,
+  /* Generic */ 'g': #e72d40,
+  /* GenericDeleted */ 'gd': #e72d40,
+  /* GenericEmph */ 'ge': #e72d40,
+  /* GenericError */ 'gr': #e72d40,
+  /* GenericHeading */ 'gh': #e72d40,
+  /* GenericInserted */ 'gi': #e72d40,
+  /* GenericOutput */ 'go': #e72d40,
+  /* GenericPrompt */ 'gp': #e72d40,
+  /* GenericStrong */ 'gs': #e72d40,
+  /* GenericSubheading */ 'gu': #e72d40,
+  /* GenericTraceback */ 'gt': #e72d40,
+  /* TextWhitespace */ 'w': #bbbbbb,
+) !default;
+$code-highlight-color-map-dark: (
+  /* Parentheses */ 'p': #a9a9b3,
+  /* Keyword */ 'k': #d371e3,
+  /* KeywordConstant */ 'kc': #d371e3,
+  /* KeywordDeclaration */ 'kd': #d371e3,
+  /* KeywordNamespace */ 'kn': #d371e3,
+  /* KeywordPseudo */ 'kp': #d371e3,
+  /* KeywordReserved */ 'kr': #d371e3,
+  /* KeywordType */ 'kt': #d371e3,
+  /* Name */ 'n': #a9b2c0,
+  /* NameAttribute */ 'na': #41b0f5,
+  /* NameBuiltin */ 'nb': #19b9c4,
+  /* NameBuiltinPseudo */ 'bp': #ecbf6f,
+  /* NameClass */ 'nc': #ecbf6f,
+  /* NameConstant */ 'no': #41b0f5,
+  /* NameDecorator */ 'nd': #ecbf6f,
+  /* NameEntity */ 'ni': #41b0f5,
+  /* NameException */ 'ne': #41b0f5,
+  /* NameFunction */ 'nf': #41b0f5,
+  /* NameFunctionMagic */ 'fm': #19b9c4,
+  /* NameLabel */ 'nl': #41b0f5,
+  /* NameNamespace */ 'nn': #41b0f5,
+  /* NameOther */ 'nx': #a9a9b3,
+  /* NameProperty */ 'py': #41b0f5,
+  /* NameTag */ 'nt': #41b0f5,
+  /* NameVariable */ 'nv': #41b0f5,
+  /* NameVariableClass */ 'vc': #41b0f5,
+  /* NameVariableGlobal */ 'vg': #41b0f5,
+  /* NameVariableInstance */ 'vi': #41b0f5,
+  /* NameVariableMagic */ 'vm': #41b0f5,
+  /* Literal */ 'l': #2aa198,
+  /* LiteralDate */ 'ld': #2aa198,
+  /* LiteralString */ 's': #8cc570,
+  /* LiteralStringAffix */ 'sa': #8cc570,
+  /* LiteralStringBacktick */ 'sb': #8cc570,
+  /* LiteralStringChar */ 'sc': #8cc570,
+  /* LiteralStringDelimiter */ 'dl': #8cc570,
+  /* LiteralStringDoc */ 'sd': #8cc570,
+  /* LiteralStringDouble */ 's2': #8cc570,
+  /* LiteralStringEscape */ 'se': #8cc570,
+  /* LiteralStringHeredoc */ 'sh': #8cc570,
+  /* LiteralStringInterpol */ 'si': #8cc570,
+  /* LiteralStringOther */ 'sx': #8cc570,
+  /* LiteralStringRegex */ 'sr': #8cc570,
+  /* LiteralStringSingle */ 's1': #8cc570,
+  /* LiteralStringSymbol */ 'ss': #8cc570,
+  /* LiteralNumber */ 'm': #db985c,
+  /* LiteralNumberBin */ 'mb': #db985c,
+  /* LiteralNumberFloat */ 'mf': #db985c,
+  /* LiteralNumberHex */ 'mh': #db985c,
+  /* LiteralNumberInteger */ 'mi': #db985c,
+  /* LiteralNumberIntegerLong */ 'il': #db985c,
+  /* LiteralNumberOct */ 'mo': #db985c,
+  /* Operator */ 'o': #ecbf6f,
+  /* OperatorWord */ 'ow': #d371e3,
+  /* Comment */ 'c': #7e848f,
+  /* CommentHashbang */ 'ch': #7e848f,
+  /* CommentMultiline */ 'cm': #7e848f,
+  /* CommentSingle */ 'c1': #7e848f,
+  /* CommentSpecial */ 'cs': #7e848f,
+  /* CommentPreproc */ 'cp': #7e848f,
+  /* CommentPreprocFile */ 'cpf': #7e848f,
+  /* Generic */ 'g': #f16372,
+  /* GenericDeleted */ 'gd': #f16372,
+  /* GenericEmph */ 'ge': #f16372,
+  /* GenericError */ 'gr': #f16372,
+  /* GenericHeading */ 'gh': #f16372,
+  /* GenericInserted */ 'gi': #f16372,
+  /* GenericOutput */ 'go': #f16372,
+  /* GenericPrompt */ 'gp': #f16372,
+  /* GenericStrong */ 'gs': #f16372,
+  /* GenericSubheading */ 'gu': #f16372,
+  /* GenericTraceback */ 'gt': #f16372,
+  /* TextWhitespace */ 'w': #bbbbbb,
+) !default;
+// ========== Code ========== //
+
+// ========== Admonition ========== //
+// Color map of the admonition
+$admonition-color-map: (
+  'note': #448aff,
+  'abstract': #00b0ff,
+  'info': #00b8d4,
+  'tip': #00bfa5,
+  'success': #00c853,
+  'question': #64dd17,
+  'warning': #ff9100,
+  'failure': #ff5252,
+  'danger': #ff1744,
+  'bug': #f50057,
+  'example': #651fff,
+  'quote': #9e9e9e,
+) !default;
+
+// Color map of the admonition background
+$admonition-background-color-map: (
+  'note': rgba(68, 138, 255, 0.1),
+  'abstract': rgba(0, 176, 255, 0.1),
+  'info': rgba(0, 184, 212, 0.1),
+  'tip': rgba(0, 191, 165, 0.1),
+  'success': rgba(0, 200, 83, 0.1),
+  'question': rgba(100, 221, 23, 0.1),
+  'warning': rgba(255, 145, 0, 0.1),
+  'failure': rgba(255, 82, 82, 0.1),
+  'danger': rgba(255, 23, 68, 0.1),
+  'bug': rgba(245, 0, 87, 0.1),
+  'example': rgba(101, 31, 255, 0.1),
+  'quote': rgba(159, 159, 159, 0.1),
+) !default;
+// ========== Admonition ========== //
+
+$MAX_LENGTH: 12000px;

themes/LoveIt/assets/css/style.scss

@@ -0,0 +1,19 @@
+@charset "utf-8";
+
+@import "_variables";
+@import "_override";
+
+@import "_mixin/index";
+
+@import "_core/base";
+@import "_core/layout";
+
+@import "_page/index";
+
+@import "_partial/header";
+@import "_partial/footer";
+@import "_partial/pagination";
+
+@import "_core/media";
+
+@import "_custom";