diff --git a/archetypes/default.md b/archetypes/default.md
index 1149abea..c6b1abf5 100644
--- a/archetypes/default.md
+++ b/archetypes/default.md
@@ -4,13 +4,19 @@ date: {{ .Date }}
lastmod: {{ .Date }}
draft: true
description: ""
+show_in_homepage: true
+show_description: false
+
tags: []
categories: []
featured_image: ""
+featured_image_preview: ""
comment: true
toc: false
autoCollapseToc: true
math: false
----
\ No newline at end of file
+---
+
+
\ No newline at end of file
diff --git a/assets/css/_custom.scss b/assets/css/_custom.scss
index 28ea62cc..b9dd5c07 100644
--- a/assets/css/_custom.scss
+++ b/assets/css/_custom.scss
@@ -8,4 +8,4 @@
text-align:center;
font-size: 30px;
line-height: 50px;
-}
+}
\ No newline at end of file
diff --git a/assets/css/_page/_home.scss b/assets/css/_page/_home.scss
index d2e9a409..378480bd 100644
--- a/assets/css/_page/_home.scss
+++ b/assets/css/_page/_home.scss
@@ -1,5 +1,4 @@
/** Home **/
-
.intro {
transform: translateY(25vh);
text-align: center;
@@ -55,4 +54,4 @@ h2.description {
i {
font-size: 1.4em;
}
-}
+}
\ No newline at end of file
diff --git a/assets/css/_page/_home_post.scss b/assets/css/_page/_home_post.scss
deleted file mode 100644
index 1e5243a9..00000000
--- a/assets/css/_page/_home_post.scss
+++ /dev/null
@@ -1,65 +0,0 @@
-.post-warp {
- .intro {
- transform: translateY(0);
- margin: 2em 0 5em 0;
-
- .avatar {
- img {
- width: 96px;
- }
- }
- }
-
- .post {
- margin-bottom: 4em;
- border-bottom: 1px dashed #ddd;
-
- .post-content {
- padding-top: .5em;
- }
-
- .post-footer {
- display: flex;
- justify-content: space-between;
- align-items: center;
-
- .post-meta {
- a {
- color: rgba(85, 85, 85, 0.52941) !important;
-
- .dark-theme & {
- color: $global-font-secondary-color-dark !important;
- }
-
- &:hover {
- color: $global-font-secondary-color !important;
-
- .dark-theme & {
- color: $global-font-secondary-color-dark !important;
- }
- }
- }
- }
-
- .post-tags {
- span {
- a {
- color: rgba(85, 85, 85, 0.52941) !important;
-
- .dark-theme & {
- color: $global-font-secondary-color-dark !important;
- }
-
- &:hover {
- color: $global-font-secondary-color !important;
-
- .dark-theme & {
- color: $global-font-secondary-color-dark !important;
- }
- }
- }
- }
- }
- }
- }
-}
diff --git a/assets/css/_page/_index.scss b/assets/css/_page/_index.scss
new file mode 100644
index 00000000..ddbeff00
--- /dev/null
+++ b/assets/css/_page/_index.scss
@@ -0,0 +1,22 @@
+@import "_home";
+
+.post-warp {
+ position: relative;
+ width: 100%;
+ max-width: 780px;
+ margin: 0 auto;
+ padding-top: 2rem;
+
+ @import "_post";
+ @import "_posts";
+}
+
+.archive {
+ .post-title {
+ text-align: right;
+ padding-bottom: 2em;
+ }
+
+ @import "_terms";
+ @import "_tags";
+}
\ No newline at end of file
diff --git a/assets/css/_page/_post.scss b/assets/css/_page/_post.scss
index c0947ad3..c278c2b8 100644
--- a/assets/css/_page/_post.scss
+++ b/assets/css/_page/_post.scss
@@ -1,372 +1,370 @@
/** Post **/
+.post-header {
+ .post-title {
+ margin: 0 !important;
+ font-size: 2em;
+ line-height: 1.5em;
+ }
+}
-.post-warp {
- position: relative;
- width: 100%;
- max-width: 780px;
- margin: 0 auto;
- padding-top: 2rem;
+.post-meta {
+ font-size: 14px;
+ color: rgba(85, 85, 85, 0.52941) !important;
- .post-header {
- .post-title {
- margin: 0 !important;
- font-size: 2em;
- line-height: 1.5em;
- }
+ span {
+ display: inline-block;
}
- .post-meta {
- font-size: 14px;
- color: rgba(85, 85, 85, 0.52941) !important;
+ .dark-theme & {
+ color: $global-font-secondary-color-dark !important;
+ }
- span {
- display: inline-block;
- }
+ a {
+ color: $post-link-color;
.dark-theme & {
- color: $global-font-secondary-color-dark !important;
+ color: $post-link-color-dark;
}
- a {
- 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-toc {
- position: absolute;
- width: 200px;
- max-width: 240px;
- margin-left: 800px;
- padding: 10px;
- border-left: 1px solid $global-border-color;
- word-wrap: break-word;
- box-sizing: border-box;
- top: 120px;
-
- .post-toc-title {
- font-weight: 400;
- text-transform: uppercase;
- }
-
- .post-toc-content {
- &.always-active ul {
- display: block;
- }
-
- >nav>ul {
- margin: 10px 0;
- }
-
- ul {
- padding-left: 10px;
- list-style: none;
-
- ul {
- padding-left: 20px;
- display: none;
- }
-
- .has-active > ul {
- display: block;
- }
- }
-
- .toc-link.active {
- color: $global-link-hover-color;
- }
- }
- }
-
- .post-content {
- h2,
- h3,
- h4,
- h5,
- h6 {
- padding-top: .8em;
- padding-bottom: .3em;
- }
-
- h2::before {
- content: "#";
- margin-right: 5px;
- color: $post-link-color;
-
- .dark-theme & {
- color: $post-link-color-dark;
- }
- }
-
- h3::before {
- content: "|";
- margin-right: 5px;
- color: $post-link-color;
-
- .dark-theme & {
- color: $post-link-color-dark;
- }
- }
-
- a {
- color: $post-link-color;
-
- .dark-theme & {
- color: $post-link-color-dark;
- }
- }
-
- a:hover {
+ &:hover {
color: $post-link-hover-color;
- .dark-theme &:hover {
+ .dark-theme & {
color: $post-link-hover-color-dark;
- font-weight: bold;
}
}
+ }
+
+ .author {
+ font-size: 1.2em;
+ }
+}
+
+.post-toc {
+ position: absolute;
+ width: 200px;
+ max-width: 240px;
+ margin-left: 800px;
+ padding: 10px;
+ border-left: 1px solid $global-border-color;
+ word-wrap: break-word;
+ box-sizing: border-box;
+ top: 120px;
+
+ .post-toc-title {
+ font-weight: 400;
+ text-transform: uppercase;
+ }
+
+ .post-toc-content {
+ &.always-active ul {
+ display: block;
+ }
+
+ >nav>ul {
+ margin: 10px 0;
+ }
ul {
- padding-left: 2em;
- }
+ padding-left: 10px;
+ list-style: none;
- .table-wrapper {
- overflow-x: auto;
-
- > table {
- width: 100%;
- max-width: 100%;
- margin: 10px 0;
- border-spacing: 0;
- box-shadow: 2px 2px 3px rgba(0,0,0,.125);
- background: $table-background-color;
-
- .dark-theme & {
- background: $table-background-color-dark;
- }
-
- thead {
- background: $table-thead-color;
-
- .dark-theme & {
- background-color: $table-thead-color-dark;
- }
- }
-
- th, td {
- padding: 5px 15px;
- border: 1px double $global-border-color;
-
- .dark-theme & {
- border: 1px double $global-border-color-dark;
- }
- }
+ ul {
+ padding-left: 20px;
+ display: none;
}
- }
- figure {
- text-align: center;
- }
-
- .image-caption:not(:empty) {
- min-width: 20%;
- max-width: 80%;
- display: inline-block;
- padding: 10px;
- margin: 0 auto;
- border-bottom: 1px solid #d9d9d9;
- font-size: 14px;
- color: #969696;
- line-height: 1.7;
- }
-
- img {
- display: block;
- max-width: 80%;
- height: auto;
- margin: 0 auto;
- overflow: hidden;
- }
-
- .featured_image {
- width: 100% !important;
- max-width: 100% !important;
- height: auto !important;
- margin: 0 !important;
- }
-
- blockquote {
- font-size: 1rem;
- display: block;
- border-width: 1px 0;
- border-style: solid;
- border-color: $global-border-color;
- padding: 1.5em 1.2em 0.5em 1.2em;
- margin: 0 0 2em 0;
- position: relative;
-
- &:before {
- content: '\201C';
- position: absolute;
- top: 0em;
- left: 50%;
- transform: translate(-50%, -50%);
- width: 3rem;
- height: 2rem;
- font: 6em/1.08em 'PT Sans', sans-serif;
- color: $post-link-color;
- text-align: center;
-
- .dark-theme & {
- color: $post-link-color-dark;
- }
- }
- &:after {
- content: "#blockquote" attr(cite);
+ .has-active > ul {
display: block;
- text-align: right;
- font-size: 0.875em;
- color: $post-link-color;
+ }
+ }
+
+ .toc-link.active {
+ color: $global-link-hover-color;
+ }
+ }
+}
+
+.featured_image {
+ display: block;
+ max-width: 100%;
+ height: auto;
+ margin: 0 auto;
+ overflow: hidden;
+}
+
+.post-content {
+ h2,
+ h3,
+ h4,
+ h5,
+ h6 {
+ padding-top: .8em;
+ padding-bottom: .3em;
+ }
+
+ h2::before {
+ content: "#";
+ margin-right: 5px;
+ color: $post-link-color;
+
+ .dark-theme & {
+ color: $post-link-color-dark;
+ }
+ }
+
+ h3::before {
+ content: "|";
+ margin-right: 5px;
+ color: $post-link-color;
+
+ .dark-theme & {
+ color: $post-link-color-dark;
+ }
+ }
+
+ a {
+ color: $post-link-color;
+
+ .dark-theme & {
+ color: $post-link-color-dark;
+ }
+ }
+
+ a:hover {
+ color: $post-link-hover-color;
+
+ .dark-theme &:hover {
+ color: $post-link-hover-color-dark;
+ font-weight: bold;
+ }
+ }
+
+ ul {
+ padding-left: 2em;
+ }
+
+ .table-wrapper {
+ overflow-x: auto;
+
+ > table {
+ width: 100%;
+ max-width: 100%;
+ margin: 10px 0;
+ border-spacing: 0;
+ box-shadow: 2px 2px 3px rgba(0,0,0,.125);
+ background: $table-background-color;
+
+ .dark-theme & {
+ background: $table-background-color-dark;
+ }
+
+ thead {
+ background: $table-thead-color;
.dark-theme & {
- color: $post-link-color-dark;
+ background-color: $table-thead-color-dark;
}
}
- .dark-theme & {
- border-color: $global-border-color-dark;
+ th, td {
+ padding: 5px 15px;
+ border: 1px double $global-border-color;
+
+ .dark-theme & {
+ border: 1px double $global-border-color-dark;
+ }
}
}
+ }
- @import "../_partial/_post/code";
- @import "../_partial/_post/admonition";
+ figure {
+ text-align: center;
+ }
- .mermaid {
- @import "../_mermaid/neutral/index";
+ .image-caption:not(:empty) {
+ min-width: 20%;
+ max-width: 80%;
+ display: inline-block;
+ padding: 10px;
+ margin: 0 auto;
+ border-bottom: 1px solid #d9d9d9;
+ font-size: 14px;
+ color: #969696;
+ line-height: 1.7;
+ }
- .dark-theme & {
- @import "../_mermaid/dark/index";
- }
- }
+ img {
+ display: block;
+ max-width: 100%;
+ height: auto;
+ margin: 0 auto;
+ overflow: hidden;
+ }
- .echarts {
- margin: 3% auto;
+ blockquote {
+ font-size: 1rem;
+ display: block;
+ border-width: 1px 0;
+ border-style: solid;
+ border-color: $global-border-color;
+ padding: 1.5em 1.2em 0.5em 1.2em;
+ margin: 0 0 2em 0;
+ position: relative;
+
+ &:before {
+ content: '\201C';
+ position: absolute;
+ top: 0em;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ width: 3rem;
+ height: 2rem;
+ font: 6em/1.08em 'PT Sans', sans-serif;
+ color: $post-link-color;
text-align: center;
+
+ .dark-theme & {
+ color: $post-link-color-dark;
+ }
+ }
+ &:after {
+ content: "#blockquote" attr(cite);
+ display: block;
+ text-align: right;
+ font-size: 0.875em;
+ color: $post-link-color;
+
+ .dark-theme & {
+ color: $post-link-color-dark;
+ }
}
- .bilibili {
- position: relative;
+ .dark-theme & {
+ border-color: $global-border-color-dark;
+ }
+ }
+
+ @import "../_partial/_post/code";
+ @import "../_partial/_post/admonition";
+
+ .mermaid {
+ @import "../_mermaid/neutral/index";
+
+ .dark-theme & {
+ @import "../_mermaid/dark/index";
+ }
+ }
+
+ .echarts {
+ margin: 3% auto;
+ text-align: center;
+ }
+
+ .bilibili {
+ position: relative;
+ width: 100%;
+ height: 0;
+ padding-bottom: 75%;
+ margin: 3% auto;
+
+ iframe {
+ position: absolute;
width: 100%;
- height: 0;
- padding-bottom: 75%;
- margin: 3% auto;
-
- iframe {
- position: absolute;
- width: 100%;
- height: 100%;
- left: 0;
- top: 0;
- }
- }
-
- hr {
- margin: 1rem 0;
- position: relative;
- border-top: 1px dashed $global-border-color;
- border-bottom: none;
-
- .dark-theme & {
- border-top: 1px dashed $global-border-color-dark;
- }
- }
-
- kbd {
- display: inline-block;
- padding: .25em;
- background-color: $global-background-color;
- border: 1px solid $global-border-color;
- border-bottom-color: $global-border-color;
- border-radius: 3px;
- -webkit-box-shadow: inset 0 -1px 0 $global-border-color;
- box-shadow: inset 0 -1px 0 $global-border-color;
- font-size: .8em;
- line-height: 1.25;
- font-family: $code-font-family;
- color: $code-color;
-
- .dark-theme & {
- background-color: $global-background-color-dark;
- border: 1px solid $global-border-color-dark;
- border-bottom-color: $global-border-color-dark;
- -webkit-box-shadow: inset 0 -1px 0 $global-border-color-dark;
- box-shadow: inset 0 -1px 0 $global-border-color-dark;
- color: $code-color-dark;
- }
- }
-
- .typeit {
- .code {
- padding: 6px;
- font-size: 14px;
- font-family: Consolas, Monaco, Menlo, Consolas, monospace;
- font-weight: bold;
- word-break: break-all;
-
- .k {
- color: #D371E3;
- }
-
- .kt {
- color: #D371E3;
- }
-
- .kc {
- color: #D371E3;
- }
-
- .o {
- color: #D371E3;
- }
-
- .nf {
- color: #F16473;
- }
-
- .na {
- color: #41B1F5;
- }
-
- .s {
- color: #8BC56F;
- }
-
- .n {
- color: #DB975C;
- }
-
- .c1 {
- color: #7E848F;
- }
- }
+ height: 100%;
+ left: 0;
+ top: 0;
}
}
- p {
- font-size: 1em;
- margin: .5em 0 .5em 0;
+ hr {
+ margin: 1rem 0;
+ position: relative;
+ border-top: 1px dashed $global-border-color;
+ border-bottom: none;
+
+ .dark-theme & {
+ border-top: 1px dashed $global-border-color-dark;
+ }
}
+ kbd {
+ display: inline-block;
+ padding: .25em;
+ background-color: $global-background-color;
+ border: 1px solid $global-border-color;
+ border-bottom-color: $global-border-color;
+ border-radius: 3px;
+ -webkit-box-shadow: inset 0 -1px 0 $global-border-color;
+ box-shadow: inset 0 -1px 0 $global-border-color;
+ font-size: .8em;
+ line-height: 1.25;
+ font-family: $code-font-family;
+ color: $code-color;
+
+ .dark-theme & {
+ background-color: $global-background-color-dark;
+ border: 1px solid $global-border-color-dark;
+ border-bottom-color: $global-border-color-dark;
+ -webkit-box-shadow: inset 0 -1px 0 $global-border-color-dark;
+ box-shadow: inset 0 -1px 0 $global-border-color-dark;
+ color: $code-color-dark;
+ }
+ }
+
+ .typeit {
+ .code {
+ padding: 6px;
+ font-size: 14px;
+ font-family: Consolas, Monaco, Menlo, Consolas, monospace;
+ font-weight: bold;
+ word-break: break-all;
+
+ .k {
+ color: #D371E3;
+ }
+
+ .kt {
+ color: #D371E3;
+ }
+
+ .kc {
+ color: #D371E3;
+ }
+
+ .o {
+ color: #D371E3;
+ }
+
+ .nf {
+ color: #F16473;
+ }
+
+ .na {
+ color: #41B1F5;
+ }
+
+ .s {
+ color: #8BC56F;
+ }
+
+ .n {
+ color: #DB975C;
+ }
+
+ .c1 {
+ color: #7E848F;
+ }
+ }
+ }
+}
+
+p {
+ font-size: 1em;
+ margin: .5em 0 .5em 0;
+}
+
+.post-footer {
.post-info {
margin-top: 3rem;
border-bottom: 1px solid $global-border-color;
@@ -419,28 +417,28 @@
transform: translateX(4px);
}
}
-
- .post-comment {
- padding: 3em 0;
- }
-
- .align-left {
- text-align: left;
- }
-
- .align-center {
- text-align: center;
- }
-
- .align-right {
- text-align: right;
- }
-
- .float-left {
- float: left;
- }
-
- .float-right {
- float: right;
- }
}
+
+.post-comment {
+ padding: 3em 0;
+}
+
+.align-left {
+ text-align: left;
+}
+
+.align-center {
+ text-align: center;
+}
+
+.align-right {
+ text-align: right;
+}
+
+.float-left {
+ float: left;
+}
+
+.float-right {
+ float: right;
+}
\ No newline at end of file
diff --git a/assets/css/_page/_posts.scss b/assets/css/_page/_posts.scss
new file mode 100644
index 00000000..77f1cfce
--- /dev/null
+++ b/assets/css/_page/_posts.scss
@@ -0,0 +1,128 @@
+.intro {
+ transform: translateY(0);
+ padding: 2em 0 2em 0;
+
+ .avatar {
+ img {
+ width: 96px;
+ }
+ }
+}
+
+.post {
+ padding-top: 0.8em;
+ padding-bottom: 0.8em;
+ color: $global-font-color;
+ border-top: 1px dashed $global-border-color;
+ border-bottom: 1px dashed $global-border-color;
+
+ .dark-theme & {
+ 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-bottom: 1em;
+
+ img {
+ position: absolute;
+ width: 100%; height: 100%;
+ left: 0; top: 0;
+ object-fit: cover;
+ }
+ }
+
+ .post-list-title {
+ font-size: 1.6em;
+ }
+
+ .post-meta {
+ font-size: 14px !important;
+ a {
+ color: $global-font-secondary-color !important;
+
+ .dark-theme & {
+ color: $global-font-secondary-color-dark !important;
+ }
+
+ &:hover {
+ color: $global-link-hover-color !important;
+
+ .dark-theme & {
+ color: $global-link-hover-color-dark !important;
+ }
+ }
+ }
+ }
+
+ .post-content {
+ padding-top: .2em;
+ font-size: 0.9em;
+ width: 100%;
+ max-height: 100px;
+ overflow: hidden;
+
+ h2,
+ h3,
+ h4,
+ h5,
+ h6 {
+ font-size: 1em;
+ line-height: 1em;
+ padding-top: .3em;
+ padding-bottom: .3em;
+ }
+
+ p {
+ margin: 0;
+ padding-top: .3em;
+ padding-bottom: .3em;
+ }
+ }
+
+ .post-footer {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-size: 14px !important;
+
+ a {
+ color: $post-link-color !important;
+
+ .dark-theme & {
+ color: $post-link-color-dark !important;
+ }
+
+ &:hover {
+ color: $post-link-hover-color !important;
+
+ .dark-theme & {
+ color: $post-link-hover-color-dark !important;
+ }
+ }
+ }
+
+ .post-tags {
+ padding: 0;
+
+ a {
+ color: $global-link-color !important;
+
+ .dark-theme & {
+ color: $global-link-color-dark !important;
+ }
+
+ &:hover {
+ color: $global-link-hover-color !important;
+
+ .dark-theme & {
+ color: $global-link-hover-color-dark !important;
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/assets/css/_page/_terms.scss b/assets/css/_page/_terms.scss
index 16bba2ac..3b48671a 100644
--- a/assets/css/_page/_terms.scss
+++ b/assets/css/_page/_terms.scss
@@ -1,76 +1,73 @@
-.post-warp {
+.archive-item {
+ margin-left: 2rem;
+}
- .archive-item {
- margin-left: 2rem;
- }
+.categories-card {
+ margin: 0 auto;
+ margin-top: 3em;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ flex-direction: row;
+ flex-wrap: wrap;
+ padding: 0 2.5em;
+ line-height: 1.6em;
- .categories-card {
- margin: 0 auto;
- margin-top: 3em;
+ .card-item {
+ font-size: 14px;
+ text-align: left;
+ width: 45%;
display: flex;
- align-items: center;
- justify-content: space-between;
- flex-direction: row;
- flex-wrap: wrap;
- padding: 0 2.5em;
- line-height: 1.6em;
+ align-items: flex-start;
+ margin-top: 2em;
+ min-height: 16em;
+ padding: 0 2%;
+ position: relative;
- .card-item {
- font-size: 14px;
- text-align: left;
- width: 45%;
- display: flex;
- align-items: flex-start;
- margin-top: 2em;
- min-height: 16em;
- padding: 0 2%;
- position: relative;
-
- .categories {
- overflow: hidden;
- }
+ .categories {
+ overflow: hidden;
}
}
+}
- .archive-item-link {
- display: inline-block;
+.archive-item-link {
+ display: inline-block;
+ text-decoration: none;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ max-width: 95%;
+
+ &:hover {
+ color: $global-link-hover-color;
+ background-color: transparent;
+ }
+
+ .dark-theme & {
+ color: $global-link-color-dark;
text-decoration: none;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- max-width: 95%;
+ transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease;
&:hover {
- color: $global-link-hover-color;
- background-color: transparent;
- }
-
- .dark-theme & {
- color: $global-link-color-dark;
+ color: $global-link-hover-color-dark;
text-decoration: none;
transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease;
-
- &:hover {
- color: $global-link-hover-color-dark;
- text-decoration: none;
- transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease;
- }
}
}
+}
- .archive-item-date {
- float: right;
- text-align: right;
- color: $global-font-secondary-color;
+.archive-item-date {
+ float: right;
+ text-align: right;
+ color: $global-font-secondary-color;
- .dark-theme & {
- color: $global-font-secondary-color-dark;
- }
+ .dark-theme & {
+ color: $global-font-secondary-color-dark;
}
+}
- .more-post {
- text-align: right;
- }
+.more-post {
+ text-align: right;
}
.categories {
@@ -82,4 +79,4 @@
float: right;
padding-right: 1em;
}
-}
+}
\ No newline at end of file
diff --git a/assets/css/_partial/_pagination.scss b/assets/css/_partial/_pagination.scss
index d1453d24..ae3d34c8 100644
--- a/assets/css/_partial/_pagination.scss
+++ b/assets/css/_partial/_pagination.scss
@@ -7,11 +7,11 @@
list-style: none;
white-space: nowrap;
width: 100%;
- padding-top: 2em;
+ padding-top: 1em;
a {
-webkit-font-smoothing: antialiased;
- font-size: 12px;
+ font-size: 0.8em;
color: #bfbfbf;
letter-spacing: 0.1em;
font-weight: 700;
diff --git a/assets/css/style.scss b/assets/css/style.scss
index 101b628f..8b89ae7c 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -5,11 +5,7 @@
@import "_core/base";
@import "_core/layout";
-@import "_page/home";
-@import "_page/home_post";
-@import "_page/post";
-@import "_page/tags";
-@import "_page/terms";
+@import "_page/index";
@import "_partial/navbar";
@import "_partial/footer";
diff --git a/assets/js/main.js b/assets/js/main.js
index 4cb10291..16397529 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -56,56 +56,64 @@ jQuery(function($) {
_Blog._initToc = function() {
const SPACING = 20;
const $toc = $('.post-toc');
+ const $footer = $('.post-footer');
if ($toc.length) {
- const startTop = $toc.css("top");
- const minScrollTop = $toc.offset().top - SPACING;
-
- const tocState = {
- start: {
- 'position': 'absolute',
- 'top': startTop,
- },
- process: {
- 'position': 'fixed',
- 'top': SPACING,
- },
- };
+ const minTop = $toc.position().top;
+ const mainTop = $('main').position().top;
+ const minScrollTop = minTop + mainTop - SPACING;
$(window).scroll(function() {
- const scrollTop = $(window).scrollTop();
+ const scrollTop = $(window).scrollTop();
+ const maxTop = $footer.position().top - $toc.height();
+ const maxScrollTop = maxTop + mainTop - SPACING;
- if (scrollTop < minScrollTop) {
- $toc.css(tocState.start);
- } else {
- $toc.css(tocState.process);
- }
+ const tocState = {
+ start: {
+ 'position': 'absolute',
+ 'top': minTop,
+ },
+ process: {
+ 'position': 'fixed',
+ 'top': SPACING,
+ },
+ end: {
+ 'position': 'absolute',
+ 'top': maxTop,
+ }
+ };
+
+ if (scrollTop < minScrollTop) {
+ $toc.css(tocState.start);
+ } else if (scrollTop > maxScrollTop) {
+ $toc.css(tocState.end);
+ } else {
+ $toc.css(tocState.process);
+ }
});
}
- const HEADERFIX = 30;
+ const HEADERFIX = 60;
const $toclink = $('.toc-link');
const $headerlink = $('.headerlink');
const $tocLinkLis = $('.post-toc-content li');
- const headerlinkTop = $.map($headerlink, function(link) {
- return $(link).offset().top;
- });
-
- const headerLinksOffsetForSearch = $.map(headerlinkTop, function(offset) {
- return offset - HEADERFIX;
- });
-
- const searchActiveTocIndex = function(array, target) {
- for (let i = 0; i < array.length - 1; i++) {
- if (target > array[i] && target <= array[i + 1]) return i;
- }
- if (target > array[array.length - 1]) return array.length - 1;
- return 0;
- };
-
const activeIndex = function() {
const scrollTop = $(window).scrollTop();
+ const headerlinkTop = $.map($headerlink, function(link) {
+ return $(link).offset().top;
+ });
+ const headerLinksOffsetForSearch = $.map(headerlinkTop, function(offset) {
+ return offset - HEADERFIX;
+ });
+ const searchActiveTocIndex = function(array, target) {
+ for (let i = 0; i < array.length - 1; i++) {
+ if (target > array[i] && target <= array[i + 1]) return i;
+ }
+ if (target > array[array.length - 1]) return array.length - 1;
+ return 0;
+ };
+
const activeTocIndex = searchActiveTocIndex(headerLinksOffsetForSearch, scrollTop);
$($toclink).removeClass('active');
@@ -182,7 +190,7 @@ jQuery(function($) {
_Blog.countdown = function() {
if (window.countdownMap) {
Object.keys(countdownMap).forEach(function(id) {
- $(id).countdown(countdownMap[id], {elapse: true})
+ $(`#${id}`).countdown(countdownMap[id], {elapse: true})
.on('update.countdown', function(event) {
var $this = $(this).html(event.strftime(''
+ '%D 天
'
@@ -226,9 +234,9 @@ jQuery(function($) {
_Blog.changeTitle();
_Blog.chroma();
_Blog.responsiveTable();
- _Blog.toc();
_Blog.echarts(isDark);
_Blog.countdown();
_Blog.typeit();
+ _Blog.toc();
});
});
diff --git a/i18n/en.toml b/i18n/en.toml
index 38bbc8ec..3c4db8fc 100644
--- a/i18n/en.toml
+++ b/i18n/en.toml
@@ -37,6 +37,9 @@ other = "Theme - "
[toc]
other = "Table of Contents"
+[publish]
+other = "published on"
+
[included]
other = "included in"
@@ -63,6 +66,9 @@ other = "Back"
[home]
other = "Home"
+
+[readmore]
+other = "Read More......"
# === posts/single.html ===
# === 404.html ===
diff --git a/i18n/zh.toml b/i18n/zh.toml
index 69da9e62..d3c9b7f6 100644
--- a/i18n/zh.toml
+++ b/i18n/zh.toml
@@ -37,6 +37,9 @@ other = "主题 - "
[toc]
other = "目录"
+[publish]
+other = "发布于"
+
[included]
other = "收录于"
@@ -63,6 +66,9 @@ other = "返回"
[home]
other = "主页"
+
+[readmore]
+other = "阅读全文......"
# === posts/single.html ===
# === 404.html ===
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index bdc7387e..bdbdc617 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -5,9 +5,6 @@