First draft
This commit is contained in:
parent
ff4a8ce413
commit
e8a8269c6c
GPG Key ID:
9F28CB1645C4BFB5
6
.gitmodules
vendored
Normal file
6
.gitmodules
vendored
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
[submodule "themes/JuiceBar"]
|
||||||
|
path = themes/JuiceBar
|
||||||
|
url = https://github.com/hotjuicew/hugo-JuiceBar.git
|
||||||
|
[submodule "themes/ananke"]
|
||||||
|
path = themes/ananke
|
||||||
|
url = https://github.com/theNewDynamic/gohugo-theme-ananke
|
||||||
6
archetypes/default.md
Normal file
6
archetypes/default.md
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
---
|
||||||
|
title: "{{ replace .Name "-" " " | title }}"
|
||||||
|
date: {{ .Date }}
|
||||||
|
categories: []
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
8
assets/scss/_about.scss
Normal file
8
assets/scss/_about.scss
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
.about-content {
|
||||||
|
font-size: 1rem;
|
||||||
|
margin: 2rem 0;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
13
assets/scss/_archive.scss
Normal file
13
assets/scss/_archive.scss
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
@import "variables";
|
||||||
|
.archive {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
line-height: 1.3em;
|
||||||
|
text-align: left;
|
||||||
|
color: #111;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .archive {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
9
assets/scss/_footer.scss
Normal file
9
assets/scss/_footer.scss
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
@import "variables";
|
||||||
|
.footer {
|
||||||
|
padding: 18px;
|
||||||
|
font-size: $font-size-content;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .footer {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
}
|
||||||
147
assets/scss/_header.scss
Normal file
147
assets/scss/_header.scss
Normal file
@ -0,0 +1,147 @@
|
|||||||
|
@import "variables";
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
height: 6vmin;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
height: 6vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-brand {
|
||||||
|
padding: 0px 15px;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
padding: 0;
|
||||||
|
height: 6vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo h1 {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Let the sun icon not be next to the top*/
|
||||||
|
.theme-toggle {
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-menu {
|
||||||
|
background-color: $main-light;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
|
||||||
|
}
|
||||||
|
.dark-mode .navbar-menu {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
height: 100%;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#fastSearch {
|
||||||
|
height: 60%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
#searchInput {
|
||||||
|
height: 100%;
|
||||||
|
flex-shrink: 0
|
||||||
|
}
|
||||||
|
|
||||||
|
#searchResults {
|
||||||
|
position: relative;
|
||||||
|
margin-top: 10px;
|
||||||
|
display: inline-block;
|
||||||
|
border-radius: 5px;
|
||||||
|
|
||||||
|
li {
|
||||||
|
background-color: $main-light;
|
||||||
|
padding-left: 1rem;
|
||||||
|
border-bottom: 1px solid $main-black;
|
||||||
|
border-left: 1px solid $main-black;
|
||||||
|
border-right: 1px solid $main-black;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: $main-grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
border-top: 1px solid $main-black;
|
||||||
|
border-top-left-radius: 5px;
|
||||||
|
border-top-right-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
border-bottom-left-radius: 5px;
|
||||||
|
border-bottom-right-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a .title {
|
||||||
|
text-decoration: none;
|
||||||
|
/*display: block;*/
|
||||||
|
font-size: $font-size-content;
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-item {
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.dark-mode {
|
||||||
|
.navbar.is-light {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
.navbar-menu{
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
.navbar-brand > .navbar-item {
|
||||||
|
color: $dark-font;
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-start > .navbar-item {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.dark-mode #searchResults li {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
border-bottom: 1px solid $dark-font;
|
||||||
|
border-left: 1px solid $dark-font;
|
||||||
|
border-right: 1px solid $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode #searchResults li:first-child {
|
||||||
|
border-top: 1px solid $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode #searchResults li:hover {
|
||||||
|
color: $dark-font;
|
||||||
|
background-color: $dark-background;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .navbar.is-light .navbar-burger {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
.dark-mode .navbar.is-light .navbar-brand > a.navbar-item:hover, .dark-mode .navbar.is-light .navbar-start > a.navbar-item:hover {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
94
assets/scss/_index.scss
Normal file
94
assets/scss/_index.scss
Normal file
@ -0,0 +1,94 @@
|
|||||||
|
@import "variables";
|
||||||
|
|
||||||
|
#home-box {
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
#home-title {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.description {
|
||||||
|
text-align: center;
|
||||||
|
font-size: $font-size-content;
|
||||||
|
}
|
||||||
|
|
||||||
|
.typewriter-effect {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
.text {
|
||||||
|
max-width: 0;
|
||||||
|
text-transform: capitalize;
|
||||||
|
animation: typing 3s steps(var(--characters)) infinite;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
content: " |";
|
||||||
|
animation: blink 1s infinite;
|
||||||
|
animation-timing-function: step-end;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//Override bulma's style
|
||||||
|
.avatar-container {
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
.author-avatar {
|
||||||
|
object-fit: cover;
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 10rem;
|
||||||
|
height: 10rem;
|
||||||
|
text-align: center;
|
||||||
|
margin: 2rem auto 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.social-icon {
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
|
||||||
|
span {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
svg {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/*Typewriter effect*/
|
||||||
|
@keyframes typing {
|
||||||
|
75%,
|
||||||
|
100% {
|
||||||
|
max-width: calc(var(--characters) * 1ch);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes blink {
|
||||||
|
0%,
|
||||||
|
75%,
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
25% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Rewrite some of bulma's styles */
|
||||||
|
.navbar.is-light .navbar-end .navbar-link.is-active,
|
||||||
|
.navbar.is-light .navbar-end .navbar-link:hover,
|
||||||
|
navbar .navbar.is-light .navbar-end > a.navbar-item.is-active,
|
||||||
|
.navbar.is-light .navbar-end > a.navbar-item:hover,
|
||||||
|
.navbar.is-light .navbar-start .navbar-link.is-active,
|
||||||
|
.navbar.is-light .navbar-start .navbar-link:hover,
|
||||||
|
.navbar.is-light .navbar-start > a.navbar-item.is-active,
|
||||||
|
.navbar.is-light .navbar-start > a.navbar-item:hover, .navbar.is-light .navbar-brand > a.navbar-item:hover {
|
||||||
|
background-color: $main-light;
|
||||||
|
color: $main-black;
|
||||||
|
}
|
||||||
289
assets/scss/_main.scss
Normal file
289
assets/scss/_main.scss
Normal file
@ -0,0 +1,289 @@
|
|||||||
|
@import "_variables";
|
||||||
|
/* sticky footer */
|
||||||
|
body {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
min-height: 100vh;
|
||||||
|
font-family: Ubuntu, Roboto, 'Open Sans', 'Microsoft YaHei', sans-serif;
|
||||||
|
font-size: $font-size-content;
|
||||||
|
}
|
||||||
|
.dark-mode {
|
||||||
|
color: $dark-font;
|
||||||
|
background-color: $dark-background;
|
||||||
|
}
|
||||||
|
.heading {
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
flex: 1;
|
||||||
|
flex-shrink: 0;
|
||||||
|
flex-basis: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
header,
|
||||||
|
footer {
|
||||||
|
flex-grow: 0;
|
||||||
|
flex-shrink: 0;
|
||||||
|
flex-basis: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .title {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode hr {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title.is-1 {
|
||||||
|
font-family: Inter, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
|
||||||
|
font-size: $font-size-article-title;
|
||||||
|
}
|
||||||
|
|
||||||
|
.max-800px {
|
||||||
|
max-width: 800px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
color: $main-black;
|
||||||
|
margin: 0 0.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .icon {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon:hover, .search-svg:hover {
|
||||||
|
color: $main-orange;
|
||||||
|
transform: scale(1.2);
|
||||||
|
transition: all 0.2s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.single-container,
|
||||||
|
.archive-container,
|
||||||
|
.each-category {
|
||||||
|
padding-left: 20vw;
|
||||||
|
padding-right: 20vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
input {
|
||||||
|
height: 100%;
|
||||||
|
width: 20vw;
|
||||||
|
align-self: center;
|
||||||
|
margin-right: 0.5rem;
|
||||||
|
border-radius: 24px;
|
||||||
|
padding-left: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
input:focus {
|
||||||
|
outline: none;
|
||||||
|
border: 2px solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
border: none;
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode button {
|
||||||
|
background-color: $dark-background;
|
||||||
|
color: $dark-font;
|
||||||
|
border-color: $dark-navbar;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: $main-black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode a {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
.dark-mode .content h1, .dark-mode .content h2, .dark-mode .content h3, .dark-mode .content h4, .dark-mode .content h5, .dark-mode .content h6 {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode code {
|
||||||
|
background-color: $dark-background;
|
||||||
|
}
|
||||||
|
.dark-mode .content blockquote {
|
||||||
|
color: $dark-font;
|
||||||
|
background-color: $dark-background;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode strong {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.dark-mode .content table thead td, .dark-mode .content table thead th {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .card {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.dark-mode .icon:hover {
|
||||||
|
color: $main-orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode pre {
|
||||||
|
color: #f8f8f2;
|
||||||
|
background-color: #272822;
|
||||||
|
-moz-tab-size: 4;
|
||||||
|
-o-tab-size: 4;
|
||||||
|
tab-size: 4;
|
||||||
|
}
|
||||||
|
.hover-underline-animation {
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
padding: 5px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
transform: scaleX(0);
|
||||||
|
height: 2px;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
background-color: $main-orange;
|
||||||
|
transform-origin: bottom right;
|
||||||
|
transition: transform 0.25s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover:after {
|
||||||
|
transform: scaleX(1);
|
||||||
|
transform-origin: bottom left;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.title,
|
||||||
|
.archive-title {
|
||||||
|
font-size: $font-size-archive-title;
|
||||||
|
margin-top: 2rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.archive-item {
|
||||||
|
margin: 5px 0 15px;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.archive-item-date {
|
||||||
|
color: $main-grey;
|
||||||
|
font-size: $font-size-content;
|
||||||
|
padding: 5px 0;
|
||||||
|
margin-top: 5px;
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
.archive-item-link {
|
||||||
|
display: inline-block;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: $font-size-content-larger;
|
||||||
|
color: #222;
|
||||||
|
padding: 5px 0;
|
||||||
|
transition: all 0.1s linear;
|
||||||
|
|
||||||
|
}
|
||||||
|
.pp-container{
|
||||||
|
margin-top: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
html {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content h1 {
|
||||||
|
font-size: 27px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title.is-1 {
|
||||||
|
margin-top: 25px;
|
||||||
|
font-size: 25.6px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.column {
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section {
|
||||||
|
padding-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h1 {
|
||||||
|
font-size: 25.6px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h2 {
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h3 {
|
||||||
|
font-size: 22px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h4 {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h5 {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h6 {
|
||||||
|
font-size: 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.archive-title {
|
||||||
|
font-size: 1rem;
|
||||||
|
margin-top: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.archive-item-link {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.archive-item-date {
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section {
|
||||||
|
padding-top: 1rem;
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.single-container,
|
||||||
|
.archive-container,
|
||||||
|
.each-category {
|
||||||
|
padding-left: 5vw;
|
||||||
|
padding-right: 5vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title,
|
||||||
|
.archive-title {
|
||||||
|
margin-top: 1vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
346
assets/scss/_normalize.scss
Normal file
346
assets/scss/_normalize.scss
Normal file
@ -0,0 +1,346 @@
|
|||||||
|
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
|
||||||
|
|
||||||
|
/* Document
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the line height in all browsers.
|
||||||
|
* 2. Prevent adjustments of font size after orientation changes in iOS.
|
||||||
|
*/
|
||||||
|
/* Solve the problem that mobile pages generate shadows when clicking on icons or buttons */
|
||||||
|
html {
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
-webkit-text-size-adjust: 100%; /* 2 */
|
||||||
|
|
||||||
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sections
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the margin in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the font size and margin on `h1` elements within `section` and
|
||||||
|
* `article` contexts in Chrome, Firefox, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Grouping content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in Firefox.
|
||||||
|
* 2. Show the overflow in Edge and IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
hr {
|
||||||
|
box-sizing: content-box; /* 1 */
|
||||||
|
height: 0; /* 1 */
|
||||||
|
overflow: visible; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
pre {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Text-level semantics
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the gray background on active links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
a {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Remove the bottom border in Chrome 57-
|
||||||
|
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
abbr[title] {
|
||||||
|
border-bottom: none; /* 1 */
|
||||||
|
text-decoration: underline; /* 2 */
|
||||||
|
text-decoration: underline dotted; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
b,
|
||||||
|
strong {
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
code,
|
||||||
|
kbd,
|
||||||
|
samp {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font size in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
small {
|
||||||
|
font-size: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||||
|
* all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
sub,
|
||||||
|
sup {
|
||||||
|
font-size: 75%;
|
||||||
|
line-height: 0;
|
||||||
|
position: relative;
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
sub {
|
||||||
|
bottom: -0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup {
|
||||||
|
top: -0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Embedded content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the border on images inside links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
img {
|
||||||
|
border-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Forms
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Change the font styles in all browsers.
|
||||||
|
* 2. Remove the margin in Firefox and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input,
|
||||||
|
optgroup,
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
|
font-family: inherit; /* 1 */
|
||||||
|
font-size: 100%; /* 1 */
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
margin: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Show the overflow in IE.
|
||||||
|
* 1. Show the overflow in Edge.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input {
|
||||||
|
/* 1 */
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||||
|
* 1. Remove the inheritance of text transform in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
select {
|
||||||
|
/* 1 */
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
[type='button'],
|
||||||
|
[type='reset'],
|
||||||
|
[type='submit'] {
|
||||||
|
-webkit-appearance: button;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner border and padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button::-moz-focus-inner,
|
||||||
|
[type='button']::-moz-focus-inner,
|
||||||
|
[type='reset']::-moz-focus-inner,
|
||||||
|
[type='submit']::-moz-focus-inner {
|
||||||
|
border-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Restore the focus styles unset by the previous rule.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button:-moz-focusring,
|
||||||
|
[type='button']:-moz-focusring,
|
||||||
|
[type='reset']:-moz-focusring,
|
||||||
|
[type='submit']:-moz-focusring {
|
||||||
|
outline: 1px dotted ButtonText;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
padding: 0.35em 0.75em 0.625em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the text wrapping in Edge and IE.
|
||||||
|
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||||
|
* 3. Remove the padding so developers are not caught out when they zero out
|
||||||
|
* `fieldset` elements in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
legend {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
color: inherit; /* 2 */
|
||||||
|
display: table; /* 1 */
|
||||||
|
max-width: 100%; /* 1 */
|
||||||
|
padding: 0; /* 3 */
|
||||||
|
white-space: normal; /* 1 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||||
|
*/
|
||||||
|
|
||||||
|
progress {
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the default vertical scrollbar in IE 10+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in IE 10.
|
||||||
|
* 2. Remove the padding in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type='checkbox'],
|
||||||
|
[type='radio'] {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
padding: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type='number']::-webkit-inner-spin-button,
|
||||||
|
[type='number']::-webkit-outer-spin-button {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the odd appearance in Chrome and Safari.
|
||||||
|
* 2. Correct the outline style in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type='search'] {
|
||||||
|
-webkit-appearance: textfield; /* 1 */
|
||||||
|
outline-offset: -2px; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner padding in Chrome and Safari on macOS.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type='search']::-webkit-search-decoration {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
* 2. Change font properties to `inherit` in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
::-webkit-file-upload-button {
|
||||||
|
-webkit-appearance: button; /* 1 */
|
||||||
|
font: inherit; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Interactive
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in Edge, IE 10+, and Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
details {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
summary {
|
||||||
|
display: list-item;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Misc
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
template {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[hidden] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
9
assets/scss/_pagination.scss
Normal file
9
assets/scss/_pagination.scss
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
.pagination {
|
||||||
|
justify-content: space-around;
|
||||||
|
margin: 0 10vw 1rem 10vw;
|
||||||
|
|
||||||
|
.pag-link {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
115
assets/scss/_single.scss
Normal file
115
assets/scss/_single.scss
Normal file
@ -0,0 +1,115 @@
|
|||||||
|
#scrollToTopButton{
|
||||||
|
position: fixed;
|
||||||
|
bottom: 20px;
|
||||||
|
right: 20px;
|
||||||
|
z-index: 9999;
|
||||||
|
}
|
||||||
|
#verification{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 20vh;
|
||||||
|
#secret-word{
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
form {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
width: auto;
|
||||||
|
input[type="password"] {
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
padding: 10px 20px;
|
||||||
|
}
|
||||||
|
input[type="submit"] {
|
||||||
|
padding: 10px 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
input[type="submit"]:hover {
|
||||||
|
background-color: $main-orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.hidden{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.single-container{
|
||||||
|
|
||||||
|
.archive{
|
||||||
|
|
||||||
|
.author-image {
|
||||||
|
object-fit: cover;
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.author-info {
|
||||||
|
display: flex;
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.small-categories-container {
|
||||||
|
margin-right: 3rem;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-content > :not(.toc-container){
|
||||||
|
a{
|
||||||
|
color: #6086b4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.pre-and-post {
|
||||||
|
display: flex;
|
||||||
|
margin: 5px 0;
|
||||||
|
justify-content: space-between;
|
||||||
|
a {
|
||||||
|
font-weight: bolder;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-content {
|
||||||
|
margin: 2rem 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
#verification{
|
||||||
|
|
||||||
|
#secret-word{
|
||||||
|
font-size: 1rem;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
form {
|
||||||
|
|
||||||
|
input[type="password"] {
|
||||||
|
padding: 10px 20px;
|
||||||
|
width: auto;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
input[type="submit"] {
|
||||||
|
padding: 10px 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
background-color: $main-orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.single-container .title {
|
||||||
|
text-align: left;
|
||||||
|
.small-categories-container {
|
||||||
|
margin-right: 5vw;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
37
assets/scss/_summary.scss
Normal file
37
assets/scss/_summary.scss
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
@import "variables";
|
||||||
|
|
||||||
|
.post-title {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
@media (max-width: 768px){
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-link {
|
||||||
|
color: $main-black;
|
||||||
|
font-size: $font-size-content-larger;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: $font-size-content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#post-container {
|
||||||
|
padding: 1rem;
|
||||||
|
background-color: $main-light;
|
||||||
|
border-radius: 24px;
|
||||||
|
|
||||||
|
.excerpt {
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 3;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-time-container {
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.dark-mode #post-container {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
0
assets/scss/_taxonomy.scss
Normal file
0
assets/scss/_taxonomy.scss
Normal file
38
assets/scss/_terms.scss
Normal file
38
assets/scss/_terms.scss
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
|
||||||
|
.card-container {
|
||||||
|
display: flex;
|
||||||
|
padding-left: 20vw;
|
||||||
|
padding-right: 20vw;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
.card {
|
||||||
|
height: 72px;
|
||||||
|
width: auto;
|
||||||
|
margin: 2rem;
|
||||||
|
border-radius: 6%;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
transform: scale(1.1);
|
||||||
|
transition: all 0.3s linear;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
|
||||||
|
.card-container {
|
||||||
|
display: flex;
|
||||||
|
padding: 0 20vw;
|
||||||
|
flex-direction: column;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
margin: 1rem;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
58
assets/scss/_toc.scss
Normal file
58
assets/scss/_toc.scss
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
@import "variables";
|
||||||
|
|
||||||
|
.post-toc {
|
||||||
|
margin-left: 16px;
|
||||||
|
font-size: 0.9em;
|
||||||
|
line-height: 1.6;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
@media (max-width: 768px){
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
nav{
|
||||||
|
margin-left: -1rem;
|
||||||
|
}
|
||||||
|
ul,li {
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
nav {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
nav > ul > li > a::before {
|
||||||
|
content: "┃";
|
||||||
|
color: $main-orange;
|
||||||
|
}
|
||||||
|
ul > li > ul > li :first-child::before {
|
||||||
|
content: "┃";
|
||||||
|
color: #fded01;
|
||||||
|
}
|
||||||
|
a :last-child {
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#TableOfContents a:hover, #TableOfContents a:active {
|
||||||
|
color: $main-orange;
|
||||||
|
}
|
||||||
|
.toc-container {
|
||||||
|
position: fixed;
|
||||||
|
right: 5vw;
|
||||||
|
overflow: auto;
|
||||||
|
top: 100px;
|
||||||
|
width: 15vw;
|
||||||
|
bottom: 50px;
|
||||||
|
button{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
@media (max-width: 768px){
|
||||||
|
position: static;
|
||||||
|
width: auto;
|
||||||
|
#hide{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
button{
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
13
assets/scss/_variables.scss
Normal file
13
assets/scss/_variables.scss
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
$main-black: #363636;
|
||||||
|
$main-orange: #FAB005;
|
||||||
|
$main-light: #f5f5f5;
|
||||||
|
$main-grey: rgb(142, 139, 139);
|
||||||
|
$dark-background: #1F1F1F;
|
||||||
|
$dark-navbar: #2D2F31;
|
||||||
|
$dark-font: #E3E3E3;
|
||||||
|
$font-size-home-title: 2.5rem;
|
||||||
|
$font-size-article-title: 2.5rem;
|
||||||
|
$font-size-article-title-mobile: 1.8rem;
|
||||||
|
$font-size-content: 1rem;
|
||||||
|
$font-size-content-larger: 1.3rem;
|
||||||
|
$font-size-archive-title: 1.9rem;
|
||||||
13
assets/scss/style.scss
Normal file
13
assets/scss/style.scss
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
@import "normalize";
|
||||||
|
@import "main";
|
||||||
|
@import "header";
|
||||||
|
@import "single";
|
||||||
|
@import "archive";
|
||||||
|
@import "footer";
|
||||||
|
@import "header";
|
||||||
|
@import "index";
|
||||||
|
@import "terms";
|
||||||
|
@import "summary";
|
||||||
|
@import "toc";
|
||||||
|
@import "about";
|
||||||
|
@import "pagination";
|
||||||
25
content/about.md
Normal file
25
content/about.md
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
---
|
||||||
|
title: "About us"
|
||||||
|
date: 2023-06-14T20:56:49+02:00
|
||||||
|
author: Andre
|
||||||
|
heroimage: /images/hopeless-cloud.png
|
||||||
|
layout: about
|
||||||
|
---
|
||||||
|
|
||||||
|
# Hopeless-cloud
|
||||||
|
|
||||||
|
## Who are we?
|
||||||
|
|
||||||
|
We are just a bunch of people that self host open source software.
|
||||||
|
|
||||||
|
## What is our mission?
|
||||||
|
|
||||||
|
Our mission is to make the world just a bit better by helper others.
|
||||||
|
|
||||||
|
## How can I join?
|
||||||
|
|
||||||
|
You can join us by writing one of our members.
|
||||||
|
|
||||||
|
[Matrix - ProfessionalUwU](@professionaluwu:hopeless-cloud.xyz)
|
||||||
|
[Matrix - AustrianToast](@professionaluwu:hopeless-cloud.xyz)
|
||||||
|
[Email](support@hopeless-cloud.xyz)
|
||||||
11
content/post/Introduction.md
Normal file
11
content/post/Introduction.md
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
---
|
||||||
|
title: "Introduction"
|
||||||
|
date: 2023-06-14T20:46:23+02:00
|
||||||
|
categories: ["Essay"]
|
||||||
|
---
|
||||||
|
# Welcome to hopeless-cloud
|
||||||
|
|
||||||
|
## Our provider Oracle Cloud
|
||||||
|
|
||||||
|
The only reason we choose Oracle Cloud is that it was completely free.
|
||||||
|
4 Arm cores + 24GB RAM
|
||||||
145
content/post/Markdown_Syntax_Guide.md
Normal file
145
content/post/Markdown_Syntax_Guide.md
Normal file
@ -0,0 +1,145 @@
|
|||||||
|
---
|
||||||
|
title: "Markdown Syntax Guide"
|
||||||
|
date: 2023-06-14T20:45:23+02:00
|
||||||
|
categories: ["Guide"]
|
||||||
|
---
|
||||||
|
|
||||||
|
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
|
||||||
|
|
||||||
|
## Headings
|
||||||
|
|
||||||
|
The following HTML `<h1>`—`<h6>` elements represent six levels of section headings. `<h1>` is the highest section level while `<h6>` is the lowest.
|
||||||
|
|
||||||
|
# H1
|
||||||
|
|
||||||
|
## H2
|
||||||
|
|
||||||
|
### H3
|
||||||
|
|
||||||
|
#### H4
|
||||||
|
|
||||||
|
##### H5
|
||||||
|
|
||||||
|
###### H6
|
||||||
|
|
||||||
|
## Paragraph
|
||||||
|
|
||||||
|
Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.
|
||||||
|
|
||||||
|
Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.
|
||||||
|
|
||||||
|
## Blockquotes
|
||||||
|
|
||||||
|
The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a `footer` or `cite` element, and optionally with in-line changes such as annotations and abbreviations.
|
||||||
|
|
||||||
|
#### Blockquote without attribution
|
||||||
|
|
||||||
|
> Tiam, ad mint andaepu dandae nostion secatur sequo quae. **Note** that you can use *Markdown syntax* within a blockquote.
|
||||||
|
|
||||||
|
#### Blockquote with attribution
|
||||||
|
|
||||||
|
> Don’t communicate by sharing memory, share memory by communicating.
|
||||||
|
> — Rob Pike[1](https://hugo-paper.vercel.app/post/markdown-syntax/#fn:1)
|
||||||
|
|
||||||
|
## Tables
|
||||||
|
|
||||||
|
Tables aren’t part of the core Markdown spec, but Hugo supports supports them out-of-the-box.
|
||||||
|
|
||||||
|
| Name | Age |
|
||||||
|
| ----- | ---- |
|
||||||
|
| Bob | 27 |
|
||||||
|
| Alice | 23 |
|
||||||
|
|
||||||
|
#### Inline Markdown within tables
|
||||||
|
|
||||||
|
| Italics | Bold | Code |
|
||||||
|
| --------- | -------- | ------ |
|
||||||
|
| *italics* | **bold** | `code` |
|
||||||
|
|
||||||
|
## Code Blocks
|
||||||
|
|
||||||
|
#### Code block with backticks
|
||||||
|
|
||||||
|
```html
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<title>Example HTML5 Document</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Test</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Code block indented with four spaces
|
||||||
|
|
||||||
|
```html
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Example HTML5 Document</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Test</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Code block with Hugo’s internal highlight shortcode
|
||||||
|
|
||||||
|
```html
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Example HTML5 Document</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Test</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
```
|
||||||
|
|
||||||
|
## List Types
|
||||||
|
|
||||||
|
#### Ordered List
|
||||||
|
|
||||||
|
1. First item
|
||||||
|
2. Second item
|
||||||
|
3. Third item
|
||||||
|
|
||||||
|
#### Unordered List
|
||||||
|
|
||||||
|
- List item
|
||||||
|
- Another item
|
||||||
|
- And another item
|
||||||
|
|
||||||
|
#### Nested list
|
||||||
|
|
||||||
|
- Fruit
|
||||||
|
- Apple
|
||||||
|
- Orange
|
||||||
|
- Banana
|
||||||
|
- Dairy
|
||||||
|
- Milk
|
||||||
|
- Cheese
|
||||||
|
|
||||||
|
## Other Elements — abbr, sub, sup, kbd, mark
|
||||||
|
|
||||||
|
GIF is a bitmap image format.
|
||||||
|
|
||||||
|
H2O
|
||||||
|
|
||||||
|
Xn + Yn = Zn
|
||||||
|
|
||||||
|
Press CTRL+ALT+Delete to end the session.
|
||||||
|
|
||||||
|
Most salamanders are nocturnal, and hunt for insects, worms, and other small creatures.
|
||||||
|
|
||||||
|
{{< rawhtml >}}
|
||||||
|
<hr>
|
||||||
|
{{< /rawhtml >}}
|
||||||
|
The above quote is excerpted from Rob Pike’s talk during Gopherfest, November 18, 2015.
|
||||||
28
content/post/lorem-ipsum.md
Normal file
28
content/post/lorem-ipsum.md
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
---
|
||||||
|
title: "Lorem Ipsum"
|
||||||
|
date: 2022-04-10T16:50:28+08:00
|
||||||
|
categories : [ "Development" ]
|
||||||
|
protected: true
|
||||||
|
password: "111111"
|
||||||
|
---
|
||||||
|
Lorem ipsum dolor sit amet, consectetur...
|
||||||
|
## What is Lorem Ipsum?
|
||||||
|
In mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus ut
|
||||||
|
|
||||||
|
Vivamus ut tincidunt urna. Nam eu mollis dolor...
|
||||||
|
|
||||||
|
## In mollis cursus ligula
|
||||||
|
Etiam et ligula sit amet urna aliquam suscipit...
|
||||||
|
|
||||||
|
- Cras dui nulla,
|
||||||
|
- ornare eget fermentum quis,
|
||||||
|
- accumsan vitae purus.
|
||||||
|
|
||||||
|
Nam eget pharetra arcu. Cras dui nulla, ornare eget...
|
||||||
|
|
||||||
|
### Nullam a risus maximus
|
||||||
|
Fusce facilisis non anteIn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utIn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus ut quis blandit...
|
||||||
|
|
||||||
|
### Donec vel accumsan justo
|
||||||
|
Maecenas eu libero ac justo tempor pellentesque...
|
||||||
|
In mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utIn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utIn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus ut
|
||||||
38
hugo.toml
Normal file
38
hugo.toml
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
baseURL = 'https://hopeless-cloud.xyz/'
|
||||||
|
languageCode = 'en-us'
|
||||||
|
theme = "JuiceBar"
|
||||||
|
title = "Hopeless-cloud"
|
||||||
|
|
||||||
|
[params]
|
||||||
|
author = "Andre Fuhry"
|
||||||
|
description = "Just a bunch of people that advocate for open source"
|
||||||
|
authorImage = "/images/hopeless-cloud.png"
|
||||||
|
paginate = 5
|
||||||
|
Title = "Hopeless-cloud"
|
||||||
|
content = "Welcome to Hopeless-cloud! Enjoy your stay and have a nice day!"
|
||||||
|
imageUrl = "/images/hopeless-cloud.png"
|
||||||
|
|
||||||
|
# To add a new social icon
|
||||||
|
# More social icons can be found in JuiceBar\layouts\partials\svg.html.
|
||||||
|
[[params.social]]
|
||||||
|
name = "github"
|
||||||
|
url = "https://gitea.hopeless-cloud.xyz/ProfessionalUwU"
|
||||||
|
[[params.social]]
|
||||||
|
name = "email"
|
||||||
|
url = "mailto:andre.fuhry@hopeless-cloud.xyz"
|
||||||
|
|
||||||
|
[taxonomies]
|
||||||
|
category = "categories"
|
||||||
|
tag = "tags"
|
||||||
|
|
||||||
|
# To add a new navigation link
|
||||||
|
[[menu.main]]
|
||||||
|
name = "About"
|
||||||
|
url = "/about"
|
||||||
|
[[menu.main]]
|
||||||
|
name = "Blog"
|
||||||
|
url = "/post"
|
||||||
|
|
||||||
|
# Used for outputting the documentation (required).
|
||||||
|
[outputs]
|
||||||
|
home = ["HTML", "RSS", "JSON"]
|
||||||
6
layouts/404.html
Normal file
6
layouts/404.html
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<div class="container">
|
||||||
|
<p>Page not found</p>
|
||||||
|
<p><a href="/">Go to Home Page</a></p>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
12
layouts/_default/about.html
Normal file
12
layouts/_default/about.html
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
{{/* 单个帖子的模板 */}}
|
||||||
|
{{ define "main" }}
|
||||||
|
<div class="single-container is-centered">
|
||||||
|
<div class="archive">
|
||||||
|
<h1 class="title is-1">{{ .Title }}</h1>
|
||||||
|
<div class="content about-content">
|
||||||
|
{{ .Content }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
13
layouts/_default/baseof.html
Normal file
13
layouts/_default/baseof.html
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="{{ .Site.LanguageCode }}">
|
||||||
|
{{- partial "head.html" . -}}
|
||||||
|
<body>
|
||||||
|
{{- partial "header.html" . -}}
|
||||||
|
<main>
|
||||||
|
{{- block "main" . }}{{- end }}
|
||||||
|
</main>
|
||||||
|
{{- partial "footer.html" . -}}
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
5
layouts/_default/index.json
Normal file
5
layouts/_default/index.json
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
{{- $.Scratch.Add "index" slice -}}
|
||||||
|
{{- range .Site.RegularPages -}}
|
||||||
|
{{- $.Scratch.Add "index" (dict "title" .Title "tags" .Params.tags "categories" .Params.categories "contents" .Plain "permalink" .Permalink "date" .Date "section" .Section) -}}
|
||||||
|
{{- end -}}
|
||||||
|
{{- $.Scratch.Get "index" | jsonify -}}
|
||||||
16
layouts/_default/list.html
Normal file
16
layouts/_default/list.html
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
{{/* 列表类型页面的通用模板.点击blog之后展示出来的页面 */}}
|
||||||
|
{{/* user：为博客文章列表创建一个索引页面。
|
||||||
|
>> hugo new blog/_index.md */}}
|
||||||
|
{{ define "main" }}
|
||||||
|
<div class="container">
|
||||||
|
<div class="section">
|
||||||
|
<div class="content">
|
||||||
|
<h1>{{ .Title }}</h1>
|
||||||
|
{{ .Content }}
|
||||||
|
{{ range .Pages.ByPublishDate.Reverse }}
|
||||||
|
<a href="{{ .Permalink }}">{{ .Title }}</a>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
15
layouts/_default/single.html
Normal file
15
layouts/_default/single.html
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
{{- with site.Params.homeInfoParams }}
|
||||||
|
<article class="first-entry home-info">
|
||||||
|
<header class="entry-header">
|
||||||
|
<h1>{{ .Title }}</h1>
|
||||||
|
</header>
|
||||||
|
<div class="entry-content">
|
||||||
|
{{ .Content}}
|
||||||
|
</div>
|
||||||
|
<footer class="entry-footer">
|
||||||
|
{{ partial "social_icons.html" site.Params.socialIcons }}
|
||||||
|
</footer>
|
||||||
|
</article>
|
||||||
|
{{- end -}}
|
||||||
|
{{ end }}
|
||||||
26
layouts/_default/summary.html
Normal file
26
layouts/_default/summary.html
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
<article class="post">
|
||||||
|
<div class="single-container column is-centered">
|
||||||
|
<div class="archive" id="post-container">
|
||||||
|
<header class="post-header">
|
||||||
|
<h1 class="post-title hover-underline-animation"><a class="post-link" href="{{ .RelPermalink }}">{{ .Title
|
||||||
|
}}</a></h1>
|
||||||
|
|
||||||
|
|
||||||
|
</header>
|
||||||
|
<div class="post-content">
|
||||||
|
<div class="excerpt post-summary">
|
||||||
|
{{ if .Params.protected}}
|
||||||
|
<p>Psst! The article you seek is guarded by a mischievous password, hidden within the realms of whimsy and giggles. Unleash your inner unicorn, sprinkle some sparkle, and let the charm of curiosity guide you to unlock its enchanting secrets!</p>
|
||||||
|
{{ else }}
|
||||||
|
{{ .Summary }}
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="post-time-container">
|
||||||
|
<span class="post-time"> {{ .Date.Format (.Site.Params.dateFormatToUse | default "2006-01-02") }} </span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
23
layouts/categories/taxonomy.html
Normal file
23
layouts/categories/taxonomy.html
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<div class="container">
|
||||||
|
<div class="section">
|
||||||
|
<h2 class="archive-title">Category: {{ .Title }}</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="each-category column is-centered">
|
||||||
|
|
||||||
|
|
||||||
|
{{ range .Paginator.Pages}}
|
||||||
|
|
||||||
|
<article class="archive-item">
|
||||||
|
<a href="{{ .Permalink }}" class="archive-item-link hover-underline-animation">{{ .Title }}</a>
|
||||||
|
<span class="archive-item-date">
|
||||||
|
{{ .Date.Format "January 2, 2006" }}
|
||||||
|
</span>
|
||||||
|
|
||||||
|
</article>
|
||||||
|
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
33
layouts/categories/terms.html
Normal file
33
layouts/categories/terms.html
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<div class="container">
|
||||||
|
<div class="section">
|
||||||
|
<div class="content">
|
||||||
|
<h1>{{ .Title }}</h1>
|
||||||
|
{{ .Content }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section class="card-container" >
|
||||||
|
|
||||||
|
{{ range .Data.Terms.ByCount }}
|
||||||
|
<div class="card">
|
||||||
|
|
||||||
|
<a href="{{ .Page.Permalink }}">
|
||||||
|
</a>
|
||||||
|
<div class="card-content has-text-centered">
|
||||||
|
<div>
|
||||||
|
<a class="title is-5 is-size-6-mobile" href="{{ .Page.Permalink }}">{{ .Page.Title }}</a>
|
||||||
|
{{ $pageCount := len .Pages }}
|
||||||
|
<strong>
|
||||||
|
<sup style="font-size:16px;">{{ $pageCount }}</sup>
|
||||||
|
</strong>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{{ end }}
|
||||||
51
layouts/index.html
Normal file
51
layouts/index.html
Normal file
@ -0,0 +1,51 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<article>
|
||||||
|
{{- with site.Params}}
|
||||||
|
<div class="is-centered">
|
||||||
|
<div class="title subtitle heading is-6">
|
||||||
|
<div id="home-box" >
|
||||||
|
{{ with .imageUrl }}
|
||||||
|
<div class="avatar-container">
|
||||||
|
<img src="{{.}}" class="author-avatar">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<h1 id="home-title" class="title is-1 ">{{ .Title }}</h1>
|
||||||
|
<div class="description column content typewriter-effect">
|
||||||
|
<div class="text" id="typewriter-text"> {{ .Content }}</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<script>
|
||||||
|
const typeWriter = document.getElementById('typewriter-text');
|
||||||
|
typeWriter.style.setProperty('--characters', typeWriter.innerHTML.length);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="social-icon">
|
||||||
|
|
||||||
|
{{ range .Social }}
|
||||||
|
<a href="{{ .url }}" title="{{ .name }}"><span class="change-color icon">
|
||||||
|
{{ partial "svg.html" . }}
|
||||||
|
</span></a>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{- end -}}
|
||||||
|
|
||||||
|
</article>
|
||||||
|
<div class="summary">
|
||||||
|
{{- $paginator := .Paginate (where (where .Site.RegularPages "Type" "post") ".Params.draft" "!=" true) }}
|
||||||
|
{{ range $paginator.Pages }}
|
||||||
|
{{ .Render "summary" }}
|
||||||
|
{{ end }}
|
||||||
|
{{ partial "pagination.html" . }}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
49
layouts/partials/comment.html
Normal file
49
layouts/partials/comment.html
Normal file
@ -0,0 +1,49 @@
|
|||||||
|
{{- if isset .Site.Params "giscus" -}}
|
||||||
|
<hr style="border-top: 1px solid #EEEEEE;">
|
||||||
|
<div id="comment"></div>
|
||||||
|
<script>
|
||||||
|
const getStoredTheme = () => localStorage.getItem("theme") === "dark" ? "dark" : "light";
|
||||||
|
|
||||||
|
const setGiscusTheme = () => {
|
||||||
|
const sendMessage = (message) => {
|
||||||
|
const iframe = document.querySelector('iframe.giscus-frame');
|
||||||
|
if (iframe) {
|
||||||
|
iframe.contentWindow.postMessage({giscus: message}, 'https://giscus.app');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
sendMessage({setConfig: {theme: getStoredTheme()}})
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
|
const giscusAttributes = {
|
||||||
|
"src": "https://giscus.app/client.js",
|
||||||
|
"data-repo": "{{ .Site.Params.giscus.repo }}",
|
||||||
|
"data-repo-id": "{{ .Site.Params.giscus.repoID }}",
|
||||||
|
"data-category": "{{ .Site.Params.giscus.category }}",
|
||||||
|
"data-category-id": "{{ .Site.Params.giscus.categoryID }}",
|
||||||
|
"data-mapping": "{{ default " pathname" .Site.Params.giscus.mapping }}",
|
||||||
|
"data-reactions-enabled": "{{ default "1" .Site.Params.giscus.reactionsEnabled }}",
|
||||||
|
"data-emit-metadata": "{{ default "0" .Site.Params.giscus.emitMetadata }}",
|
||||||
|
"data-input-position": "{{ default "bottom" .Site.Params.giscus.inputPosition }}",
|
||||||
|
"data-theme": getStoredTheme(),
|
||||||
|
"data-lang": "{{ default "en" .Site.Params.giscus.lang }}",
|
||||||
|
"data-loading": "{{ default "lazy" .Site.Params.giscus.loading }}",
|
||||||
|
"crossorigin": "anonymous",
|
||||||
|
};
|
||||||
|
|
||||||
|
// Dynamically create script tag.
|
||||||
|
const giscusScript = document.createElement("script");
|
||||||
|
Object.entries(giscusAttributes).forEach(
|
||||||
|
([key, value]) => giscusScript.setAttribute(key, value));
|
||||||
|
document.getElementById("comment").appendChild(giscusScript);
|
||||||
|
|
||||||
|
// Update giscus theme when the theme switcher is clicked.
|
||||||
|
const themeToggle = document.querySelector(".theme-toggle");
|
||||||
|
if (themeToggle) {
|
||||||
|
themeToggle.addEventListener("click", setGiscusTheme);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
</script>
|
||||||
|
{{end}}
|
||||||
|
|
||||||
14
layouts/partials/footer.html
Normal file
14
layouts/partials/footer.html
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
<footer class="footer">
|
||||||
|
<div class="content has-text-centered">
|
||||||
|
{{- if site.Copyright }}
|
||||||
|
<span>{{ site.Copyright | markdownify }}</span>
|
||||||
|
{{- else }}
|
||||||
|
<span>© {{ now.Year }} <a href="{{ "" | absLangURL }}">{{ site.Title }}</a></span>
|
||||||
|
{{- end }}
|
||||||
|
<span>
|
||||||
|
Powered by
|
||||||
|
<a href="https://gohugo.io/" target="_blank">Hugo</a> &
|
||||||
|
<a href="https://github.com/hotjuicew/hugo-JuiceBar" target="_blank">JuiceBar</a>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
19
layouts/partials/head.html
Normal file
19
layouts/partials/head.html
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
||||||
|
<title>{{ if not .IsHome }}{{ with .Title }}{{ . }} | {{ end }}{{ end }}{{ .Site.Title }}</title>
|
||||||
|
<meta name="description"
|
||||||
|
content="{{ with .Description }}{{ . }}{{ else }}{{ with .Summary }}{{ . }}{{ else }}{{ .Site.Params.description }}{{end }}{{ end }}">
|
||||||
|
<link rel="canonical" href="{{ .Permalink }}" />
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.min.css">
|
||||||
|
{{ $styles := resources.Get "scss/style.scss" | toCSS | minify | fingerprint }}
|
||||||
|
<link rel="stylesheet" href="{{ $styles.Permalink }}">
|
||||||
|
|
||||||
|
{{ template "_internal/opengraph.html" . }}
|
||||||
|
{{ template "_internal/twitter_cards.html" . }}
|
||||||
|
{{ if not (in (string .Site.BaseURL) "localhost") }}
|
||||||
|
{{ template "_internal/google_analytics_async.html" . }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
</head>
|
||||||
102
layouts/partials/header.html
Normal file
102
layouts/partials/header.html
Normal file
@ -0,0 +1,102 @@
|
|||||||
|
<nav class="navbar is-light" role="navigation">
|
||||||
|
<div class="container">
|
||||||
|
<div class="navbar-brand">
|
||||||
|
<a href="/" title="home" class="navbar-item">
|
||||||
|
<span class="logo">
|
||||||
|
<h1>{{ .Site.Title }}</h1>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<!-- sun icon -->
|
||||||
|
<a id="theme-toggle" class="theme-toggle" href="#">
|
||||||
|
<img src="{{ .Site.BaseURL }}svg/sun.svg" alt="sun icon" class="theme-icon" />
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
|
||||||
|
<span aria-hidden="true"></span>
|
||||||
|
<span aria-hidden="true"></span>
|
||||||
|
<span aria-hidden="true"></span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="navbar-menu">
|
||||||
|
<div class="navbar-start">
|
||||||
|
{{ range .Site.Menus.main }}
|
||||||
|
<a href="{{ .URL }}" class="navbar-item">{{ .Name }}</a>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="search">
|
||||||
|
<div id="fastSearch">
|
||||||
|
<input id="searchInput" tabindex="0" placeholder="Search..">
|
||||||
|
<ul id="searchResults">
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a id="search-btn" style="display: inline-block;" href="# ">
|
||||||
|
<div class="icon-search"><svg class="search-svg" xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentcolor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg></div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="/js/fuse.min.js"></script> <!-- download and copy over fuse.min.js file from fusejs.io -->
|
||||||
|
<script src="/js/fastsearch.js"></script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
//hamburger icon on a mobile device.
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
var burger = document.querySelector('.navbar-burger');
|
||||||
|
burger.addEventListener('click', function() {
|
||||||
|
burger.classList.toggle('is-active');
|
||||||
|
document.querySelector('.navbar-menu').classList.toggle('is-active');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// theme color switch
|
||||||
|
function setTheme(theme) {
|
||||||
|
let body = document.body;
|
||||||
|
let themeIcon = document.querySelector(".theme-icon");
|
||||||
|
if (theme === "dark") {
|
||||||
|
body.classList.add("dark-mode");
|
||||||
|
themeIcon.src = "{{ .Site.BaseURL }}svg/moon.svg";
|
||||||
|
themeIcon.alt = "moon icon";
|
||||||
|
} else {
|
||||||
|
body.classList.remove("dark-mode");
|
||||||
|
themeIcon.src = "{{ .Site.BaseURL }}svg/sun.svg";
|
||||||
|
themeIcon.alt = "sun icon";
|
||||||
|
}
|
||||||
|
// Save the user-selected theme mode to local storage.
|
||||||
|
localStorage.setItem("theme", theme);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Retrieve the user-selected theme mode from local storage
|
||||||
|
let theme = localStorage.getItem("theme") || "light";
|
||||||
|
const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||||
|
if (isDarkMode) {
|
||||||
|
// Site is in dark mode
|
||||||
|
setTheme('dark');
|
||||||
|
|
||||||
|
} else {
|
||||||
|
// Site is in light mode
|
||||||
|
setTheme('light');
|
||||||
|
}
|
||||||
|
setTheme(theme);
|
||||||
|
|
||||||
|
// Toggle theme when sun icon is clicked
|
||||||
|
document.getElementById("theme-toggle").addEventListener("click", function() {
|
||||||
|
if (theme === "light") {
|
||||||
|
theme = "dark";
|
||||||
|
} else {
|
||||||
|
theme = "light";
|
||||||
|
}
|
||||||
|
setTheme(theme);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</header>
|
||||||
15
layouts/partials/pagination.html
Normal file
15
layouts/partials/pagination.html
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
<hr>
|
||||||
|
<section class="pagination" >
|
||||||
|
{{ if .Paginator.HasPrev }}
|
||||||
|
|
||||||
|
<button class="button ">
|
||||||
|
<a href="{{ .Paginator.Prev.URL }}" class="pag-link"> Prev </a>
|
||||||
|
</button>
|
||||||
|
{{ end }}
|
||||||
|
<label class="pag-link">Page {{ .Paginator.PageNumber}} of {{.Paginator.TotalPages}}</label>
|
||||||
|
{{ if .Paginator.HasNext }}
|
||||||
|
<button class="button" >
|
||||||
|
<a href="{{ .Paginator.Next.URL }}" class="pag-link"> Next </a>
|
||||||
|
</button>
|
||||||
|
{{ end }}
|
||||||
|
</section>
|
||||||
217
layouts/partials/svg.html
Normal file
217
layouts/partials/svg.html
Normal file
@ -0,0 +1,217 @@
|
|||||||
|
{{- $icon_name := ( .name|lower )}}
|
||||||
|
{{- if (eq $icon_name "123rf") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path style="font-variation-settings:normal"
|
||||||
|
d="M7.48 3.826c-.702 0-1.345.388-1.675 1.008l-.711 1.334a4.214 4.214 0 0 1-1.614 1.67l-.388.224a2.207 2.207 0 0 0-1.104 1.913v8.607c0 .878.712 1.592 1.59 1.592h1.186c.468 0 .916-.19 1.244-.524l1.478-1.504c.266-.27.628-.421 1.006-.421h7.04c.378 0 .74.151 1.005.421l1.478 1.504c.329.334.778.524 1.247.524h1.183c.879 0 1.592-.714 1.592-1.592V9.975c0-.79-.422-1.518-1.106-1.912l-.388-.225a4.214 4.214 0 0 1-1.613-1.67l-.711-1.334a1.899 1.899 0 0 0-1.676-1.008z"
|
||||||
|
stroke-linejoin="miter" />
|
||||||
|
<circle cx="12" cy="12.467" r="2.723" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "adobestock") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path style="font-variation-settings:normal" d="M2.235 2.235h19.53v19.53H2.235z" />
|
||||||
|
<path style="font-variation-settings:normal"
|
||||||
|
d="M6.165 16.659s3.16 1.2 4.602-.17c1.37-1.3.787-3.163-.754-4.05-1.68-.969-3.284-1.788-3.036-3.536.446-3.138 4.386-1.851 4.386-1.851M15.792 7.794v7.774c0 1.023.635 1.766 2.043 1.624M17.826 10.04h-3.582" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "applemusic") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none">
|
||||||
|
<path
|
||||||
|
d="M23.994 6.124a9.23 9.23 0 00-.24-2.19c-.317-1.31-1.062-2.31-2.18-3.043a5.022 5.022 0 00-1.877-.726 10.496 10.496 0 00-1.564-.15c-.04-.003-.083-.01-.124-.013H5.986c-.152.01-.303.017-.455.026-.747.043-1.49.123-2.193.4-1.336.53-2.3 1.452-2.865 2.78-.192.448-.292.925-.363 1.408-.056.392-.088.785-.1 1.18 0 .032-.007.062-.01.093v12.223c.01.14.017.283.027.424.05.815.154 1.624.497 2.373.65 1.42 1.738 2.353 3.234 2.801.42.127.856.187 1.293.228.555.053 1.11.06 1.667.06h11.03a12.5 12.5 0 001.57-.1c.822-.106 1.596-.35 2.295-.81a5.046 5.046 0 001.88-2.207c.186-.42.293-.87.37-1.324.113-.675.138-1.358.137-2.04-.002-3.8 0-7.595-.003-11.393zm-6.423 3.99v5.712c0 .417-.058.827-.244 1.206-.29.59-.76.962-1.388 1.14-.35.1-.706.157-1.07.173-.95.045-1.773-.6-1.943-1.536a1.88 1.88 0 011.038-2.022c.323-.16.67-.25 1.018-.324.378-.082.758-.153 1.134-.24.274-.063.457-.23.51-.516a.904.904 0 00.02-.193c0-1.815 0-3.63-.002-5.443a.725.725 0 00-.026-.185c-.04-.15-.15-.243-.304-.234-.16.01-.318.035-.475.066-.76.15-1.52.303-2.28.456l-2.325.47-1.374.278c-.016.003-.032.01-.048.013-.277.077-.377.203-.39.49-.002.042 0 .086 0 .13-.002 2.602 0 5.204-.003 7.805 0 .42-.047.836-.215 1.227-.278.64-.77 1.04-1.434 1.233-.35.1-.71.16-1.075.172-.96.036-1.755-.6-1.92-1.544-.14-.812.23-1.685 1.154-2.075.357-.15.73-.232 1.108-.31.287-.06.575-.116.86-.177.383-.083.583-.323.6-.714v-.15c0-2.96 0-5.922.002-8.882 0-.123.013-.25.042-.37.07-.285.273-.448.546-.518.255-.066.515-.112.774-.165.733-.15 1.466-.296 2.2-.444l2.27-.46c.67-.134 1.34-.27 2.01-.403.22-.043.442-.088.663-.106.31-.025.523.17.554.482.008.073.012.148.012.223.002 1.91.002 3.822 0 5.732z" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "applepodcasts") -}}
|
||||||
|
<svg height="32px" width="32px" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
|
||||||
|
<path
|
||||||
|
d="M5.34 0A5.328 5.328 0 000 5.34v13.32A5.328 5.328 0 005.34 24h13.32A5.328 5.328 0 0024 18.66V5.34A5.328 5.328 0 0018.66 0zm6.525 2.568c2.336 0 4.448.902 6.056 2.587 1.224 1.272 1.912 2.619 2.264 4.392.12.59.12 2.2.007 2.864a8.506 8.506 0 01-3.24 5.296c-.608.46-2.096 1.261-2.336 1.261-.088 0-.096-.091-.056-.46.072-.592.144-.715.48-.856.536-.224 1.448-.874 2.008-1.435a7.644 7.644 0 002.008-3.536c.208-.824.184-2.656-.048-3.504-.728-2.696-2.928-4.792-5.624-5.352-.784-.16-2.208-.16-3 0-2.728.56-4.984 2.76-5.672 5.528-.184.752-.184 2.584 0 3.336.456 1.832 1.64 3.512 3.192 4.512.304.2.672.408.824.472.336.144.408.264.472.856.04.36.03.464-.056.464-.056 0-.464-.176-.896-.384l-.04-.03c-2.472-1.216-4.056-3.274-4.632-6.012-.144-.706-.168-2.392-.03-3.04.36-1.74 1.048-3.1 2.192-4.304 1.648-1.737 3.768-2.656 6.128-2.656zm.134 2.81c.409.004.803.04 1.106.106 2.784.62 4.76 3.408 4.376 6.174-.152 1.114-.536 2.03-1.216 2.88-.336.43-1.152 1.15-1.296 1.15-.023 0-.048-.272-.048-.603v-.605l.416-.496c1.568-1.878 1.456-4.502-.256-6.224-.664-.67-1.432-1.064-2.424-1.246-.64-.118-.776-.118-1.448-.008-1.02.167-1.81.562-2.512 1.256-1.72 1.704-1.832 4.342-.264 6.222l.413.496v.608c0 .336-.027.608-.06.608-.03 0-.264-.16-.512-.36l-.034-.011c-.832-.664-1.568-1.842-1.872-2.997-.184-.698-.184-2.024.008-2.72.504-1.878 1.888-3.335 3.808-4.019.41-.145 1.133-.22 1.814-.211zm-.13 2.99c.31 0 .62.06.844.178.488.253.888.745 1.04 1.259.464 1.578-1.208 2.96-2.72 2.254h-.015c-.712-.331-1.096-.956-1.104-1.77 0-.733.408-1.371 1.112-1.745.224-.117.534-.176.844-.176zm-.011 4.728c.988-.004 1.706.349 1.97.97.198.464.124 1.932-.218 4.302-.232 1.656-.36 2.074-.68 2.356-.44.39-1.064.498-1.656.288h-.003c-.716-.257-.87-.605-1.164-2.644-.341-2.37-.416-3.838-.218-4.302.262-.616.974-.966 1.97-.97z" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "bilibili") -}}
|
||||||
|
<svg height="32px" width="32px" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||||
|
xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<rect x="1.3333" y="6" width="21.333" height="15.333" rx="4" ry="4" />
|
||||||
|
<path d="m8 12.4v1.2" />
|
||||||
|
<path d="m16 12.4v1.2" />
|
||||||
|
<path d="m5.8853 2.6667 2.6667 2.6667" />
|
||||||
|
<path d="m18.115 2.6667-2.6667 2.6667" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "bitcoin") -}}
|
||||||
|
<svg height="32px" width="32px" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
|
||||||
|
<path
|
||||||
|
d="M23.638 14.904c-1.602 6.43-8.113 10.34-14.542 8.736C2.67 22.05-1.244 15.525.362 9.105 1.962 2.67 8.475-1.243 14.9.358c6.43 1.605 10.342 8.115 8.738 14.548v-.002zm-6.35-4.613c.24-1.59-.974-2.45-2.64-3.03l.54-2.153-1.315-.33-.525 2.107c-.345-.087-.705-.167-1.064-.25l.526-2.127-1.32-.33-.54 2.165c-.285-.067-.565-.132-.84-.2l-1.815-.45-.35 1.407s.975.225.955.236c.535.136.63.486.615.766l-1.477 5.92c-.075.166-.24.406-.614.314.015.02-.96-.24-.96-.24l-.66 1.51 1.71.426.93.242-.54 2.19 1.32.327.54-2.17c.36.1.705.19 1.05.273l-.51 2.154 1.32.33.545-2.19c2.24.427 3.93.257 4.64-1.774.57-1.637-.03-2.58-1.217-3.196.854-.193 1.5-.76 1.68-1.93h.01zm-3.01 4.22c-.404 1.64-3.157.75-4.05.53l.72-2.9c.896.23 3.757.67 3.33 2.37zm.41-4.24c-.37 1.49-2.662.735-3.405.55l.654-2.64c.744.18 3.137.524 2.75 2.084v.006z" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "email") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 21" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
|
||||||
|
<polyline points="22,6 12,13 2,6"></polyline>
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "facebook") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "github") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22">
|
||||||
|
</path>
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "gitlab") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M22.65 14.39L12 22.13 1.35 14.39a.84.84 0 0 1-.3-.94l1.22-3.78 2.44-7.51A.42.42 0 0 1 4.82 2a.43.43 0 0 1 .58 0 .42.42 0 0 1 .11.18l2.44 7.49h8.1l2.44-7.51A.42.42 0 0 1 18.6 2a.43.43 0 0 1 .58 0 .42.42 0 0 1 .11.18l2.44 7.51L23 13.45a.84.84 0 0 1-.35.94z">
|
||||||
|
</path>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "instagram") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect>
|
||||||
|
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path>
|
||||||
|
<line x1="17.5" y1="6.5" x2="17.5" y2="6.5"></line>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "linkedin") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path>
|
||||||
|
<rect x="2" y="9" width="4" height="12"></rect>
|
||||||
|
<circle cx="4" cy="4" r="2"></circle>
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "mastodon") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M21.58 13.913c-.29 1.469-2.592 3.121-5.238 3.396-1.379.184-2.737.368-4.185.276-2.368-.092-4.237-.551-4.237-.551 0 .184.014.459.043.643.308 2.294 2.317 2.478 4.22 2.57 1.922 0 3.633-.46 3.633-.46l.079 1.653s-1.344.734-3.738.918c-1.32.091-2.96-.092-4.869-.551-4.14-1.102-4.853-5.507-4.961-10.005-.034-1.285-.013-2.57-.013-3.58 0-4.589 3-5.966 3-5.966 1.513-.734 4.11-1.01 6.808-1.01h.067c2.699 0 5.296.276 6.81 1.01 0 0 3 1.377 3 5.967 0 0 .037 3.304-.419 5.69"
|
||||||
|
stroke="currentColor" />
|
||||||
|
<path
|
||||||
|
d="M17.832 8.633v5h-1.978V8.78c0-1.023-.43-1.542-1.29-1.542-.95 0-1.427.616-1.427 1.834v2.655H11.17V9.072c0-1.218-.476-1.834-1.427-1.834-.86 0-1.29.52-1.29 1.542v4.852H6.475V8.633c0-1.022.26-1.834.782-2.434.538-.6 1.243-.909 2.118-.909 1.012 0 1.779.39 2.286 1.169l.492.827.493-.827c.507-.78 1.274-1.169 2.286-1.169.875 0 1.58.308 2.118.909.522.6.782 1.412.782 2.434"
|
||||||
|
fill="currentColor" stroke="none" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "medium") -}}
|
||||||
|
<svg height="32px" width="32px" version="1.0" xmlns="http://www.w3.org/2000/svg" fill="currentColor" stroke-width="2"
|
||||||
|
viewBox="0 0 76.000000 76.000000" preserveAspectRatio="xMidYMid meet">
|
||||||
|
<g transform="translate(0.000000,76.000000) scale(0.100000,-0.100000)">
|
||||||
|
<path
|
||||||
|
d="M0 380 l0 -380 380 0 380 0 0 380 0 380 -380 0 -380 0 0 -380z m334 85 c30 -63 57 -115 59 -115 2 0 16 30 31 68 15 37 37 88 49 115 l20 47 76 0 76 -1 -27 -20 -28 -21 0 -151 c0 -150 0 -151 27 -179 l27 -28 -109 0 -109 0 27 28 c26 27 27 32 26 143 0 131 3 134 -71 -58 -24 -62 -48 -113 -53 -113 -6 0 -17 16 -24 35 -7 19 -36 83 -64 142 l-52 108 -3 -98 c-3 -97 -2 -99 28 -133 16 -19 30 -39 30 -44 0 -6 -31 -10 -70 -10 -45 0 -70 4 -70 11 0 6 14 27 30 46 30 33 30 35 30 151 0 116 0 118 -31 155 l-30 37 75 0 76 0 54 -115z" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "paypal") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M7.144 19.532l1.049-5.751c.11-.606.691-1.002 1.304-.948 2.155.192 6.877.1 8.818-4.002 2.554-5.397-.59-7.769-6.295-7.769H7.43a1.97 1.97 0 0 0-1.944 1.655L2.77 19.507a.857.857 0 0 0 .846.994h2.368a1.18 1.18 0 0 0 1.161-.969zM7.967 22.522a.74.74 0 0 0 .666.416h2.313c.492 0 .923-.351 1.003-.837l.759-4.601c.095-.523.597-.866 1.127-.819 1.86.166 5.567-.118 6.85-3.821.554-1.6.705-2.954.408-4.018"
|
||||||
|
style="font-variation-settings:normal" stroke="currentColor" stroke-linejoin="miter" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "peertube") -}}
|
||||||
|
<svg height="32px" width="32px" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
|
||||||
|
<path d="M12 6.545v10.91L20.727 12M3.273 12v12L12 17.455M3.273 0v12L12 6.545" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "phone") -}}
|
||||||
|
<svg height="32px" width="32px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<rect x="9" y="4" width="6" height="1" rx="0.5" fill="currentColor" />
|
||||||
|
<path
|
||||||
|
d="M12 20C12.2652 20 12.5196 19.8946 12.7071 19.7071C12.8946 19.5196 13 19.2652 13 19C13 18.7348 12.8946 18.4804 12.7071 18.2929C12.5196 18.1054 12.2652 18 12 18C11.7348 18 11.4804 18.1054 11.2929 18.2929C11.1054 18.4804 11 18.7348 11 19C11 19.2652 11.1054 19.5196 11.2929 19.7071C11.4804 19.8946 11.7348 20 12 20Z"
|
||||||
|
fill="currentColor" />
|
||||||
|
<rect x="5" y="1" width="14" height="22" rx="2" stroke="currentColor" stroke-width="2" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "qq") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path transform="scale(0.04) translate(75 40)" stroke-width="50"
|
||||||
|
d="M433.754 420.445c-11.526 1.393-44.86-52.741-44.86-52.741 0 31.345-16.136 72.247-51.051 101.786 16.842 5.192 54.843 19.167 45.803 34.421-7.316 12.343-125.51 7.881-159.632 4.037-34.122 3.844-152.316 8.306-159.632-4.037-9.045-15.25 28.918-29.214 45.783-34.415-34.92-29.539-51.059-70.445-51.059-101.792 0 0-33.334 54.134-44.859 52.741-5.37-.65-12.424-29.644 9.347-99.704 10.261-33.024 21.995-60.478 40.144-105.779C60.683 98.063 108.982.006 224 0c113.737.006 163.156 96.133 160.264 214.963 18.118 45.223 29.912 72.85 40.144 105.778 21.768 70.06 14.716 99.053 9.346 99.704z">
|
||||||
|
</path>
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "reddit") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none" stroke-width="1">
|
||||||
|
<path
|
||||||
|
d="M24 11.779c0-1.459-1.192-2.645-2.657-2.645-.715 0-1.363.286-1.84.746-1.81-1.191-4.259-1.949-6.971-2.046l1.483-4.669 4.016.941-.006.058c0 1.193.975 2.163 2.174 2.163 1.198 0 2.172-.97 2.172-2.163s-.975-2.164-2.172-2.164c-.92 0-1.704.574-2.021 1.379l-4.329-1.015c-.189-.046-.381.063-.44.249l-1.654 5.207c-2.838.034-5.409.798-7.3 2.025-.474-.438-1.103-.712-1.799-.712-1.465 0-2.656 1.187-2.656 2.646 0 .97.533 1.811 1.317 2.271-.052.282-.086.567-.086.857 0 3.911 4.808 7.093 10.719 7.093s10.72-3.182 10.72-7.093c0-.274-.029-.544-.075-.81.832-.447 1.405-1.312 1.405-2.318zm-17.224 1.816c0-.868.71-1.575 1.582-1.575.872 0 1.581.707 1.581 1.575s-.709 1.574-1.581 1.574-1.582-.706-1.582-1.574zm9.061 4.669c-.797.793-2.048 1.179-3.824 1.179l-.013-.003-.013.003c-1.777 0-3.028-.386-3.824-1.179-.145-.144-.145-.379 0-.523.145-.145.381-.145.526 0 .65.647 1.729.961 3.298.961l.013.003.013-.003c1.569 0 2.648-.315 3.298-.962.145-.145.381-.144.526 0 .145.145.145.379 0 .524zm-.189-3.095c-.872 0-1.581-.706-1.581-1.574 0-.868.709-1.575 1.581-1.575s1.581.707 1.581 1.575-.709 1.574-1.581 1.574z" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "rss") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M4 11a9 9 0 0 1 9 9" />
|
||||||
|
<path d="M4 4a16 16 0 0 1 16 16" />
|
||||||
|
<circle cx="5" cy="19" r="1" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "slack") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M22.08 9C19.81 1.41 16.54-.35 9 1.92S-.35 7.46 1.92 15 7.46 24.35 15 22.08 24.35 16.54 22.08 9z"></path>
|
||||||
|
<line x1="12.57" y1="5.99" x2="16.15" y2="16.39"></line>
|
||||||
|
<line x1="7.85" y1="7.61" x2="11.43" y2="18.01"></line>
|
||||||
|
<line x1="16.39" y1="7.85" x2="5.99" y2="11.43"></line>
|
||||||
|
<line x1="18.01" y1="12.57" x2="7.61" y2="16.15"></line>
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "snapchat") -}}
|
||||||
|
<svg height="32px" width="32px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
|
||||||
|
<path
|
||||||
|
d="M12.206.793c.99 0 4.347.276 5.93 3.821.529 1.193.403 3.219.299 4.847l-.003.06c-.012.18-.022.345-.03.51.075.045.203.09.401.09.3-.016.659-.12 1.033-.301.165-.088.344-.104.464-.104.182 0 .359.029.509.09.45.149.734.479.734.838.015.449-.39.839-1.213 1.168-.089.029-.209.075-.344.119-.45.135-1.139.36-1.333.81-.09.224-.061.524.12.868l.015.015c.06.136 1.526 3.475 4.791 4.014.255.044.435.27.42.509 0 .075-.015.149-.045.225-.24.569-1.273.988-3.146 1.271-.059.091-.12.375-.164.57-.029.179-.074.36-.134.553-.076.271-.27.405-.555.405h-.03c-.135 0-.313-.031-.538-.074-.36-.075-.765-.135-1.273-.135-.3 0-.599.015-.913.074-.6.104-1.123.464-1.723.884-.853.599-1.826 1.288-3.294 1.288-.06 0-.119-.015-.18-.015h-.149c-1.468 0-2.427-.675-3.279-1.288-.599-.42-1.107-.779-1.707-.884-.314-.045-.629-.074-.928-.074-.54 0-.958.089-1.272.149-.211.043-.391.074-.54.074-.374 0-.523-.224-.583-.42-.061-.192-.09-.389-.135-.567-.046-.181-.105-.494-.166-.57-1.918-.222-2.95-.642-3.189-1.226-.031-.063-.052-.15-.055-.225-.015-.243.165-.465.42-.509 3.264-.54 4.73-3.879 4.791-4.02l.016-.029c.18-.345.224-.645.119-.869-.195-.434-.884-.658-1.332-.809-.121-.029-.24-.074-.346-.119-1.107-.435-1.257-.93-1.197-1.273.09-.479.674-.793 1.168-.793.146 0 .27.029.383.074.42.194.789.3 1.104.3.234 0 .384-.06.465-.105l-.046-.569c-.098-1.626-.225-3.651.307-4.837C7.392 1.077 10.739.807 11.727.807l.419-.015h.06z" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "spotify") -}}
|
||||||
|
<svg height="32px" width="32px" fill="currentColor" stoke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path
|
||||||
|
d="M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.599-1.559.3z" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "stackoverflow") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M2.913 16.041v6.848h17.599v-6.848M7.16 18.696h8.925M7.65 13.937l8.675 1.8M9.214 9.124l8.058 3.758M12.086 4.65l6.849 5.66M15.774 1.111l5.313 7.162" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "steam") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none">
|
||||||
|
<path
|
||||||
|
d="M11.979 0C5.678 0 .511 4.86.022 11.037l6.432 2.658c.545-.371 1.203-.59 1.912-.59.063 0 .125.004.188.006l2.861-4.142V8.91c0-2.495 2.028-4.524 4.524-4.524 2.494 0 4.524 2.031 4.524 4.527s-2.03 4.525-4.524 4.525h-.105l-4.076 2.911c0 .052.004.105.004.159 0 1.875-1.515 3.396-3.39 3.396-1.635 0-3.016-1.173-3.331-2.727L.436 15.27C1.862 20.307 6.486 24 11.979 24c6.627 0 11.999-5.373 11.999-12S18.605 0 11.979 0zM7.54 18.21l-1.473-.61c.262.543.714.999 1.314 1.25 1.297.539 2.793-.076 3.332-1.375.263-.63.264-1.319.005-1.949s-.75-1.121-1.377-1.383c-.624-.26-1.29-.249-1.878-.03l1.523.63c.956.4 1.409 1.5 1.009 2.455-.397.957-1.497 1.41-2.454 1.012H7.54zm11.415-9.303c0-1.662-1.353-3.015-3.015-3.015-1.665 0-3.015 1.353-3.015 3.015 0 1.665 1.35 3.015 3.015 3.015 1.663 0 3.015-1.35 3.015-3.015zm-5.273-.005c0-1.252 1.013-2.266 2.265-2.266 1.249 0 2.266 1.014 2.266 2.266 0 1.251-1.017 2.265-2.266 2.265-1.253 0-2.265-1.014-2.265-2.265z" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "telegram") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M21.198 2.433a2.242 2.242 0 0 0-1.022.215l-8.609 3.33c-2.068.8-4.133 1.598-5.724 2.21a405.15 405.15 0 0 1-2.849 1.09c-.42.147-.99.332-1.473.901-.728.968.193 1.798.919 2.286 1.61.516 3.275 1.009 4.654 1.472.509 1.793.997 3.592 1.48 5.388.16.36.506.494.864.498l-.002.018s.281.028.555-.038a2.1 2.1 0 0 0 .933-.517c.345-.324 1.28-1.244 1.811-1.764l3.999 2.952.032.018s.442.311 1.09.355c.324.022.75-.04 1.116-.308.37-.27.613-.702.728-1.196.342-1.492 2.61-12.285 2.997-14.072l-.01.042c.27-1.006.17-1.928-.455-2.474a1.654 1.654 0 0 0-1.034-.407z" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "tiktok") -}}
|
||||||
|
<svg height="32px" width="32px" version="1.0" xmlns="http://www.w3.org/2000/svg" fill="currentColor" stroke-width="2"
|
||||||
|
viewBox="0 0 76.000000 76.000000" preserveAspectRatio="xMidYMid meet">
|
||||||
|
<path d="M65.9,19.4c1.4,0.2,2.8,0.1,2.8,0.1s0,6.2,0,12.2c-6.3,0-12.1-2-16.8-5.4V51c0.1,20-24.6,29.8-38.3,15.6
|
||||||
|
c-14.7-15.1-2.1-40.5,19-37.7v12.3c-9.5-3-17.2,8-11.2,15.9c5.8,7.7,18.3,3.6,18.3-6.1c0,0,0-48.2,0-48.2c2.4,0,9.9,0,12.2,0v1.6
|
||||||
|
c0.7,7.4,6.1,13.4,13.3,15v0C65.4,19.3,65.6,19.4,65.9,19.4z" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "twitter") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z">
|
||||||
|
</path>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "youtube") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z">
|
||||||
|
</path>
|
||||||
|
<polygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"></polygon>
|
||||||
|
</svg>
|
||||||
|
{{- else if $icon_name -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path>
|
||||||
|
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path>
|
||||||
|
</svg>
|
||||||
|
{{- end -}}
|
||||||
34
layouts/partials/toc.html
Normal file
34
layouts/partials/toc.html
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
{{- $toc := .TableOfContents -}}
|
||||||
|
{{- if $toc -}}
|
||||||
|
<!-- When the $toc variable is not empty, generate the table of contents for the article -->
|
||||||
|
<div class="post-toc">
|
||||||
|
{{ if and (gt .WordCount 80) (.Params.toc | default true) }}
|
||||||
|
<aside>
|
||||||
|
<button id="tocButton" ><h4 id="contents" style="margin-left: 1vw;color:rgb(96, 134, 180);margin-bottom: 0;">CONTENTS</h4></button>
|
||||||
|
<div id="hide">
|
||||||
|
{{- $toc := replaceRE `<ul>\n<li>\n<ul>` `<ul>` $toc -}}
|
||||||
|
{{- safeHTML $toc -}}
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
{{- end -}}
|
||||||
|
<script>
|
||||||
|
// document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
let button = document.getElementById('tocButton');
|
||||||
|
let hide = document.getElementById("hide");
|
||||||
|
let contents=document.getElementById("contents");
|
||||||
|
button.addEventListener("click", function() {
|
||||||
|
if (hide.style.display!='block') {
|
||||||
|
hide.style.display='block'
|
||||||
|
} else {
|
||||||
|
hide.style.display='none'
|
||||||
|
contents.style.color='rgb(96, 134, 180)'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
// });
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
32
layouts/post/list.html
Normal file
32
layouts/post/list.html
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<div class="container">
|
||||||
|
<div class="section">
|
||||||
|
<div class="content">
|
||||||
|
<h1 class="h1-title">Archives</h1>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="archive-container column is-centered">
|
||||||
|
<div class="archive">
|
||||||
|
|
||||||
|
{{ range (where (where site.RegularPages "Type" "in" site.Params.mainSections) ".Params.draft" "!=" true).GroupByDate "2006" }}
|
||||||
|
<h2 class="archive-title">{{ .Key }}</h2>
|
||||||
|
{{ range .Pages }}
|
||||||
|
{{/* {{ range .Paginators.Pages }} */}}
|
||||||
|
|
||||||
|
<article class="archive-item">
|
||||||
|
<a href="{{ .Permalink }}" class="archive-item-link hover-underline-animation">{{ .Title }}</a>
|
||||||
|
<span class="archive-item-date">
|
||||||
|
{{ .Date.Format "January 2, 2006" }}
|
||||||
|
</span>
|
||||||
|
|
||||||
|
</article>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
{{ end }}
|
||||||
144
layouts/post/single.html
Normal file
144
layouts/post/single.html
Normal file
@ -0,0 +1,144 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
{{ if .Params.protected }}
|
||||||
|
<div id="verification">
|
||||||
|
<!-- Show password entry box -->
|
||||||
|
<div id="secret-word">Unlock it!</div>
|
||||||
|
<form id="password-form" onsubmit="checkPassword(); return false;">
|
||||||
|
<input type="password" name="password" id="password" placeholder="Please enter password" required>
|
||||||
|
<input type="hidden" name="encryptedPassword" id="encrypted-password">
|
||||||
|
<input type="submit" value="Submit" name="submit" id="submit">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
<!-- Display unencrypted diary contents -->
|
||||||
|
<div class="single-container {{ if .Params.protected }}hidden{{ end }}">
|
||||||
|
<div class="archive">
|
||||||
|
<h1 class="title is-1">{{ .Title }}</h1>
|
||||||
|
<div class="title subtitle heading is-6">
|
||||||
|
<div class="author-info columns is-vcentered">
|
||||||
|
<div class="column">
|
||||||
|
<div class="columns is-vcentered is-mobile">
|
||||||
|
{{ with .Site.Params.authorImage }}
|
||||||
|
<div class="column is-narrow">
|
||||||
|
<img src="{{ . }}" class="author-image">
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
<div class="column">
|
||||||
|
<p>{{ .Site.Params.Author }}</p>
|
||||||
|
<p><time>{{ .PublishDate.Format "January 2, 2006" }}</time>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="small-categories-container">
|
||||||
|
{{ range $idx, $category := .Params.categories }}
|
||||||
|
{{- if ne $idx 0 }}, {{ end }}<a href="{{ " categories/" | relURL }}{{ $category | urlize }}">{{
|
||||||
|
$category }}</a>
|
||||||
|
{{- end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content article-content">
|
||||||
|
<div class="toc-container">
|
||||||
|
{{ partial "toc.html" . }}
|
||||||
|
</div>
|
||||||
|
{{ .Content }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a href="#" id="scrollToTopButton">
|
||||||
|
<svg t="1686753152588" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||||
|
p-id="3988" width="48" height="48">
|
||||||
|
<path
|
||||||
|
d="M518.5 360.3c-3.2-4.4-9.7-4.4-12.9 0l-178 246c-3.8 5.3 0 12.7 6.5 12.7H381c10.2 0 19.9-4.9 25.9-13.2L512 460.4l105.2 145.4c6 8.3 15.6 13.2 25.9 13.2H690c6.5 0 10.3-7.4 6.5-12.7l-178-246z"
|
||||||
|
p-id="3989" fill="#FAB005"></path>
|
||||||
|
<path
|
||||||
|
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64z m0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
|
||||||
|
p-id="3990" fill="#FAB005"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
{{- /* Comment */ -}}
|
||||||
|
{{- partial "comment.html" . -}}
|
||||||
|
<div class="pp-container">
|
||||||
|
<section class="pre-and-post">
|
||||||
|
<div class="has-text-left">
|
||||||
|
{{ with .PrevInSection }}
|
||||||
|
<p>Previous post</p>
|
||||||
|
<a href="{{ .Permalink }}">{{ .Title }}</a>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
<div class="has-text-right">
|
||||||
|
{{ with .NextInSection }}
|
||||||
|
<p>Next post</p>
|
||||||
|
<a href="{{ .Permalink }}">{{ .Title }}</a>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<script></script>
|
||||||
|
<script>
|
||||||
|
// Quickly reach the top of the article
|
||||||
|
document.getElementById('scrollToTopButton').addEventListener('click', function () {
|
||||||
|
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||||||
|
});
|
||||||
|
console.log('window.matchMedia("(max-width: 768px)").matches', window.matchMedia("(max-width: 768px)").matches)
|
||||||
|
//Set the element to be displayed on mobile only when the mouse is scrolled up, not when it is scrolled down
|
||||||
|
// if (window.matchMedia("(max-width: 768px)").matches) {
|
||||||
|
// var prevScrollPos = window.pageYOffset;
|
||||||
|
|
||||||
|
// window.addEventListener('scroll', function () {
|
||||||
|
// var currentScrollPos = window.pageYOffset;
|
||||||
|
|
||||||
|
// if (currentScrollPos < prevScrollPos) {
|
||||||
|
// document.querySelector('#scrollToTopButton').style.display = 'block';
|
||||||
|
// } else {
|
||||||
|
// document.querySelector('#scrollToTopButton').style.display = 'none';
|
||||||
|
// }
|
||||||
|
|
||||||
|
// prevScrollPos = currentScrollPos;
|
||||||
|
// });
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// Set the mobile SUBMIT width to the width of the input box
|
||||||
|
const passwordInput = document.querySelector("#password");
|
||||||
|
const submitButton = document.querySelector("#submit");
|
||||||
|
passwordInput.style.width = (passwordInput.scrollWidth) + "px";
|
||||||
|
submitButton.style.width = window.getComputedStyle(passwordInput).width;
|
||||||
|
|
||||||
|
window.addEventListener('DOMContentLoaded', () => {
|
||||||
|
const submitButton = document.getElementById('submit');
|
||||||
|
submitButton.addEventListener('click', function (event) {
|
||||||
|
event.preventDefault(); // Blocking the default form submission behavior
|
||||||
|
checkPassword();
|
||||||
|
});
|
||||||
|
|
||||||
|
function checkPassword() {
|
||||||
|
const passwordInput = document.querySelector('input[name="password"]');
|
||||||
|
const password = passwordInput.value;
|
||||||
|
const correctPassword = "{{ .Params.password }}"; // Get the correct password from the article's meta information
|
||||||
|
|
||||||
|
if (password === correctPassword) {
|
||||||
|
// Password verification successful, display the original content
|
||||||
|
document.getElementById("verification").style.display = "none";
|
||||||
|
document.querySelector(".single-container").classList.remove('hidden');
|
||||||
|
//Hide password parameters
|
||||||
|
hidePasswordFromURL()
|
||||||
|
} else {
|
||||||
|
// Password verification failed, error message displayed
|
||||||
|
alert("Incorrect password. Please try again.");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function hidePasswordFromURL() {
|
||||||
|
const urlParams = new URLSearchParams(window.location.search);
|
||||||
|
urlParams.set('password', '******');
|
||||||
|
const newURL = window.location.pathname + '?' + urlParams.toString();
|
||||||
|
window.history.replaceState({}, '', newURL);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
{{ end }}
|
||||||
2
layouts/shortcodes/rawhtml.html
Normal file
2
layouts/shortcodes/rawhtml.html
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
<!-- raw html -->
|
||||||
|
{{.Inner}}
|
||||||
BIN
static/images/hopeless-cloud.png
Normal file
BIN
static/images/hopeless-cloud.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 775 B |
180
static/js/fastsearch.js
Normal file
180
static/js/fastsearch.js
Normal file
@ -0,0 +1,180 @@
|
|||||||
|
var fuse; // holds our search engine
|
||||||
|
var fuseIndex;
|
||||||
|
var searchVisible = false;
|
||||||
|
var firstRun = true; // allow us to delay loading json data unless search activated
|
||||||
|
var list = document.getElementById('searchResults'); // targets the <ul>
|
||||||
|
var first = list.firstChild; // first child of search list
|
||||||
|
var last = list.lastChild; // last child of search list
|
||||||
|
var maininput = document.getElementById('searchInput'); // input box for search
|
||||||
|
var resultsAvailable = false; // Did we get any search results?
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// The main keyboard event listener running the show
|
||||||
|
//
|
||||||
|
document.addEventListener('keydown', function(event) {
|
||||||
|
|
||||||
|
// CMD-/ to show / hide Search
|
||||||
|
if (event.altKey && event.which === 191) {
|
||||||
|
// Load json search index if first time invoking search
|
||||||
|
// Means we don't load json unless searches are going to happen; keep user payload small unless needed
|
||||||
|
doSearch(event)
|
||||||
|
}
|
||||||
|
|
||||||
|
// Allow ESC (27) to close search box
|
||||||
|
if (event.keyCode == 27) {
|
||||||
|
if (searchVisible) {
|
||||||
|
document.getElementById("fastSearch").style.visibility = "hidden";
|
||||||
|
document.activeElement.blur();
|
||||||
|
searchVisible = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// DOWN (40) arrow
|
||||||
|
if (event.keyCode == 40) {
|
||||||
|
if (searchVisible && resultsAvailable) {
|
||||||
|
console.log("down");
|
||||||
|
event.preventDefault(); // stop window from scrolling
|
||||||
|
if ( document.activeElement == maininput) { first.focus(); } // if the currently focused element is the main input --> focus the first <li>
|
||||||
|
else if ( document.activeElement == last ) { last.focus(); } // if we're at the bottom, stay there
|
||||||
|
else { document.activeElement.parentElement.nextSibling.firstElementChild.focus(); } // otherwise select the next search result
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// UP (38) arrow
|
||||||
|
if (event.keyCode == 38) {
|
||||||
|
if (searchVisible && resultsAvailable) {
|
||||||
|
event.preventDefault(); // stop window from scrolling
|
||||||
|
if ( document.activeElement == maininput) { maininput.focus(); } // If we're in the input box, do nothing
|
||||||
|
else if ( document.activeElement == first) { maininput.focus(); } // If we're at the first item, go to input box
|
||||||
|
else { document.activeElement.parentElement.previousSibling.firstElementChild.focus(); } // Otherwise, select the search result above the current active one
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// execute search as each character is typed
|
||||||
|
//
|
||||||
|
document.getElementById("searchInput").onkeyup = function(e) {
|
||||||
|
executeSearch(this.value);
|
||||||
|
}
|
||||||
|
|
||||||
|
document.querySelector("body").onclick = function(e) {
|
||||||
|
if (e.target.tagName === 'BODY' || e.target.tagName === 'DIV') {
|
||||||
|
hideSearch()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.querySelector("#search-btn").onclick = function(e) {
|
||||||
|
doSearch(e)
|
||||||
|
}
|
||||||
|
|
||||||
|
function doSearch(e) {
|
||||||
|
e.stopPropagation();
|
||||||
|
if (firstRun) {
|
||||||
|
loadSearch() // loads our json data and builds fuse.js search index
|
||||||
|
firstRun = false // let's never do this again
|
||||||
|
}
|
||||||
|
// Toggle visibility of search box
|
||||||
|
if (!searchVisible) {
|
||||||
|
showSearch() // search visible
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
hideSearch()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function hideSearch() {
|
||||||
|
document.getElementById("fastSearch").style.visibility = "hidden" // hide search box
|
||||||
|
document.activeElement.blur() // remove focus from search box
|
||||||
|
searchVisible = false
|
||||||
|
}
|
||||||
|
|
||||||
|
function showSearch() {
|
||||||
|
document.getElementById("fastSearch").style.visibility = "visible" // show search box
|
||||||
|
document.getElementById("searchInput").focus() // put focus in input box so you can just start typing
|
||||||
|
searchVisible = true
|
||||||
|
}
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// fetch some json without jquery
|
||||||
|
//
|
||||||
|
function fetchJSONFile(path, callback) {
|
||||||
|
var httpRequest = new XMLHttpRequest();
|
||||||
|
httpRequest.onreadystatechange = function() {
|
||||||
|
if (httpRequest.readyState === 4) {
|
||||||
|
if (httpRequest.status === 200) {
|
||||||
|
var data = JSON.parse(httpRequest.responseText);
|
||||||
|
if (callback) callback(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
httpRequest.open('GET', path);
|
||||||
|
httpRequest.send();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// load our search index, only executed once
|
||||||
|
// on first call of search box (CMD-/)
|
||||||
|
//
|
||||||
|
function loadSearch() {
|
||||||
|
console.log('loadSearch()')
|
||||||
|
fetchJSONFile('/index.json', function(data){
|
||||||
|
|
||||||
|
var options = { // fuse.js options; check fuse.js website for details
|
||||||
|
shouldSort: true,
|
||||||
|
location: 0,
|
||||||
|
distance: 100,
|
||||||
|
threshold: 0.4,
|
||||||
|
minMatchCharLength: 2,
|
||||||
|
keys: [
|
||||||
|
'permalink',
|
||||||
|
'title',
|
||||||
|
'tags',
|
||||||
|
'contents'
|
||||||
|
]
|
||||||
|
};
|
||||||
|
// Create the Fuse index
|
||||||
|
fuseIndex = Fuse.createIndex(options.keys, data)
|
||||||
|
fuse = new Fuse(data, options, fuseIndex); // build the index from the json file
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// using the index we loaded on CMD-/, run
|
||||||
|
// a search query (for "term") every time a letter is typed
|
||||||
|
// in the search box
|
||||||
|
//
|
||||||
|
function executeSearch(term) {
|
||||||
|
let results = fuse.search(term); // the actual query being run using fuse.js
|
||||||
|
let searchitems = ''; // our results bucket
|
||||||
|
|
||||||
|
if (results.length === 0) { // no results based on what was typed into the input box
|
||||||
|
resultsAvailable = false;
|
||||||
|
searchitems = '';
|
||||||
|
} else { // build our html
|
||||||
|
// console.log(results)
|
||||||
|
permalinks = [];
|
||||||
|
numLimit = 5;
|
||||||
|
for (let item in results) { // only show first 5 results
|
||||||
|
if (item > numLimit) {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
if (permalinks.includes(results[item].item.permalink)) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
// console.log('item: %d, title: %s', item, results[item].item.title)
|
||||||
|
searchitems = searchitems + '<li><a href="' + results[item].item.permalink + '" tabindex="0">' + '<span class="title">' + results[item].item.title + '</span></a></li>';
|
||||||
|
permalinks.push(results[item].item.permalink);
|
||||||
|
}
|
||||||
|
resultsAvailable = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
document.getElementById("searchResults").innerHTML = searchitems;
|
||||||
|
if (results.length > 0) {
|
||||||
|
first = list.firstChild.firstElementChild; // first result container — used for checking against keyboard up/down location
|
||||||
|
last = list.lastChild.firstElementChild; // last result container — used for checking against keyboard up/down location
|
||||||
|
}
|
||||||
|
}
|
||||||
9
static/js/fuse.min.js
vendored
Normal file
9
static/js/fuse.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
3
static/svg/moon.svg
Normal file
3
static/svg/moon.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg id="moon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 268 B |
11
static/svg/sun.svg
Normal file
11
static/svg/sun.svg
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
<svg id="sun" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<circle cx="12" cy="12" r="5"></circle>
|
||||||
|
<line x1="12" y1="1" x2="12" y2="3"></line>
|
||||||
|
<line x1="12" y1="21" x2="12" y2="23"></line>
|
||||||
|
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
|
||||||
|
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
|
||||||
|
<line x1="1" y1="12" x2="3" y2="12"></line>
|
||||||
|
<line x1="21" y1="12" x2="23" y2="12"></line>
|
||||||
|
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
|
||||||
|
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 677 B |
2
themes/JuiceBar/.gitignore
vendored
Normal file
2
themes/JuiceBar/.gitignore
vendored
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
.idea/*
|
||||||
|
*.xml
|
||||||
20
themes/JuiceBar/LICENSE
Normal file
20
themes/JuiceBar/LICENSE
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
The MIT License (MIT)
|
||||||
|
|
||||||
|
Copyright (c) 2022 YOUR_NAME_HERE
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||||
|
this software and associated documentation files (the "Software"), to deal in
|
||||||
|
the Software without restriction, including without limitation the rights to
|
||||||
|
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
||||||
|
the Software, and to permit persons to whom the Software is furnished to do so,
|
||||||
|
subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
||||||
|
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
||||||
|
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
||||||
|
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
||||||
|
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||||
145
themes/JuiceBar/README-zh_CN.md
Normal file
145
themes/JuiceBar/README-zh_CN.md
Normal file
@ -0,0 +1,145 @@
|
|||||||
|
# JuiceBar
|
||||||
|
[English](https://github.com/hotjuicew/hugo-juicebar/tree/master/README.md) | 简体中文
|
||||||
|
|
||||||
|
JuiceBar 是一个简洁、优雅的博客主题，由 [Hugo](https://gohugo.io) 强力驱动。
|
||||||
|
|
||||||
|
这个主题从 PapermMod 和 LoveIt 获得了很多灵感，感谢！
|
||||||
|
|
||||||
|
⭐Demo → [juicebar-demo.add1.dev](https://juicebar-demo.add1.dev)
|
||||||
|
|
||||||
|
---
|
||||||
|
## 预览
|
||||||
|
|
||||||
|
## 特点
|
||||||
|
|
||||||
|
- 主题：根据您的系统偏好或用户选择，**黑/白主题**。
|
||||||
|
- 通过 Hugo 工具轻松修改主题
|
||||||
|
- 完全响应式
|
||||||
|
- 支持社交图标
|
||||||
|
- 一些美丽的 CSS 动画
|
||||||
|
- 易于使用的自扩展目录toc
|
||||||
|
- 自动突出显示代码
|
||||||
|
- 自定义脚本短代码
|
||||||
|
- 支持 [giscus](https://giscus.app/) 评论系统
|
||||||
|
- 简单的文章加密功能（注意，非常不安全，酌情使用）
|
||||||
|
|
||||||
|
## 如何开始
|
||||||
|
|
||||||
|
您可以将主题安装为克隆或子模块。
|
||||||
|
|
||||||
|
我建议使用后者。从您的 Hugo 站点根目录开始，键入以下内容：
|
||||||
|
|
||||||
|
```
|
||||||
|
$ git submodule add https://github.com/hotjuicew/hugo-JuiceBar.git themes/JuiceBar
|
||||||
|
```
|
||||||
|
|
||||||
|
现在，您可以通过更新子模块来获取以后对 hugo-JuiceBar 的更新：
|
||||||
|
|
||||||
|
```
|
||||||
|
$ git submodule update --remote themes/JuiceBar
|
||||||
|
```
|
||||||
|
|
||||||
|
## 如何配置
|
||||||
|
|
||||||
|
该主题不需要任何高级配置。只需复制以下配置文件。
|
||||||
|
`config.toml`
|
||||||
|
```toml
|
||||||
|
baseURL = 'http://example.org/'
|
||||||
|
languageCode = 'en-us'
|
||||||
|
theme = "JuiceBar"
|
||||||
|
title = "your_blog_title"
|
||||||
|
|
||||||
|
[params]
|
||||||
|
author = "your_name"
|
||||||
|
description = "My site description"
|
||||||
|
authorImage = "/images/profile.jpg"
|
||||||
|
paginate = 5
|
||||||
|
Title = "your_blog_title"
|
||||||
|
content = "I'm JuiceBar, nice to meet you(ˊ˘ˋ*)♡"
|
||||||
|
imageUrl = "/images/avatar.jpg"
|
||||||
|
|
||||||
|
# 添加新的社交图标
|
||||||
|
# 更多社交图标可以在JuiceBar\layouts\partials\svg.html中找到
|
||||||
|
[[params.social]]
|
||||||
|
name = "Github"
|
||||||
|
url = "https://github.com/hotjuicew"
|
||||||
|
[[params.social]]
|
||||||
|
name = "telegram"
|
||||||
|
url = "https://t.me/Hotjuice"
|
||||||
|
[[params.social]]
|
||||||
|
name = "twitter"
|
||||||
|
url = "https://twitter.com/hotjuicee"
|
||||||
|
[[params.social]]
|
||||||
|
name = "email"
|
||||||
|
url = "mailto:hotjuicew@outlook.com"
|
||||||
|
[[params.social]]
|
||||||
|
name = "instagram"
|
||||||
|
url = "your_url"
|
||||||
|
[[params.social]]
|
||||||
|
name = "mastodon"
|
||||||
|
url = "your_url"
|
||||||
|
[[params.social]]
|
||||||
|
name = "reddit"
|
||||||
|
url = "your_url"
|
||||||
|
[[params.social]]
|
||||||
|
name = "stackoverflow"
|
||||||
|
url = "your_url"
|
||||||
|
|
||||||
|
[taxonomies]
|
||||||
|
category = "categories"
|
||||||
|
tag = "tags"
|
||||||
|
|
||||||
|
# 添加新的导航链接
|
||||||
|
[[menu.main]]
|
||||||
|
name = "About"
|
||||||
|
url = "/about"
|
||||||
|
[[menu.main]]
|
||||||
|
name = "Blog"
|
||||||
|
url = "/post"
|
||||||
|
[[menu.main]]
|
||||||
|
name = "Categories"
|
||||||
|
url = "/categories"
|
||||||
|
|
||||||
|
# 如果使用giscus评论系统
|
||||||
|
#[params.giscus]
|
||||||
|
#repo = "ENTER REPO HERE"
|
||||||
|
#repoID = "ENTER REPO ID HERE"
|
||||||
|
#category = "ENTER CATEGORY NAME HERE"
|
||||||
|
#categoryID = "ENTER CATEGORY ID HERE"
|
||||||
|
#mapping = "og:title"
|
||||||
|
#reactionsEnabled = "1"
|
||||||
|
#emitMetadata = "0"
|
||||||
|
#inputPosition = "bottom"
|
||||||
|
#lang = "en"
|
||||||
|
#loading = "lazy"
|
||||||
|
|
||||||
|
#用于输出文档的设置（必须的）
|
||||||
|
[outputs]
|
||||||
|
home = ["HTML", "RSS", "JSON"]
|
||||||
|
```
|
||||||
|
|
||||||
|
|
||||||
|
注意：还有更多的配置选项。查看`exampleSite`中的`config.toml`。
|
||||||
|
|
||||||
|
安装后，请查看`themes/hugo-JuiceBar`内部的`exampleSite`文件夹。
|
||||||
|
|
||||||
|
要开始使用，请将`exampleSite`中的`config.toml`文件复制到 Hugo 网站的根目录：
|
||||||
|
|
||||||
|
```
|
||||||
|
$ cp themes/hugo-JuiceBar/exampleSite/config.toml。
|
||||||
|
```
|
||||||
|
|
||||||
|
现在编辑此文件并添加您自己的信息。请注意，有些字段可以省略。
|
||||||
|
|
||||||
|
我建议您使用主题的原型，因此现在删除您站点的`archetypes/default.md`。
|
||||||
|
|
||||||
|
最后，只需运行 `$ hugo new content/about.md` 创建你的 '关于' 页面，以及 `$ hugo new content/post/title.md` 创建你的第一篇博客文章。
|
||||||
|
|
||||||
|
## 如何使用文章保护
|
||||||
|
（注意，仅限于阻止未经授权的访问，但无法防止技术高手或有意攻击的人获取密码或破解密码，酌情使用）
|
||||||
|
只需在帖子的元信息中添加
|
||||||
|
```
|
||||||
|
protected: true
|
||||||
|
password: "xxxxxx"
|
||||||
|
```
|
||||||
|
|
||||||
145
themes/JuiceBar/README.md
Normal file
145
themes/JuiceBar/README.md
Normal file
@ -0,0 +1,145 @@
|
|||||||
|
|
||||||
|
# JuiceBar
|
||||||
|
English | [简体中文](https://github.com/hotjuicew/hugo-juicebar/tree/master/README-zh_CN.md)
|
||||||
|
|
||||||
|
JuiceBar is a concise, elegan blog theme powered by [Hugo](https://gohugo.io).
|
||||||
|
|
||||||
|
This theme drew a lot of inspiration from PapermMod and LoveIt, and credit is due to their excellent work.
|
||||||
|
|
||||||
|
⭐Demo → [juicebar-demo.add1.dev](https://juicebar-demo.add1.dev)
|
||||||
|
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
## Overview
|
||||||
|
|
||||||
|
|
||||||
|
## Features
|
||||||
|
|
||||||
|
- Theming: **dark/light mode**, depending on your system preferences or the users choice
|
||||||
|
- An easy way to modify the theme with Hugo tooling
|
||||||
|
- Fully responsive
|
||||||
|
- Support for social icons
|
||||||
|
- Some beautiful CSS animations
|
||||||
|
- Easy-to-use and self-expanding table of contents
|
||||||
|
- Automatically highlighting code
|
||||||
|
- Custom script shortcode
|
||||||
|
- [giscus](https://giscus.app/) comment system supported by giscus
|
||||||
|
- Simple Article Encryption Feature (Note: Highly insecure, use with caution)
|
||||||
|
## How to start
|
||||||
|
|
||||||
|
|
||||||
|
You can install the theme either as a clone or submodule.
|
||||||
|
|
||||||
|
I recommend the latter. From the root of your Hugo site, type the following:
|
||||||
|
|
||||||
|
```
|
||||||
|
$ git submodule add https://github.com/hotjuicew/hugo-JuiceBar.git themes/JuiceBar
|
||||||
|
```
|
||||||
|
|
||||||
|
Now you can get updates to hugo-JuiceBar in the future by updating the submodule:
|
||||||
|
|
||||||
|
```
|
||||||
|
$ git submodule update --remote themes/JuiceBar
|
||||||
|
```
|
||||||
|
## How to configure
|
||||||
|
|
||||||
|
The theme doesn't require any advanced configuration. Just copy the following config file.
|
||||||
|
|
||||||
|
`config.toml`
|
||||||
|
```toml
|
||||||
|
baseURL = 'http://example.org/'
|
||||||
|
languageCode = 'en-us'
|
||||||
|
theme = "JuiceBar"
|
||||||
|
title = "your_blog_title"
|
||||||
|
|
||||||
|
[params]
|
||||||
|
author = "your_name"
|
||||||
|
description = "My site description"
|
||||||
|
authorImage = "/images/profile.jpg"
|
||||||
|
paginate = 5
|
||||||
|
Title = "your_blog_title"
|
||||||
|
content = "I'm JuiceBar, nice to meet you(ˊ˘ˋ*)♡"
|
||||||
|
imageUrl = "/images/avatar.jpg"
|
||||||
|
|
||||||
|
# To add a new social icon
|
||||||
|
# More social icons can be found in JuiceBar\layouts\partials\svg.html.
|
||||||
|
[[params.social]]
|
||||||
|
name = "Github"
|
||||||
|
url = "https://github.com/hotjuicew"
|
||||||
|
[[params.social]]
|
||||||
|
name = "telegram"
|
||||||
|
url = "https://t.me/Hotjuice"
|
||||||
|
[[params.social]]
|
||||||
|
name = "twitter"
|
||||||
|
url = "https://twitter.com/hotjuicee"
|
||||||
|
[[params.social]]
|
||||||
|
name = "email"
|
||||||
|
url = "mailto:hotjuicew@outlook.com"
|
||||||
|
[[params.social]]
|
||||||
|
name = "instagram"
|
||||||
|
url = "your_url"
|
||||||
|
[[params.social]]
|
||||||
|
name = "mastodon"
|
||||||
|
url = "your_url"
|
||||||
|
[[params.social]]
|
||||||
|
name = "reddit"
|
||||||
|
url = "your_url"
|
||||||
|
[[params.social]]
|
||||||
|
name = "stackoverflow"
|
||||||
|
url = "your_url"
|
||||||
|
|
||||||
|
[taxonomies]
|
||||||
|
category = "categories"
|
||||||
|
tag = "tags"
|
||||||
|
|
||||||
|
# To add a new navigation link
|
||||||
|
[[menu.main]]
|
||||||
|
name = "About"
|
||||||
|
url = "/about"
|
||||||
|
[[menu.main]]
|
||||||
|
name = "Blog"
|
||||||
|
url = "/post"
|
||||||
|
[[menu.main]]
|
||||||
|
name = "Categories"
|
||||||
|
url = "/categories"
|
||||||
|
|
||||||
|
# If using the giscus commenting system
|
||||||
|
#[params.giscus]
|
||||||
|
#repo = "ENTER REPO HERE"
|
||||||
|
#repoID = "ENTER REPO ID HERE"
|
||||||
|
#category = "ENTER CATEGORY NAME HERE"
|
||||||
|
#categoryID = "ENTER CATEGORY ID HERE"
|
||||||
|
#mapping = "og:title"
|
||||||
|
#reactionsEnabled = "1"
|
||||||
|
#emitMetadata = "0"
|
||||||
|
#inputPosition = "bottom"
|
||||||
|
#lang = "en"
|
||||||
|
#loading = "lazy"
|
||||||
|
|
||||||
|
# Used for outputting the documentation (required).
|
||||||
|
[outputs]
|
||||||
|
home = ["HTML", "RSS", "JSON"]
|
||||||
|
```
|
||||||
|
Note: There are more options to configure. Take a look into the `config.toml` in `exampleSite`.
|
||||||
|
|
||||||
|
After installation, take a look at the `exampleSite` folder inside `themes/hugo-JuiceBar`.
|
||||||
|
|
||||||
|
To get started, copy the `config.toml` file inside `exampleSite` to the root of your Hugo site:
|
||||||
|
|
||||||
|
```
|
||||||
|
$ cp themes/hugo-JuiceBar/exampleSite/config.toml .
|
||||||
|
```
|
||||||
|
Now edit this file and add your own information. Note that some fields can be omitted.
|
||||||
|
|
||||||
|
I recommend you use the theme's archetypes so now delete your site's `archetypes/default.md`.
|
||||||
|
|
||||||
|
Finally, just run `$ hugo new content/about.md` to create your 'About' page, and `$ hugo new content/post/title.md` to create your first blog post.
|
||||||
|
|
||||||
|
## How to Use Article Protection
|
||||||
|
(Please note that password protection is intended to prevent unauthorized access only and may not be effective against skilled individuals or deliberate attacks. Use it accordingly.)
|
||||||
|
Simply add to the meta information of the post
|
||||||
|
```
|
||||||
|
protected: true
|
||||||
|
password: "xxxxxx"
|
||||||
|
```
|
||||||
|
|
||||||
6
themes/JuiceBar/archetypes/default.md
Normal file
6
themes/JuiceBar/archetypes/default.md
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
---
|
||||||
|
title: "{{ replace .Name "-" " " | title }}"
|
||||||
|
date: {{ .Date }}
|
||||||
|
categories: []
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
8
themes/JuiceBar/assets/scss/_about.scss
Normal file
8
themes/JuiceBar/assets/scss/_about.scss
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
.about-content {
|
||||||
|
font-size: 1rem;
|
||||||
|
margin: 2rem 0;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
13
themes/JuiceBar/assets/scss/_archive.scss
Normal file
13
themes/JuiceBar/assets/scss/_archive.scss
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
@import "variables";
|
||||||
|
.archive {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
line-height: 1.3em;
|
||||||
|
text-align: left;
|
||||||
|
color: #111;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .archive {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
9
themes/JuiceBar/assets/scss/_footer.scss
Normal file
9
themes/JuiceBar/assets/scss/_footer.scss
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
@import "variables";
|
||||||
|
.footer {
|
||||||
|
padding: 18px;
|
||||||
|
font-size: $font-size-content;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .footer {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
}
|
||||||
147
themes/JuiceBar/assets/scss/_header.scss
Normal file
147
themes/JuiceBar/assets/scss/_header.scss
Normal file
@ -0,0 +1,147 @@
|
|||||||
|
@import "variables";
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
height: 6vmin;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
height: 6vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-brand {
|
||||||
|
padding: 0px 15px;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
padding: 0;
|
||||||
|
height: 6vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo h1 {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Let the sun icon not be next to the top*/
|
||||||
|
.theme-toggle {
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-menu {
|
||||||
|
background-color: $main-light;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
|
||||||
|
}
|
||||||
|
.dark-mode .navbar-menu {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
height: 100%;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#fastSearch {
|
||||||
|
height: 60%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
#searchInput {
|
||||||
|
height: 100%;
|
||||||
|
flex-shrink: 0
|
||||||
|
}
|
||||||
|
|
||||||
|
#searchResults {
|
||||||
|
position: relative;
|
||||||
|
margin-top: 10px;
|
||||||
|
display: inline-block;
|
||||||
|
border-radius: 5px;
|
||||||
|
|
||||||
|
li {
|
||||||
|
background-color: $main-light;
|
||||||
|
padding-left: 1rem;
|
||||||
|
border-bottom: 1px solid $main-black;
|
||||||
|
border-left: 1px solid $main-black;
|
||||||
|
border-right: 1px solid $main-black;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: $main-grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
border-top: 1px solid $main-black;
|
||||||
|
border-top-left-radius: 5px;
|
||||||
|
border-top-right-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
border-bottom-left-radius: 5px;
|
||||||
|
border-bottom-right-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a .title {
|
||||||
|
text-decoration: none;
|
||||||
|
/*display: block;*/
|
||||||
|
font-size: $font-size-content;
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-item {
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.dark-mode {
|
||||||
|
.navbar.is-light {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
.navbar-menu{
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
.navbar-brand > .navbar-item {
|
||||||
|
color: $dark-font;
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-start > .navbar-item {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.dark-mode #searchResults li {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
border-bottom: 1px solid $dark-font;
|
||||||
|
border-left: 1px solid $dark-font;
|
||||||
|
border-right: 1px solid $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode #searchResults li:first-child {
|
||||||
|
border-top: 1px solid $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode #searchResults li:hover {
|
||||||
|
color: $dark-font;
|
||||||
|
background-color: $dark-background;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .navbar.is-light .navbar-burger {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
.dark-mode .navbar.is-light .navbar-brand > a.navbar-item:hover, .dark-mode .navbar.is-light .navbar-start > a.navbar-item:hover {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
94
themes/JuiceBar/assets/scss/_index.scss
Normal file
94
themes/JuiceBar/assets/scss/_index.scss
Normal file
@ -0,0 +1,94 @@
|
|||||||
|
@import "variables";
|
||||||
|
|
||||||
|
#home-box {
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
#home-title {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.description {
|
||||||
|
text-align: center;
|
||||||
|
font-size: $font-size-content;
|
||||||
|
}
|
||||||
|
|
||||||
|
.typewriter-effect {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
.text {
|
||||||
|
max-width: 0;
|
||||||
|
text-transform: capitalize;
|
||||||
|
animation: typing 3s steps(var(--characters)) infinite;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
content: " |";
|
||||||
|
animation: blink 1s infinite;
|
||||||
|
animation-timing-function: step-end;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//Override bulma's style
|
||||||
|
.avatar-container {
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
.author-avatar {
|
||||||
|
object-fit: cover;
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 10rem;
|
||||||
|
height: 10rem;
|
||||||
|
text-align: center;
|
||||||
|
margin: 2rem auto 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.social-icon {
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
|
||||||
|
span {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
svg {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/*Typewriter effect*/
|
||||||
|
@keyframes typing {
|
||||||
|
75%,
|
||||||
|
100% {
|
||||||
|
max-width: calc(var(--characters) * 1ch);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes blink {
|
||||||
|
0%,
|
||||||
|
75%,
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
25% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Rewrite some of bulma's styles */
|
||||||
|
.navbar.is-light .navbar-end .navbar-link.is-active,
|
||||||
|
.navbar.is-light .navbar-end .navbar-link:hover,
|
||||||
|
navbar .navbar.is-light .navbar-end > a.navbar-item.is-active,
|
||||||
|
.navbar.is-light .navbar-end > a.navbar-item:hover,
|
||||||
|
.navbar.is-light .navbar-start .navbar-link.is-active,
|
||||||
|
.navbar.is-light .navbar-start .navbar-link:hover,
|
||||||
|
.navbar.is-light .navbar-start > a.navbar-item.is-active,
|
||||||
|
.navbar.is-light .navbar-start > a.navbar-item:hover, .navbar.is-light .navbar-brand > a.navbar-item:hover {
|
||||||
|
background-color: $main-light;
|
||||||
|
color: $main-black;
|
||||||
|
}
|
||||||
289
themes/JuiceBar/assets/scss/_main.scss
Normal file
289
themes/JuiceBar/assets/scss/_main.scss
Normal file
@ -0,0 +1,289 @@
|
|||||||
|
@import "_variables";
|
||||||
|
/* sticky footer */
|
||||||
|
body {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
min-height: 100vh;
|
||||||
|
font-family: Ubuntu, Roboto, 'Open Sans', 'Microsoft YaHei', sans-serif;
|
||||||
|
font-size: $font-size-content;
|
||||||
|
}
|
||||||
|
.dark-mode {
|
||||||
|
color: $dark-font;
|
||||||
|
background-color: $dark-background;
|
||||||
|
}
|
||||||
|
.heading {
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
flex: 1;
|
||||||
|
flex-shrink: 0;
|
||||||
|
flex-basis: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
header,
|
||||||
|
footer {
|
||||||
|
flex-grow: 0;
|
||||||
|
flex-shrink: 0;
|
||||||
|
flex-basis: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .title {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode hr {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title.is-1 {
|
||||||
|
font-family: Inter, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
|
||||||
|
font-size: $font-size-article-title;
|
||||||
|
}
|
||||||
|
|
||||||
|
.max-800px {
|
||||||
|
max-width: 800px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
color: $main-black;
|
||||||
|
margin: 0 0.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .icon {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon:hover, .search-svg:hover {
|
||||||
|
color: $main-orange;
|
||||||
|
transform: scale(1.2);
|
||||||
|
transition: all 0.2s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.single-container,
|
||||||
|
.archive-container,
|
||||||
|
.each-category {
|
||||||
|
padding-left: 20vw;
|
||||||
|
padding-right: 20vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
input {
|
||||||
|
height: 100%;
|
||||||
|
width: 20vw;
|
||||||
|
align-self: center;
|
||||||
|
margin-right: 0.5rem;
|
||||||
|
border-radius: 24px;
|
||||||
|
padding-left: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
input:focus {
|
||||||
|
outline: none;
|
||||||
|
border: 2px solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
border: none;
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode button {
|
||||||
|
background-color: $dark-background;
|
||||||
|
color: $dark-font;
|
||||||
|
border-color: $dark-navbar;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: $main-black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode a {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
.dark-mode .content h1, .dark-mode .content h2, .dark-mode .content h3, .dark-mode .content h4, .dark-mode .content h5, .dark-mode .content h6 {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode code {
|
||||||
|
background-color: $dark-background;
|
||||||
|
}
|
||||||
|
.dark-mode .content blockquote {
|
||||||
|
color: $dark-font;
|
||||||
|
background-color: $dark-background;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode strong {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.dark-mode .content table thead td, .dark-mode .content table thead th {
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .card {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.dark-mode .icon:hover {
|
||||||
|
color: $main-orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode pre {
|
||||||
|
color: #f8f8f2;
|
||||||
|
background-color: #272822;
|
||||||
|
-moz-tab-size: 4;
|
||||||
|
-o-tab-size: 4;
|
||||||
|
tab-size: 4;
|
||||||
|
}
|
||||||
|
.hover-underline-animation {
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
padding: 5px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
transform: scaleX(0);
|
||||||
|
height: 2px;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
background-color: $main-orange;
|
||||||
|
transform-origin: bottom right;
|
||||||
|
transition: transform 0.25s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover:after {
|
||||||
|
transform: scaleX(1);
|
||||||
|
transform-origin: bottom left;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.title,
|
||||||
|
.archive-title {
|
||||||
|
font-size: $font-size-archive-title;
|
||||||
|
margin-top: 2rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.archive-item {
|
||||||
|
margin: 5px 0 15px;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.archive-item-date {
|
||||||
|
color: $main-grey;
|
||||||
|
font-size: $font-size-content;
|
||||||
|
padding: 5px 0;
|
||||||
|
margin-top: 5px;
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
.archive-item-link {
|
||||||
|
display: inline-block;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: $font-size-content-larger;
|
||||||
|
color: #222;
|
||||||
|
padding: 5px 0;
|
||||||
|
transition: all 0.1s linear;
|
||||||
|
|
||||||
|
}
|
||||||
|
.pp-container{
|
||||||
|
margin-top: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
html {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content h1 {
|
||||||
|
font-size: 27px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title.is-1 {
|
||||||
|
margin-top: 25px;
|
||||||
|
font-size: 25.6px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.column {
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section {
|
||||||
|
padding-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h1 {
|
||||||
|
font-size: 25.6px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h2 {
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h3 {
|
||||||
|
font-size: 22px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h4 {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h5 {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artical-content h6 {
|
||||||
|
font-size: 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.archive-title {
|
||||||
|
font-size: 1rem;
|
||||||
|
margin-top: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.archive-item-link {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.archive-item-date {
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section {
|
||||||
|
padding-top: 1rem;
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.single-container,
|
||||||
|
.archive-container,
|
||||||
|
.each-category {
|
||||||
|
padding-left: 5vw;
|
||||||
|
padding-right: 5vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title,
|
||||||
|
.archive-title {
|
||||||
|
margin-top: 1vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
346
themes/JuiceBar/assets/scss/_normalize.scss
Normal file
346
themes/JuiceBar/assets/scss/_normalize.scss
Normal file
@ -0,0 +1,346 @@
|
|||||||
|
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
|
||||||
|
|
||||||
|
/* Document
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the line height in all browsers.
|
||||||
|
* 2. Prevent adjustments of font size after orientation changes in iOS.
|
||||||
|
*/
|
||||||
|
/* Solve the problem that mobile pages generate shadows when clicking on icons or buttons */
|
||||||
|
html {
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
-webkit-text-size-adjust: 100%; /* 2 */
|
||||||
|
|
||||||
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sections
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the margin in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the font size and margin on `h1` elements within `section` and
|
||||||
|
* `article` contexts in Chrome, Firefox, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Grouping content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in Firefox.
|
||||||
|
* 2. Show the overflow in Edge and IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
hr {
|
||||||
|
box-sizing: content-box; /* 1 */
|
||||||
|
height: 0; /* 1 */
|
||||||
|
overflow: visible; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
pre {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Text-level semantics
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the gray background on active links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
a {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Remove the bottom border in Chrome 57-
|
||||||
|
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
abbr[title] {
|
||||||
|
border-bottom: none; /* 1 */
|
||||||
|
text-decoration: underline; /* 2 */
|
||||||
|
text-decoration: underline dotted; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
b,
|
||||||
|
strong {
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
code,
|
||||||
|
kbd,
|
||||||
|
samp {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font size in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
small {
|
||||||
|
font-size: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||||
|
* all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
sub,
|
||||||
|
sup {
|
||||||
|
font-size: 75%;
|
||||||
|
line-height: 0;
|
||||||
|
position: relative;
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
sub {
|
||||||
|
bottom: -0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup {
|
||||||
|
top: -0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Embedded content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the border on images inside links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
img {
|
||||||
|
border-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Forms
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Change the font styles in all browsers.
|
||||||
|
* 2. Remove the margin in Firefox and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input,
|
||||||
|
optgroup,
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
|
font-family: inherit; /* 1 */
|
||||||
|
font-size: 100%; /* 1 */
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
margin: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Show the overflow in IE.
|
||||||
|
* 1. Show the overflow in Edge.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input {
|
||||||
|
/* 1 */
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||||
|
* 1. Remove the inheritance of text transform in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
select {
|
||||||
|
/* 1 */
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
[type='button'],
|
||||||
|
[type='reset'],
|
||||||
|
[type='submit'] {
|
||||||
|
-webkit-appearance: button;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner border and padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button::-moz-focus-inner,
|
||||||
|
[type='button']::-moz-focus-inner,
|
||||||
|
[type='reset']::-moz-focus-inner,
|
||||||
|
[type='submit']::-moz-focus-inner {
|
||||||
|
border-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Restore the focus styles unset by the previous rule.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button:-moz-focusring,
|
||||||
|
[type='button']:-moz-focusring,
|
||||||
|
[type='reset']:-moz-focusring,
|
||||||
|
[type='submit']:-moz-focusring {
|
||||||
|
outline: 1px dotted ButtonText;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
padding: 0.35em 0.75em 0.625em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the text wrapping in Edge and IE.
|
||||||
|
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||||
|
* 3. Remove the padding so developers are not caught out when they zero out
|
||||||
|
* `fieldset` elements in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
legend {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
color: inherit; /* 2 */
|
||||||
|
display: table; /* 1 */
|
||||||
|
max-width: 100%; /* 1 */
|
||||||
|
padding: 0; /* 3 */
|
||||||
|
white-space: normal; /* 1 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||||
|
*/
|
||||||
|
|
||||||
|
progress {
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the default vertical scrollbar in IE 10+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in IE 10.
|
||||||
|
* 2. Remove the padding in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type='checkbox'],
|
||||||
|
[type='radio'] {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
padding: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type='number']::-webkit-inner-spin-button,
|
||||||
|
[type='number']::-webkit-outer-spin-button {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the odd appearance in Chrome and Safari.
|
||||||
|
* 2. Correct the outline style in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type='search'] {
|
||||||
|
-webkit-appearance: textfield; /* 1 */
|
||||||
|
outline-offset: -2px; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner padding in Chrome and Safari on macOS.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type='search']::-webkit-search-decoration {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
* 2. Change font properties to `inherit` in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
::-webkit-file-upload-button {
|
||||||
|
-webkit-appearance: button; /* 1 */
|
||||||
|
font: inherit; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Interactive
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in Edge, IE 10+, and Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
details {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
summary {
|
||||||
|
display: list-item;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Misc
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
template {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[hidden] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
9
themes/JuiceBar/assets/scss/_pagination.scss
Normal file
9
themes/JuiceBar/assets/scss/_pagination.scss
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
.pagination {
|
||||||
|
justify-content: space-around;
|
||||||
|
margin: 0 10vw 1rem 10vw;
|
||||||
|
|
||||||
|
.pag-link {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
115
themes/JuiceBar/assets/scss/_single.scss
Normal file
115
themes/JuiceBar/assets/scss/_single.scss
Normal file
@ -0,0 +1,115 @@
|
|||||||
|
#scrollToTopButton{
|
||||||
|
position: fixed;
|
||||||
|
bottom: 20px;
|
||||||
|
right: 20px;
|
||||||
|
z-index: 9999;
|
||||||
|
}
|
||||||
|
#verification{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 20vh;
|
||||||
|
#secret-word{
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
form {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
width: auto;
|
||||||
|
input[type="password"] {
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
padding: 10px 20px;
|
||||||
|
}
|
||||||
|
input[type="submit"] {
|
||||||
|
padding: 10px 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
input[type="submit"]:hover {
|
||||||
|
background-color: $main-orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.hidden{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.single-container{
|
||||||
|
|
||||||
|
.archive{
|
||||||
|
|
||||||
|
.author-image {
|
||||||
|
object-fit: cover;
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.author-info {
|
||||||
|
display: flex;
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.small-categories-container {
|
||||||
|
margin-right: 3rem;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-content > :not(.toc-container){
|
||||||
|
a{
|
||||||
|
color: #6086b4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.pre-and-post {
|
||||||
|
display: flex;
|
||||||
|
margin: 5px 0;
|
||||||
|
justify-content: space-between;
|
||||||
|
a {
|
||||||
|
font-weight: bolder;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-content {
|
||||||
|
margin: 2rem 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
#verification{
|
||||||
|
|
||||||
|
#secret-word{
|
||||||
|
font-size: 1rem;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
form {
|
||||||
|
|
||||||
|
input[type="password"] {
|
||||||
|
padding: 10px 20px;
|
||||||
|
width: auto;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
input[type="submit"] {
|
||||||
|
padding: 10px 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
background-color: $main-orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.single-container .title {
|
||||||
|
text-align: left;
|
||||||
|
.small-categories-container {
|
||||||
|
margin-right: 5vw;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
37
themes/JuiceBar/assets/scss/_summary.scss
Normal file
37
themes/JuiceBar/assets/scss/_summary.scss
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
@import "variables";
|
||||||
|
|
||||||
|
.post-title {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
@media (max-width: 768px){
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-link {
|
||||||
|
color: $main-black;
|
||||||
|
font-size: $font-size-content-larger;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: $font-size-content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#post-container {
|
||||||
|
padding: 1rem;
|
||||||
|
background-color: $main-light;
|
||||||
|
border-radius: 24px;
|
||||||
|
|
||||||
|
.excerpt {
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 3;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-time-container {
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.dark-mode #post-container {
|
||||||
|
background-color: $dark-navbar;
|
||||||
|
color: $dark-font;
|
||||||
|
}
|
||||||
0
themes/JuiceBar/assets/scss/_taxonomy.scss
Normal file
0
themes/JuiceBar/assets/scss/_taxonomy.scss
Normal file
38
themes/JuiceBar/assets/scss/_terms.scss
Normal file
38
themes/JuiceBar/assets/scss/_terms.scss
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
|
||||||
|
.card-container {
|
||||||
|
display: flex;
|
||||||
|
padding-left: 20vw;
|
||||||
|
padding-right: 20vw;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
.card {
|
||||||
|
height: 72px;
|
||||||
|
width: auto;
|
||||||
|
margin: 2rem;
|
||||||
|
border-radius: 6%;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
transform: scale(1.1);
|
||||||
|
transition: all 0.3s linear;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
|
||||||
|
.card-container {
|
||||||
|
display: flex;
|
||||||
|
padding: 0 20vw;
|
||||||
|
flex-direction: column;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
margin: 1rem;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
58
themes/JuiceBar/assets/scss/_toc.scss
Normal file
58
themes/JuiceBar/assets/scss/_toc.scss
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
@import "variables";
|
||||||
|
|
||||||
|
.post-toc {
|
||||||
|
margin-left: 16px;
|
||||||
|
font-size: 0.9em;
|
||||||
|
line-height: 1.6;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
@media (max-width: 768px){
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
nav{
|
||||||
|
margin-left: -1rem;
|
||||||
|
}
|
||||||
|
ul,li {
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
nav {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
nav > ul > li > a::before {
|
||||||
|
content: "┃";
|
||||||
|
color: $main-orange;
|
||||||
|
}
|
||||||
|
ul > li > ul > li :first-child::before {
|
||||||
|
content: "┃";
|
||||||
|
color: #fded01;
|
||||||
|
}
|
||||||
|
a :last-child {
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#TableOfContents a:hover, #TableOfContents a:active {
|
||||||
|
color: $main-orange;
|
||||||
|
}
|
||||||
|
.toc-container {
|
||||||
|
position: fixed;
|
||||||
|
right: 5vw;
|
||||||
|
overflow: auto;
|
||||||
|
top: 100px;
|
||||||
|
width: 15vw;
|
||||||
|
bottom: 50px;
|
||||||
|
button{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
@media (max-width: 768px){
|
||||||
|
position: static;
|
||||||
|
width: auto;
|
||||||
|
#hide{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
button{
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
13
themes/JuiceBar/assets/scss/_variables.scss
Normal file
13
themes/JuiceBar/assets/scss/_variables.scss
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
$main-black: #363636;
|
||||||
|
$main-orange: #FAB005;
|
||||||
|
$main-light: #f5f5f5;
|
||||||
|
$main-grey: rgb(142, 139, 139);
|
||||||
|
$dark-background: #1F1F1F;
|
||||||
|
$dark-navbar: #2D2F31;
|
||||||
|
$dark-font: #E3E3E3;
|
||||||
|
$font-size-home-title: 2.5rem;
|
||||||
|
$font-size-article-title: 2.5rem;
|
||||||
|
$font-size-article-title-mobile: 1.8rem;
|
||||||
|
$font-size-content: 1rem;
|
||||||
|
$font-size-content-larger: 1.3rem;
|
||||||
|
$font-size-archive-title: 1.9rem;
|
||||||
13
themes/JuiceBar/assets/scss/style.scss
Normal file
13
themes/JuiceBar/assets/scss/style.scss
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
@import "normalize";
|
||||||
|
@import "main";
|
||||||
|
@import "header";
|
||||||
|
@import "single";
|
||||||
|
@import "archive";
|
||||||
|
@import "footer";
|
||||||
|
@import "header";
|
||||||
|
@import "index";
|
||||||
|
@import "terms";
|
||||||
|
@import "summary";
|
||||||
|
@import "toc";
|
||||||
|
@import "about";
|
||||||
|
@import "pagination";
|
||||||
3
themes/JuiceBar/config.toml
Normal file
3
themes/JuiceBar/config.toml
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
[module]
|
||||||
|
[module.hugoVersion]
|
||||||
|
min = "0.75.0"
|
||||||
61
themes/JuiceBar/exampleSite/config.toml
Normal file
61
themes/JuiceBar/exampleSite/config.toml
Normal file
@ -0,0 +1,61 @@
|
|||||||
|
baseURL = 'https://juicebar-demo.add1.dev/'
|
||||||
|
languageCode = 'en'
|
||||||
|
# languageCode = 'zh-CN'
|
||||||
|
theme = "JuiceBar"
|
||||||
|
title = "JuiceBar"
|
||||||
|
|
||||||
|
[params]
|
||||||
|
author = "hotjuicew"
|
||||||
|
description = "My site description"
|
||||||
|
authorImage = "/images/profile.jpg"
|
||||||
|
paginate = 5
|
||||||
|
|
||||||
|
Title = "JuiceBar"
|
||||||
|
content = "I'm JuiceBar, nice to meet you(ˊ˘ˋ*)♡"
|
||||||
|
imageUrl = "/images/avatar.jpg"
|
||||||
|
# To add a new social icon (More social icons can be found in JuiceBar\layouts\partials\svg.html.)
|
||||||
|
[[params.social]]
|
||||||
|
name = "Github"
|
||||||
|
url = "https://github.com/hotjuicew"
|
||||||
|
[[params.social]]
|
||||||
|
name = "telegram"
|
||||||
|
url = "https://t.me/Hotjuice"
|
||||||
|
[[params.social]]
|
||||||
|
name = "twitter"
|
||||||
|
url = "https://twitter.com/hotjuicee"
|
||||||
|
[[params.social]]
|
||||||
|
name = "email"
|
||||||
|
url = "mailto:imjiaying@outlook.com"
|
||||||
|
|
||||||
|
[taxonomies]
|
||||||
|
category = "categories"
|
||||||
|
|
||||||
|
# To add a new navigation link
|
||||||
|
[[menu.main]]
|
||||||
|
name = "About"
|
||||||
|
url = "/about"
|
||||||
|
[[menu.main]]
|
||||||
|
name = "Blog"
|
||||||
|
url = "/post"
|
||||||
|
[[menu.main]]
|
||||||
|
name = "Categories"
|
||||||
|
url = "/categories"
|
||||||
|
|
||||||
|
[params.giscus]
|
||||||
|
repo = "hotjuicew/blog"
|
||||||
|
repoID = "R_kgDOHHQOuw"
|
||||||
|
category = "Announcements"
|
||||||
|
categoryID = "DIC_kwDOHHQOu84CWCQ3"
|
||||||
|
mapping = "og:title"
|
||||||
|
reactionsEnabled = "1"
|
||||||
|
emitMetadata = "0"
|
||||||
|
inputPosition = "bottom"
|
||||||
|
lang = "en"
|
||||||
|
loading = "lazy"
|
||||||
|
|
||||||
|
# Used for outputting the documentation (required).
|
||||||
|
[outputs]
|
||||||
|
home = ["HTML", "RSS", "JSON"]
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
15
themes/JuiceBar/exampleSite/content/about.md
Normal file
15
themes/JuiceBar/exampleSite/content/about.md
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
---
|
||||||
|
title: "About Me"
|
||||||
|
date: 2019-04-26T20:18:54+03:00
|
||||||
|
author: Hotjuice
|
||||||
|
heroimage: /images/author.jpg
|
||||||
|
layout: about
|
||||||
|
---
|
||||||
|
|
||||||
|
《桃花源记》是东晋文学家陶渊明的代表作之一，是《桃花源诗》的序言，选自《陶渊明集》。此文借武陵渔人行踪这一线索，把现实和理想境界联系起来，通过对桃花源的安宁和乐、自由平等生活的描绘，表现了作者追求美好生活的理想和对当时的现实生活不满。
|
||||||
|
|
||||||
|
晋太元中，武陵人捕鱼为业。缘溪行，忘路之远近。忽逢桃花林，夹岸数百步，中无杂树，芳草鲜美，落英缤纷，渔人甚异之。复前行，欲穷其林。
|
||||||
|
林尽水源，便得一山，山有小口，仿佛若有光。便舍船，从口入。初极狭，才通人。复行数十步，豁然开朗。土地平旷，屋舍俨然，有良田美池桑竹之属。阡陌交通，鸡犬相闻。其中往来种作，男女衣着，悉如外人。黄发垂髫，并怡然自乐。
|
||||||
|
见渔人，乃大惊，问所从来。具答之。便要还家，设酒杀鸡作食。村中闻有此人，咸来问讯。自云先世避秦时乱，率妻子邑人来此绝境，不复出焉，遂与外人间隔。问今是何世，乃不知有汉，无论魏晋。此人一一为具言所闻，皆叹惋。余人各复延至其家，皆出酒食。停数日，辞去。此中人语云：“不足为外人道也。”
|
||||||
|
既出，得其船，便扶向路，处处志之。及郡下，诣太守，说如此。太守即遣人随其往，寻向所志，遂迷，不复得路。
|
||||||
|
南阳刘子骥，高尚士也，闻之，欣然规往。未果，寻病终，后遂无问津者。
|
||||||
@ -0,0 +1,145 @@
|
|||||||
|
---
|
||||||
|
title: "Markdown Syntax Guide"
|
||||||
|
date: 2023-02-16T18:58:11+08:00
|
||||||
|
categories: ["Guide"]
|
||||||
|
---
|
||||||
|
|
||||||
|
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
|
||||||
|
|
||||||
|
## Headings
|
||||||
|
|
||||||
|
The following HTML `<h1>`—`<h6>` elements represent six levels of section headings. `<h1>` is the highest section level while `<h6>` is the lowest.
|
||||||
|
|
||||||
|
# H1
|
||||||
|
|
||||||
|
## H2
|
||||||
|
|
||||||
|
### H3
|
||||||
|
|
||||||
|
#### H4
|
||||||
|
|
||||||
|
##### H5
|
||||||
|
|
||||||
|
###### H6
|
||||||
|
|
||||||
|
## Paragraph
|
||||||
|
|
||||||
|
Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.
|
||||||
|
|
||||||
|
Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.
|
||||||
|
|
||||||
|
## Blockquotes
|
||||||
|
|
||||||
|
The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a `footer` or `cite` element, and optionally with in-line changes such as annotations and abbreviations.
|
||||||
|
|
||||||
|
#### Blockquote without attribution
|
||||||
|
|
||||||
|
> Tiam, ad mint andaepu dandae nostion secatur sequo quae. **Note** that you can use *Markdown syntax* within a blockquote.
|
||||||
|
|
||||||
|
#### Blockquote with attribution
|
||||||
|
|
||||||
|
> Don’t communicate by sharing memory, share memory by communicating.
|
||||||
|
> — Rob Pike[1](https://hugo-paper.vercel.app/post/markdown-syntax/#fn:1)
|
||||||
|
|
||||||
|
## Tables
|
||||||
|
|
||||||
|
Tables aren’t part of the core Markdown spec, but Hugo supports supports them out-of-the-box.
|
||||||
|
|
||||||
|
| Name | Age |
|
||||||
|
| ----- | ---- |
|
||||||
|
| Bob | 27 |
|
||||||
|
| Alice | 23 |
|
||||||
|
|
||||||
|
#### Inline Markdown within tables
|
||||||
|
|
||||||
|
| Italics | Bold | Code |
|
||||||
|
| --------- | -------- | ------ |
|
||||||
|
| *italics* | **bold** | `code` |
|
||||||
|
|
||||||
|
## Code Blocks
|
||||||
|
|
||||||
|
#### Code block with backticks
|
||||||
|
|
||||||
|
```html
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<title>Example HTML5 Document</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Test</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Code block indented with four spaces
|
||||||
|
|
||||||
|
```html
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Example HTML5 Document</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Test</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Code block with Hugo’s internal highlight shortcode
|
||||||
|
|
||||||
|
```html
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Example HTML5 Document</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Test</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
```
|
||||||
|
|
||||||
|
## List Types
|
||||||
|
|
||||||
|
#### Ordered List
|
||||||
|
|
||||||
|
1. First item
|
||||||
|
2. Second item
|
||||||
|
3. Third item
|
||||||
|
|
||||||
|
#### Unordered List
|
||||||
|
|
||||||
|
- List item
|
||||||
|
- Another item
|
||||||
|
- And another item
|
||||||
|
|
||||||
|
#### Nested list
|
||||||
|
|
||||||
|
- Fruit
|
||||||
|
- Apple
|
||||||
|
- Orange
|
||||||
|
- Banana
|
||||||
|
- Dairy
|
||||||
|
- Milk
|
||||||
|
- Cheese
|
||||||
|
|
||||||
|
## Other Elements — abbr, sub, sup, kbd, mark
|
||||||
|
|
||||||
|
GIF is a bitmap image format.
|
||||||
|
|
||||||
|
H2O
|
||||||
|
|
||||||
|
Xn + Yn = Zn
|
||||||
|
|
||||||
|
Press CTRL+ALT+Delete to end the session.
|
||||||
|
|
||||||
|
Most salamanders are nocturnal, and hunt for insects, worms, and other small creatures.
|
||||||
|
|
||||||
|
{{< rawhtml >}}
|
||||||
|
<hr>
|
||||||
|
{{< /rawhtml >}}
|
||||||
|
The above quote is excerpted from Rob Pike’s talk during Gopherfest, November 18, 2015.
|
||||||
109
themes/JuiceBar/exampleSite/content/post/Self-Reliance.md
Normal file
109
themes/JuiceBar/exampleSite/content/post/Self-Reliance.md
Normal file
@ -0,0 +1,109 @@
|
|||||||
|
---
|
||||||
|
title: "Self Reliance"
|
||||||
|
date: 2023-02-18T22:19:13+08:00
|
||||||
|
categories: ["Essay"]
|
||||||
|
---
|
||||||
|
I read the other day some verses written by an eminent painter which were original and not conventional. The soul always hears an admonition in such lines, let the subject be what it may. The sentiment they instill is of more value than any thought they may contain. ***To believe your own thought, to believe that what is true for you in your private heart is true for all men, —that is genius.*** Speak your latent conviction, and it shall be the universal sense; for the inmost in due time becomes the outmost,— and our first thought is rendered back to us by the trumpets of the Last Judgment. Familiar as the voice of the mind is to each, the highest merit we ascribe to Moses, Plato, and Milton is, that they set at naught books and traditions, and spoke not what men but what they thought. A man should learn to detect and watch that gleam of light which flashes across his mind from within, more than the lustre of the firmament of bards and sages. Yet he dismisses without notice his thought, because it is his. In every work of genius we recognize our own rejected thoughts: they come back to us with a certain alienated majesty. Great works of art have no more affecting lesson for us than this. They teach us to abide by our spontaneous impression with good-humored inflexibility than most when the whole cry of voices is on the other side. Else, to-morrow a stranger will say with masterly good sense precisely what we have thought and felt all the time, and we shall be forced to take with shame our own opinion from another.
|
||||||
|
|
||||||
|
***There is a time in every man's education when he arrives at the conviction that envy is ignorance***; that imitation is suicide; that he must take himself for better, for worse, as his portion; that though the wide universe is full of good, no kernel of nourishing corn can come to him but through his toil bestowed on that plot of ground which is given to him to till. The power which resides in him is new in nature, and none but he knows what that is which he can do, nor does he know until he has tried. Not for nothing one face, one character, one fact, makes much impression on him, and another none. This sculpture in the memory is not without preestablished harmony. The eye was placed where one ray should fall, that it might testify of that particular ray. We but half express ourselves, and are ashamed of that divine idea which each of us represents. It may be safely trusted as proportionate and of good issues, so it be faithfully imparted, but God will not have his work made manifest by cowards. A man is relieved and gay when he has put his heart into his work and done his best; but what he has said or done otherwise, shall give him no peace. It is a deliverance which does not deliver. In the attempt his genius deserts him; no muse befriends; no invention, no hope.
|
||||||
|
|
||||||
|
***Trust thyself: every heart vibrates to that iron string.*** Accept the place the divine providence has found for you, the society of your contemporaries, the connection of events. Great men have always done so, and confided themselves childlike to the genius of their age, betraying their perception that the absolutely trustworthy was seated at their heart, working through their hands, predominating in all their being. And we are now men, and must accept in the highest mind the same transcendent destiny; and not minors and invalids in a protected corner, not cowards fleeing before a revolution, but guides, redeemers, and benefactors, obeying the Almighty effort, and advancing on Chaos and the Dark.
|
||||||
|
|
||||||
|
What pretty oracles nature yields us on this text, in the face and behaviour of children, babes, and even brutes! That divided and rebel mind, that distrust of a sentiment because our arithmetic has computed the strength and means opposed to our purpose, these have not. Their mind being whole, their eye is as yet unconquered, and when we look in their faces, we are disconcerted. Infancy conforms to nobody: all conform to it, so that one babe commonly makes four or five out of the adults who prattle and play to it. So God has armed youth and puberty and manhood no less with its own piquancy and charm, and made it enviable and gracious and its claims not to be put by, if it will stand by itself. Do not think the youth has no force, because he cannot speak to you and me. Hark! in the next room his voice is sufficiently clear and emphatic. It seems he knows how to speak to his contemporaries. Bashful or bold, then, he will know how to make us seniors very unnecessary.
|
||||||
|
|
||||||
|
The nonchalance of boys who are sure of a dinner, and would disdain as much as a lord to do or say aught to conciliate one, is the healthy attitude of human nature. A boy is in the parlour what the pit is in the playhouse; independent, irresponsible, looking out from his corner on such people and facts as pass by, he tries and sentences them on their merits, in the swift, summary way of boys, as good, bad, interesting, silly, eloquent, troublesome. He cumbers himself never about consequences, about interests: he gives an independent, genuine verdict. You must court him: he does not court you. But the man is, as it were, clapped into jail by his consciousness. As soon as he has once acted or spoken with eclat, he is a committed person, watched by the sympathy or the hatred of hundreds, whose affections must now enter into his account. There is no Lethe for this. Ah, that he could pass again into his neutrality! Who can thus avoid all pledges, and having observed, observe again from the same unaffected, unbiased, unbribable, unaffrighted innocence, must always be formidable. He would utter opinions on all passing affairs, which being seen to be not private, but necessary, would sink like darts into the ear of men, and put them in fear.
|
||||||
|
|
||||||
|
These are the voices which we hear in solitude, but they grow faint and inaudible as we enter into the world. Society everywhere is in conspiracy against the manhood of every one of its members. Society is a joint-stock company, in which the members agree, for the better securing of his bread to each shareholder, to surrender the liberty and culture of the eater. The virtue in most request is conformity. Self-reliance is its aversion. It loves not realities and creators, but names and customs.
|
||||||
|
|
||||||
|
Whoso would be a man must be a nonconformist. He who would gather immortal palms must not be hindered by the name of goodness, but must explore if it be goodness. Nothing is at last sacred but the integrity of your own mind. Absolve you to yourself, and you shall have the suffrage of the world. I remember an answer which when quite young I was prompted to make to a valued adviser, who was wont to importune me with the dear old doctrines of the church. On my saying, What have I to do with the sacredness of traditions, if I live wholly from within? my friend suggested,— "But these impulses may be from below, not from above." I replied, "They do not seem to me to be such; but if I am the Devil's child, I will live then from the Devil." No law can be sacred to me but that of my nature. Good and bad are but names very readily transferable to that or this; the only right is what is after my constitution, the only wrong what is against it. A man is to carry himself in the presence of all opposition, as if every thing were titular and ephemeral but he. I am ashamed to think how easily we capitulate to badges and names, to large societies and dead institutions. Every decent and well-spoken individual affects and sways me more than is right. I ought to go upright and vital, and speak the rude truth in all ways. If malice and vanity wear the coat of philanthropy, shall that pass? If an angry bigot assumes this bountiful cause of Abolition, and comes to me with his last news from Barbadoes, why should I not say to him, ‘Go love thy infant; love thy wood-chopper: be good-natured and modest: have that grace; and never varnish your hard, uncharitable ambition with this incredible tenderness for black folk a thousand miles off. Thy love afar is spite at home.’ Rough and graceless would be such greeting, but truth is handsomer than the affectation of love. Your goodness must have some edge to it, —else it is none. The doctrine of hatred must be preached as the counteraction of the doctrine of love when that pules and whines. I shun father and mother and wife and brother, when my genius calls me. I would write on the lintels of the door-post, Whim. I hope it is somewhat better than whim at last, but we cannot spend the day in explanation. Expect me not to show cause why I seek or why I exclude company. Then, again, do not tell me, as a good man did to-day, of my obligation to put all poor men in good situations. Are they my poor? I tell thee, thou foolish philanthropist, that I grudge the dollar, the dime, the cent, I give to such men as do not belong to me and to whom I do not belong. There is a class of persons to whom by all spiritual affinity I am bought and sold; for them I will go to prison, if need be; but your miscellaneous popular charities; the education at college of fools; the building of meeting-houses to the vain end to which many now stand; alms to sots; and the thousandfold Relief Societies; —though I confess with shame I sometimes succumb and give the dollar, it is a wicked dollar which by and by I shall have the manhood to withhold.
|
||||||
|
|
||||||
|
Virtues are, in the popular estimate, rather the exception than the rule. There is the man and his virtues. Men do what is called a good action, as some piece of courage or charity, much as they would pay a fine in expiation of daily non-appearance on parade. Their works are done as an apology or extenuation of their living in the world,—as invalids and the insane pay a high board. Their virtues are penances. I do not wish to expiate, but to live. My life is for itself and not for a spectacle. I much prefer that it should be of a lower strain, so it be genuine and equal, than that it should be glittering and unsteady. I wish it to be sound and sweet, and not to need diet and bleeding. I ask primary evidence that you are a man, and refuse this appeal from the man to his actions. I know that for myself it makes no difference whether I do or forbear those actions which are reckoned excellent. I cannot consent to pay for a privilege where I have intrinsic right. Few and mean as my gifts may be, I actually am, and do not need for my own assurance or the assurance of my fellows any secondary testimony.
|
||||||
|
|
||||||
|
What I must do is all that concerns me, not what the people think. This rule, equally arduous in actual and in intellectual life, may serve for the whole distinction between greatness and meanness. It is the harder because you will always find those who think they know what is your duty better than you know it. It is easy in the world to live after the world's opinion; it is easy in solitude to live after our own; but the great man is he who in the midst of the crowd keeps with perfect sweetness the independence of solitude.
|
||||||
|
|
||||||
|
The objection to conforming to usages that have become dead to you is that it scatters your force. It loses your time and blurs the impression of your character. If you maintain a dead church, contribute to a dead Bible-society, vote with a great party either for the government or against it, spread your table like base housekeepers,—under all these screens I have difficulty to detect the precise man you are: and of course so much force is withdrawn from your proper life. But do your work, and I shall know you. Do your work, and you shall reinforce yourself. A man must consider what a blind-man's-buff is this game of conformity. If I know your sect I anticipate your argument. I hear a preacher announce for his text and topic the expediency of one of the institutions of his church. Do I not know beforehand that not possibly can he say a new spontaneous word? Do I not know that with all this ostentation of examining the grounds of the institution he will do no such thing? Do I not know that he is pledged to himself not to look but at one side, the permitted side, not as a man, but as a parish minister? He is a retained attorney, and these airs of the bench are the emptiest affectation. Well, most men have bound their eyes with one or another handkerchief, and attached themselves to some one of these communities of opinion. This conformity makes them not false in a few particulars, authors of a few lies, but false in all particulars. Their every truth is not quite true. Their two is not the real two, their four not the real four; so that every word they say chagrins us and we know not where to begin to set them right. Meantime nature is not slow to equip us in the prison-uniform of the party to which we adhere. We come to wear one cut of face and figure, and acquire by degrees the gentlest asinine expression. There is a mortifying experience in particular, which does not fail to wreak itself also in the general history; I mean "the foolish face of praise," the forced smile which we put on in company where we do not feel at ease, in answer to conversation which does not interest us. The muscles, not spontaneously moved but moved by a low usurping wilfulness, grow tight about the outline of the face, with the most disagreeable sensation.
|
||||||
|
|
||||||
|
For nonconformity the world whips you with its displeasure. And therefore a man must know how to estimate a sour face. The by-standers look askance on him in the public street or in the friend's parlor. If this aversion had its origin in contempt and resistance like his own he might well go home with a sad countenance; but the sour faces of the multitude, like their sweet faces, have no deep cause, but are put on and off as the wind blows and a newspaper directs. Yet is the discontent of the multitude more formidable than that of the senate and the college. It is easy enough for a firm man who knows the world to brook the rage of the cultivated classes. Their rage is decorous and prudent, for they are timid, as being very vulnerable themselves. But when to their feminine rage the indignation of the people is added, when the ignorant and the poor are aroused, when the unintelligent brute force that lies at the bottom of society is made to growl and mow, it needs the habit of magnanimity and religion to treat it godlike as a trifle of no concernment.
|
||||||
|
|
||||||
|
The other terror that scares us from self-trust is our consistency; a reverence for our past act or word because the eyes of others have no other data for computing our orbit than our past acts, and we are loath to disappoint them.
|
||||||
|
|
||||||
|
But why should you keep your head over your shoulder? Why drag about this corpse of your memory, lest you contradict somewhat you have stated in this or that public place? Suppose you should contradict yourself; what then? It seems to be a rule of wisdom never to rely on your memory alone, scarcely even in acts of pure memory, but to bring the past for judgment into the thousand-eyed present, and live ever in a new day. In your metaphysics you have denied personality to the Deity, yet when the devout motions of the soul come, yield to them heart and life though they should clothe God with shape and color. Leave your theory, as Joseph his coat in the hand of the harlot, and flee.
|
||||||
|
|
||||||
|
A foolish consistency is the hobgoblin of little minds, adored by little statesmen and philosophers and divines. With consistency a great soul has simply nothing to do. He may as well concern himself with his shadow on the wall. Speak what you think now in hard words, and to-morrow speak what to-morrow thinks in hard words again, though it contradict every thing you said to-day.— 'Ah, so you shall be sure to be misunderstood.' —Is it so bad, then, to be misunderstood? Pythagoras was misunderstood, and Socrates, and Jesus, and Luther, and Copernicus, and Galileo, and Newton, and every pure and wise spirit that ever took flesh. To be great is to be misunderstood.
|
||||||
|
|
||||||
|
I suppose no man can violate his nature. All the sallies of his will are rounded in by the law of his being, as the inequalities of Andes and Himmaleh are insignificant in the curve of the sphere. Nor does it matter how you gauge and try him. A character is like an acrostic or Alexandrian stanza; —read it forward, backward, or across, it still spells the same thing. In this pleasing, contrite wood-life which God allows me, let me record day by day my honest thought without prospect or retrospect, and, I cannot doubt, it will be found symmetrical, though I mean it not, and see it not. My book should smell of pines and resound with the hum of insects. The swallow over my window should interweave that thread or straw he carries in his bill into my web also. We pass for what we are. Character teaches above our wills. Men imagine that they communicate their virtue or vice only by overt actions, and do not see that virtue or vice emit a breath every moment.
|
||||||
|
|
||||||
|
There will be an agreement in whatever variety of actions, so they be each honest and natural in their hour. For of one will, the actions will be harmonious, however unlike they seem. These varieties are lost sight of at a little distance, at a little height of thought. One tendency unites them all. The voyage of the best ship is a zigzag line of a hundred tacks. See the line from a sufficient distance, and it straightens itself to the average tendency. Your genuine action will explain itself, and will explain your other genuine actions. Your conformity explains nothing. Act singly, and what you have already done singly will justify you now. Greatness appeals to the future. If I can be firm enough to-day to do right, and scorn eyes, I must have done so much right before as to defend me now. Be it how it will, do right now. Always scorn appearances, and you always may. The force of character is cumulative. All the foregone days of virtue work their health into this. What makes the majesty of the heroes of the senate and the field, which so fills the imagination? The consciousness of a train of great days and victories behind. They shed an united light on the advancing actor. He is attended as by a visible escort of angels. That is it which throws thunder into [Chatham](https://en.wikipedia.org/wiki/William_Fitzhugh)'s voice, and dignity into [Washington](https://en.wikipedia.org/wiki/George_Washington)'s port, and America into [Adams](https://en.wikipedia.org/wiki/John_Adams)'s eye. Honor is venerable to us because it is no ephemeris. It is always ancient virtue. We worship it to-day because it is not of to-day. We love it and pay it homage, because it is not a trap for our love and homage, but is self-dependent, self-derived, and therefore of an old immaculate pedigree, even if shown in a young person.
|
||||||
|
|
||||||
|
I hope in these days we have heard the last of conformity and consistency. Let the words be gazetted and ridiculous henceforward. Instead of the gong for dinner, let us hear a whistle from the Spartan fife. Let us never bow and apologize more. A great man is coming to eat at my house. I do not wish to please him; I wish that he should wish to please me. I will stand here for humanity, and though I would make it kind, I would make it true. Let us affront and reprimand the smooth mediocrity and squalid contentment of the times, and hurl in the face of custom, and trade, and office, the fact which is the upshot of all history, that there is a great responsible Thinker and Actor working wherever a man works; that a true man belongs to no other time or place, but is the centre of things. Where he is, there is nature. He measures you, and all men, and all events. Ordinarily, every body in society reminds us of somewhat else, or of some other person. Character, reality, reminds you of nothing else; it takes place of the whole creation. The man must be so much, that he must make all circumstances indifferent. Every true man is a cause, a country, and an age; requires infinite spaces and numbers and time fully to accomplish his design; —and posterity seem to follow his steps as a train of clients. A man Caesar is born, and for ages after we have a Roman Empire. Christ is born, and millions of minds so grow and cleave to his genius, that he is confounded with virtue and the possible of man. An institution is the lengthened shadow of one man; as, [Monachism](https://en.wikipedia.org/wiki/Christian_monasticism), of the [Hermit Antony](https://en.wikipedia.org/wiki/Anthony_the_Great); the [Reformation](https://en.wikipedia.org/wiki/Protestant_Reformation), of [Luther](https://en.wikipedia.org/wiki/Martin_Luther); [Quakerism](https://en.wikipedia.org/wiki/Religious_Society_of_Friends), of [Fox](https://en.wikipedia.org/wiki/George_Fox); [Methodism](https://en.wikipedia.org/wiki/Methodism), of [Wesley](https://en.wikipedia.org/wiki/John_Wesley); [Abolition](https://en.wikipedia.org/wiki/Abolitionism), of [Clarkson](https://en.wikipedia.org/wiki/Thomas_Clarkson). [Scipio](https://en.wikipedia.org/wiki/Scipio_Africanus), Milton called "the height of Rome"; and all history resolves itself very easily into the biography of a few stout and earnest persons.
|
||||||
|
|
||||||
|
Let a man then know his worth, and keep things under his feet. Let him not peep or steal, or skulk up and down with the air of a charity-boy, a bastard, or an interloper, in the world which exists for him. But the man in the street, finding no worth in himself which corresponds to the force which built a tower or sculptured a marble god, feels poor when he looks on these. To him a palace, a statue, or a costly book have an alien and forbidding air, much like a gay equipage, and seem to say like that, ‘Who are you, Sir?’ Yet they all are his, suitors for his notice, petitioners to his faculties that they will come out and take possession. The picture waits for my verdict: it is not to command me, but I am to settle its claims to praise. That popular fable of the sot who was picked up dead drunk in the street, carried to the duke's house, washed and dressed and laid in the duke's bed, and, on his waking, treated with all obsequious ceremony like the duke, and assured that he had been insane, owes its popularity to the fact, that it symbolizes so well the state of man, who is in the world a sort of sot, but now and then wakes up, exercises his reason, and finds himself a true prince.
|
||||||
|
|
||||||
|
Our reading is mendicant and sycophantic. In history, our imagination plays us false. Kingdom and lordship, power and estate, are a gaudier vocabulary than private John and Edward in a small house and common day's work; but the things of life are the same to both; the sum total of both is the same. Why all this deference to Alfred, and Scanderbeg, and Gustavus? Suppose they were virtuous; did they wear out virtue? As great a stake depends on your private act to-day, as followed their public and renowned steps. When private men shall act with original views, the lustre will be transferred from the actions of kings to those of gentlemen.
|
||||||
|
|
||||||
|
The world has been instructed by its kings, who have so magnetized the eyes of nations. It has been taught by this colossal symbol the mutual reverence that is due from man to man. The joyful loyalty with which men have everywhere suffered the king, the noble, or the great proprietor to walk among them by a law of his own, make his own scale of men and things, and reverse theirs, pay for benefits not with money but with honor, and represent the law in his person, was the hieroglyphic by which they obscurely signified their consciousness of their own right and comeliness, the right of every man.
|
||||||
|
|
||||||
|
The magnetism which all original action exerts is explained when we inquire the reason of self-trust. Who is the Trustee? What is the aboriginal Self, on which a universal reliance may be grounded? What is the nature and power of that science-baffling star, without parallax, without calculable elements, which shoots a ray of beauty even into trivial and impure actions, if the least mark of independence appear? The inquiry leads us to that source, at once the essence of genius, of virtue, and of life, which we call Spontaneity or Instinct. We denote this primary wisdom as Intuition, whilst all later teachings are tuitions. In that deep force, the last fact behind which analysis cannot go, all things find their common origin. For, the sense of being which in calm hours rises, we know not how, in the soul, is not diverse from things, from space, from light, from time, from man, but one with them, and proceeds obviously from the same source whence their life and being also proceed. We first share the life by which things exist, and afterwards see them as appearances in nature, and forget that we have shared their cause. Here is the fountain of action and of thought. Here are the lungs of that inspiration which giveth man wisdom, and which cannot be denied without impiety and atheism. We lie in the lap of immense intelligence, which makes us receivers of its truth and organs of its activity. When we discern justice, when we discern truth, we do nothing of ourselves, but allow a passage to its beams. If we ask whence this comes, if we seek to pry into the soul that causes, all philosophy is at fault. Its presence or its absence is all we can affirm. Every man discriminates between the voluntary acts of his mind, and his involuntary perceptions, and knows that to his involuntary perceptions a perfect faith is due. He may err in the expression of them, but he knows that these things are so, like day and night, not to be disputed. My wilful actions and acquisitions are but roving; —the idlest reverie, the faintest native emotion, command my curiosity and respect. Thoughtless people contradict as readily the statement of perceptions as of opinions, or rather much more readily; for, they do not distinguish between perception and notion. They fancy that I choose to see this or that thing. But perception is not whimsical, but fatal. If I see a trait, my children will see it after me, and in course of time, all mankind, —although it may chance that no one has seen it before me. For my perception of it is as much a fact as the sun.
|
||||||
|
|
||||||
|
The relations of the soul to the divine spirit are so pure, that it is profane to seek to interpose helps. It must be that when God speaketh he should communicate, not one thing, but all things; should fill the world with his voice; should scatter forth light, nature, time, souls, from the centre of the present thought; and new date and new create the whole. Whenever a mind is simple, and receives a divine wisdom, old things pass away, —means, teachers, texts, temples fall; it lives now, and absorbs past and future into the present hour. All things are made sacred by relation to it, —one as much as another. All things are dissolved to their centre by their cause, and, in the universal miracle, petty and particular miracles disappear. If, therefore, a man claims to know and speak of God, and carries you backward to the phraseology of some old mouldered nation in another country, in another world, believe him not. Is the acorn better than the oak which is its fulness and completion? Is the parent better than the child into whom he has cast his ripened being? Whence, then, this worship of the past? The centuries are conspirators against the sanity and authority of the soul. Time and space are but physiological colors which the eye makes, but the soul is light; where it is, is day; where it was, is night; and history is an impertinence and an injury, if it be any thing more than a cheerful apologue or parable of my being and becoming.
|
||||||
|
|
||||||
|
Man is timid and apologetic; he is no longer upright; he dares not say `I think,' `I am,' but quotes some saint or sage. He is ashamed before the blade of grass or the blowing rose. These roses under my window make no reference to former roses or to better ones; they are for what they are; they exist with God to-day. There is no time to them. There is simply the rose; it is perfect in every moment of its existence. Before a leaf-bud has burst, its whole life acts; in the full-blown flower there is no more; in the leafless root there is no less. Its nature is satisfied, and it satisfies nature, in all moments alike. But man postpones or remembers; he does not live in the present, but with reverted eye laments the past, or, heedless of the riches that surround him, stands on tiptoe to foresee the future. He cannot be happy and strong until he too lives with nature in the present, above time.
|
||||||
|
|
||||||
|
This should be plain enough. Yet see what strong intellects dare not yet hear God himself, unless he speak the phraseology of I know not what David, or Jeremiah, or Paul. We shall not always set so great a price on a few texts, on a few lives. We are like children who repeat by rote the sentences of grandames and tutors, and, as they grow older, of the men of talents and character they chance to see, —painfully recollecting the exact words they spoke; afterwards, when they come into the point of view which those had who uttered these sayings, they understand them, and are willing to let the words go; for, at any time, they can use words as good when occasion comes. If we live truly, we shall see truly. It is as easy for the strong man to be strong, as it is for the weak to be weak. When we have new perception, we shall gladly disburden the memory of its hoarded treasures as old rubbish. When a man lives with God, his voice shall be as sweet as the murmur of the brook and the rustle of the corn.
|
||||||
|
|
||||||
|
And now at last the highest truth on this subject remains unsaid; probably cannot be said; for all that we say is the far-off remembering of the intuition. That thought, by what I can now nearest approach to say it, is this. When good is near you, when you have life in yourself, it is not by any known or accustomed way; you shall not discern the foot-prints of any other; you shall not see the face of man; you shall not hear any name;——the way, the thought, the good, shall be wholly strange and new. It shall exclude example and experience. You take the way from man, not to man. All persons that ever existed are its forgotten ministers. Fear and hope are alike beneath it. There is somewhat low even in hope. In the hour of vision, there is nothing that can be called gratitude, nor properly joy. The soul raised over passion beholds identity and eternal causation, perceives the self-existence of Truth and Right, and calms itself with knowing that all things go well. Vast spaces of nature, the Atlantic Ocean, the South Sea, —long intervals of time, years, centuries, —are of no account. This which I think and feel underlay every former state of life and circumstances, as it does underlie my present, and what is called life, and what is called death.
|
||||||
|
|
||||||
|
Life only avails, not the having lived. Power ceases in the instant of repose; it resides in the moment of transition from a past to a new state, in the shooting of the gulf, in the darting to an aim. This one fact the world hates, that the soul becomes; for that for ever degrades the past, turns all riches to poverty, all reputation to a shame, confounds the saint with the rogue, shoves Jesus and Judas equally aside. Why, then, do we prate of self-reliance? Inasmuch as the soul is present, there will be power not confident but agent. To talk of reliance is a poor external way of speaking. Speak rather of that which relies, because it works and is. Who has more obedience than I masters me, though he should not raise his finger. Round him I must revolve by the gravitation of spirits. We fancy it rhetoric, when we speak of eminent virtue. We do not yet see that virtue is Height, and that a man or a company of men, plastic and permeable to principles, by the law of nature must overpower and ride all cities, nations, kings, rich men, poets, who are not.
|
||||||
|
|
||||||
|
This is the ultimate fact which we so quickly reach on this, as on every topic, the resolution of all into the ever-blessed ONE. Self-existence is the attribute of the Supreme Cause, and it constitutes the measure of good by the degree in which it enters into all lower forms. All things real are so by so much virtue as they contain. Commerce, husbandry, hunting, whaling, war, eloquence, personal weight, are somewhat, and engage my respect as examples of its presence and impure action. I see the same law working in nature for conservation and growth. Power is in nature the essential measure of right. Nature suffers nothing to remain in her kingdoms which cannot help itself. The genesis and maturation of a planet, its poise and orbit, the bended tree recovering itself from the strong wind, the vital resources of every animal and vegetable, are demonstrations of the self-sufficing, and therefore self-relying soul.
|
||||||
|
|
||||||
|
Thus all concentrates: let us not rove; let us sit at home with the cause. Let us stun and astonish the intruding rabble of men and books and institutions, by a simple declaration of the divine fact. Bid the invaders take the shoes from off their feet, for God is here within. Let our simplicity judge them, and our docility to our own law demonstrate the poverty of nature and fortune beside our native riches.
|
||||||
|
|
||||||
|
But now we are a mob. Man does not stand in awe of man, nor is his genius admonished to stay at home, to put itself in communication with the internal ocean, but it goes abroad to beg a cup of water of the urns of other men. We must go alone. I like the silent church before the service begins, better than any preaching. How far off, how cool, how chaste the persons look, begirt each one with a precinct or sanctuary! So let us always sit. Why should we assume the faults of our friend, or wife, or father, or child, because they sit around our hearth, or are said to have the same blood? All men have my blood, and I have all men's. Not for that will I adopt their petulance or folly, even to the extent of being ashamed of it. But your isolation must not be mechanical, but spiritual, that is, must be elevation. At times the whole world seems to be in conspiracy to importune you with emphatic trifles. Friend, client, child, sickness, fear, want, charity, all knock at once at thy closet door, and say,— `Come out unto us.' But keep thy state; come not into their confusion. The power men possess to annoy me, I give them by a weak curiosity. No man can come near me but through my act. "What we love that we have, but by desire we bereave ourselves of the love."
|
||||||
|
|
||||||
|
If we cannot at once rise to the sanctities of obedience and faith, let us at least resist our temptations; let us enter into the state of war, and wake Thor and Woden, courage and constancy, in our Saxon breasts. This is to be done in our smooth times by speaking the truth. Check this lying hospitality and lying affection. Live no longer to the expectation of these deceived and deceiving people with whom we converse. Say to them, O father, O mother, O wife, O brother, O friend, I have lived with you after appearances hitherto. Henceforward I am the truth's. Be it known unto you that henceforward I obey no law less than the eternal law. I will have no covenants but proximities. I shall endeavour to nourish my parents, to support my family, to be the chaste husband of one wife, —but these relations I must fill after a new and unprecedented way. I appeal from your customs. I must be myself. I cannot break myself any longer for you, or you. If you can love me for what I am, we shall be the happier. If you cannot, I will still seek to deserve that you should. I will not hide my tastes or aversions. I will so trust that what is deep is holy, that I will do strongly before the sun and moon whatever inly rejoices me, and the heart appoints. If you are noble, I will love you; if you are not, I will not hurt you and myself by hypocritical attentions. If you are true, but not in the same truth with me, cleave to your companions; I will seek my own. I do this not selfishly, but humbly and truly. It is alike your interest, and mine, and all men's, however long we have dwelt in lies, to live in truth. Does this sound harsh to-day? You will soon love what is dictated by your nature as well as mine, and, if we follow the truth, it will bring us out safe at last. —But so you may give these friends pain. Yes, but I cannot sell my liberty and my power, to save their sensibility. Besides, all persons have their moments of reason, when they look out into the region of absolute truth; then will they justify me, and do the same thing.
|
||||||
|
|
||||||
|
The populace think that your rejection of popular standards is a rejection of all standard, and mere antinomianism; and the bold sensualist will use the name of philosophy to gild his crimes. But the law of consciousness abides. There are two confessionals, in one or the other of which we must be shriven. You may fulfil your round of duties by clearing yourself in the direct, or in the reflex way. Consider whether you have satisfied your relations to father, mother, cousin, neighbour, town, cat, and dog; whether any of these can upbraid you. But I may also neglect this reflex standard, and absolve me to myself. I have my own stern claims and perfect circle. It denies the name of duty to many offices that are called duties. But if I can discharge its debts, it enables me to dispense with the popular code. If any one imagines that this law is lax, let him keep its commandment one day.
|
||||||
|
|
||||||
|
And truly it demands something godlike in him who has cast off the common motives of humanity, and has ventured to trust himself for a taskmaster. High be his heart, faithful his will, clear his sight, that he may in good earnest be doctrine, society, law, to himself, that a simple purpose may be to him as strong as iron necessity is to others!
|
||||||
|
|
||||||
|
If any man consider the present aspects of what is called by distinction society, he will see the need of these ethics. The sinew and heart of man seem to be drawn out, and we are become timorous, desponding whimperers. We are afraid of truth, afraid of fortune, afraid of death, and afraid of each other. Our age yields no great and perfect persons. We want men and women who shall renovate life and our social state, but we see that most natures are insolvent, cannot satisfy their own wants, have an ambition out of all proportion to their practical force, and do lean and beg day and night continually. Our housekeeping is mendicant, our arts, our occupations, our marriages, our religion, we have not chosen, but society has chosen for us. We are parlour soldiers. We shun the rugged battle of fate, where strength is born.
|
||||||
|
|
||||||
|
If our young men miscarry in their first enterprises, they lose all heart. If the young merchant fails, men say he is ruined. If the finest genius studies at one of our colleges, and is not installed in an office within one year afterwards in the cities or suburbs of Boston or New York, it seems to his friends and to himself that he is right in being disheartened, and in complaining the rest of his life. A sturdy lad from New Hampshire or Vermont, who in turn tries all the professions, who teams it, farms it, peddles, keeps a school, preaches, edits a newspaper, goes to Congress, buys a township, and so forth, in successive years, and always, like a cat, falls on his feet, is worth a hundred of these city dolls. He walks abreast with his days, and feels no shame in not `studying a profession,' for he does not postpone his life, but lives already. He has not one chance, but a hundred chances. Let a Stoic open the resources of man, and tell men they are not leaning willows, but can and must detach themselves; that with the exercise of self-trust, new powers shall appear; that a man is the word made flesh, born to shed healing to the nations, that he should be ashamed of our compassion, and that the moment he acts from himself, tossing the laws, the books, idolatries, and customs out of the window, we pity him no more, but thank and revere him, —and that teacher shall restore the life of man to splendor, and make his name dear to all history.
|
||||||
|
|
||||||
|
It is easy to see that a greater self-reliance must work a revolution in all the offices and relations of men; in their religion; in their education; in their pursuits; their modes of living; their association; in their property; in their speculative views.
|
||||||
|
|
||||||
|
\1. In what prayers do men allow themselves! That which they call a holy office is not so much as brave and manly. Prayer looks abroad and asks for some foreign addition to come through some foreign virtue, and loses itself in endless mazes of natural and supernatural, and mediatorial and miraculous. Prayer that craves a particular commodity, —any thing less than all good, —is vicious. Prayer is the contemplation of the facts of life from the highest point of view. It is the soliloquy of a beholding and jubilant soul. It is the spirit of God pronouncing his works good. But prayer as a means to effect a private end is meanness and theft. It supposes dualism and not unity in nature and consciousness. As soon as the man is at one with God, he will not beg. He will then see prayer in all action. The prayer of the farmer kneeling in his field to weed it, the prayer of the rower kneeling with the stroke of his oar, are true prayers heard throughout nature, though for cheap ends. Caratach, in Fletcher's Bonduca, when admonished to inquire the mind of the god Audate, replies,—
|
||||||
|
|
||||||
|
"His hidden meaning lies in our endeavours;
|
||||||
|
Our valors are our best gods."
|
||||||
|
|
||||||
|
Another sort of false prayers are our regrets. Discontent is the want of self-reliance: it is infirmity of will. Regret calamities, if you can thereby help the sufferer; if not, attend your own work, and already the evil begins to be repaired. Our sympathy is just as base. We come to them who weep foolishly, and sit down and cry for company, instead of imparting to them truth and health in rough electric shocks, putting them once more in communication with their own reason. The secret of fortune is joy in our hands. Welcome evermore to gods and men is the self-helping man. For him all doors are flung wide: him all tongues greet, all honors crown, all eyes follow with desire. Our love goes out to him and embraces him, because he did not need it. We solicitously and apologetically caress and celebrate him, because he held on his way and scorned our disapprobation. The gods love him because men hated him. "To the persevering mortal," said Zoroaster, "the blessed Immortals are swift."
|
||||||
|
|
||||||
|
As men's prayers are a disease of the will, so are their creeds a disease of the intellect. They say with those foolish Israelites, Let not God speak to us, lest we die. Speak thou, speak any man with us, and we will obey. Everywhere I am hindered of meeting God in my brother, because he has shut his own temple doors, and recites fables merely of his brother's, or his brother's brother's God. Every new mind is a new classification. If it prove a mind of uncommon activity and power, a Locke, a Lavoisier, a Hutton, a Bentham, a Fourier, it imposes its classification on other men, and lo! a new system. In proportion to the depth of the thought, and so to the number of the objects it touches and brings within reach of the pupil, is his complacency. But chiefly is this apparent in creeds and churches, which are also classifications of some powerful mind acting on the elemental thought of duty, and man's relation to the Highest. Such is Calvinism, Quakerism, Swedenborgism. The pupil takes the same delight in subordinating every thing to the new terminology, as a girl who has just learned botany in seeing a new earth and new seasons thereby. It will happen for a time, that the pupil will find his intellectual power has grown by the study of his master's mind. But in all unbalanced minds, the classification is idolized, passes for the end, and not for a speedily exhaustible means, so that the walls of the system blend to their eye in the remote horizon with the walls of the universe; the luminaries of heaven seem to them hung on the arch their master built. They cannot imagine how you aliens have any right to see, —how you can see; `It must be somehow that you stole the light from us.' They do not yet perceive, that light, unsystematic, indomitable, will break into any cabin, even into theirs. Let them chirp awhile and call it their own. If they are honest and do well, presently their neat new pinfold will be too strait and low, will crack, will lean, will rot and vanish, and the immortal light, all young and joyful, million-orbed, million-colored, will beam over the universe as on the first morning.
|
||||||
|
|
||||||
|
\2. It is for want of self-culture that the superstition of Travelling, whose idols are Italy, England, Egypt, retains its fascination for all educated Americans. They who made England, Italy, or Greece venerable in the imagination did so by sticking fast where they were, like an axis of the earth. In manly hours, we feel that duty is our place. The soul is no traveller; the wise man stays at home, and when his necessities, his duties, on any occasion call him from his house, or into foreign lands, he is at home still, and shall make men sensible by the expression of his countenance, that he goes the missionary of wisdom and virtue, and visits cities and men like a sovereign, and not like an interloper or a valet.
|
||||||
|
|
||||||
|
I have no churlish objection to the circumnavigation of the globe, for the purposes of art, of study, and benevolence, so that the man is first domesticated, or does not go abroad with the hope of finding somewhat greater than he knows. He who travels to be amused, or to get somewhat which he does not carry, travels away from himself, and grows old even in youth among old things. In Thebes, in Palmyra, his will and mind have become old and dilapidated as they. He carries ruins to ruins.
|
||||||
|
|
||||||
|
Travelling is a fool's paradise. Our first journeys discover to us the indifference of places. At home I dream that at Naples, at Rome, I can be intoxicated with beauty, and lose my sadness. I pack my trunk, embrace my friends, embark on the sea, and at last wake up in Naples, and there beside me is the stern fact, the sad self, unrelenting, identical, that I fled from. I seek the Vatican, and the palaces. I affect to be intoxicated with sights and suggestions, but I am not intoxicated. My giant goes with me wherever I go.
|
||||||
|
|
||||||
|
\3. But the rage of travelling is a symptom of a deeper unsoundness affecting the whole intellectual action. The intellect is vagabond, and our system of education fosters restlessness. Our minds travel when our bodies are forced to stay at home. We imitate; and what is imitation but the travelling of the mind? Our houses are built with foreign taste; our shelves are garnished with foreign ornaments; our opinions, our tastes, our faculties, lean, and follow the Past and the Distant. The soul created the arts wherever they have flourished. It was in his own mind that the artist sought his model. It was an application of his own thought to the thing to be done and the conditions to be observed. And why need we copy the Doric or the Gothic model? Beauty, convenience, grandeur of thought, and quaint expression are as near to us as to any, and if the American artist will study with hope and love the precise thing to be done by him, considering the climate, the soil, the length of the day, the wants of the people, the habit and form of the government, he will create a house in which all these will find themselves fitted, and taste and sentiment will be satisfied also.
|
||||||
|
|
||||||
|
Insist on yourself; never imitate. Your own gift you can present every moment with the cumulative force of a whole life's cultivation; but of the adopted talent of another, you have only an extemporaneous, half possession. That which each can do best, none but his Maker can teach him. No man yet knows what it is, nor can, till that person has exhibited it. Where is the master who could have taught Shakspeare? Where is the master who could have instructed Franklin, or Washington, or Bacon, or Newton? Every great man is a unique. The Scipionism of Scipio is precisely that part he could not borrow. Shakspeare will never be made by the study of Shakspeare. Do that which is assigned you, and you cannot hope too much or dare too much. There is at this moment for you an utterance brave and grand as that of the colossal chisel of Phidias, or trowel of the Egyptians, or the pen of Moses, or Dante, but different from all these. Not possibly will the soul all rich, all eloquent, with thousand-cloven tongue, deign to repeat itself; but if you can hear what these patriarchs say, surely you can reply to them in the same pitch of voice; for the ear and the tongue are two organs of one nature. Abide in the simple and noble regions of thy life, obey thy heart, and thou shalt reproduce the Foreworld again.
|
||||||
|
|
||||||
|
\4. As our Religion, our Education, our Art look abroad, so does our spirit of society. All men plume themselves on the improvement of society, and no man improves.
|
||||||
|
|
||||||
|
Society never advances. It recedes as fast on one side as it gains on the other. It undergoes continual changes; it is barbarous, it is civilized, it is christianized, it is rich, it is scientific; but this change is not amelioration. For every thing that is given, something is taken. Society acquires new arts, and loses old instincts. What a contrast between the well-clad, reading, writing, thinking American, with a watch, a pencil, and a bill of exchange in his pocket, and the naked New Zealander, whose property is a club, a spear, a mat, and an undivided twentieth of a shed to sleep under! But compare the health of the two men, and you shall see that the white man has lost his aboriginal strength. If the traveller tell us truly, strike the savage with a broad axe, and in a day or two the flesh shall unite and heal as if you struck the blow into soft pitch, and the same blow shall send the white to his grave.
|
||||||
|
|
||||||
|
The civilized man has built a coach, but has lost the use of his feet. He is supported on crutches, but lacks so much support of muscle. He has a fine Geneva watch, but he fails of the skill to tell the hour by the sun. A Greenwich nautical almanac he has, and so being sure of the information when he wants it, the man in the street does not know a star in the sky. The solstice he does not observe; the equinox he knows as little; and the whole bright calendar of the year is without a dial in his mind. His note-books impair his memory; his libraries overload his wit; the insurance-office increases the number of accidents; and it may be a question whether machinery does not encumber; whether we have not lost by refinement some energy, by a Christianity entrenched in establishments and forms, some vigor of wild virtue. For every Stoic was a Stoic; but in Christendom where is the Christian?
|
||||||
|
|
||||||
|
There is no more deviation in the moral standard than in the standard of height or bulk. No greater men are now than ever were. A singular equality may be observed between the great men of the first and of the last ages; nor can all the science, art, religion, and philosophy of the nineteenth century avail to educate greater men than Plutarch's heroes, three or four and twenty centuries ago. Not in time is the race progressive. Phocion, Socrates, Anaxagoras, Diogenes, are great men, but they leave no class. He who is really of their class will not be called by their name, but will be his own man, and, in his turn, the founder of a sect. The arts and inventions of each period are only its costume, and do not invigorate men. The harm of the improved machinery may compensate its good. Hudson and Behring accomplished so much in their fishing-boats, as to astonish Parry and Franklin, whose equipment exhausted the resources of science and art. Galileo, with an opera-glass, discovered a more splendid series of celestial phenomena than any one since. Columbus found the New World in an undecked boat. It is curious to see the periodical disuse and perishing of means and machinery, which were introduced with loud laudation a few years or centuries before. The great genius returns to essential man. We reckoned the improvements of the art of war among the triumphs of science, and yet Napoleon conquered Europe by the bivouac, which consisted of falling back on naked valor, and disencumbering it of all aids. The Emperor held it impossible to make a perfect army, says Las Casas, "without abolishing our arms, magazines, commissaries, and carriages, until, in imitation of the Roman custom, the soldier should receive his supply of corn, grind it in his hand-mill, and bake his bread himself."
|
||||||
|
|
||||||
|
Society is a wave. The wave moves onward, but the water of which it is composed does not. The same particle does not rise from the valley to the ridge. Its unity is only phenomenal. The persons who make up a nation to-day, next year die, and their experience with them.
|
||||||
|
|
||||||
|
And so the reliance on Property, including the reliance on governments which protect it, is the want of self-reliance. Men have looked away from themselves and at things so long, that they have come to esteem the religious, learned, and civil institutions as guards of property, and they deprecate assaults on these, because they feel them to be assaults on property. They measure their esteem of each other by what each has, and not by what each is. But a cultivated man becomes ashamed of his property, out of new respect for his nature. Especially he hates what he has, if he see that it is accidental, —came to him by inheritance, or gift, or crime; then he feels that it is not having; it does not belong to him, has no root in him, and merely lies there, because no revolution or no robber takes it away. But that which a man is does always by necessity acquire, and what the man acquires is living property, which does not wait the beck of rulers, or mobs, or revolutions, or fire, or storm, or bankruptcies, but perpetually renews itself wherever the man breathes. "Thy lot or portion of life," said the Caliph Ali, "is seeking after thee; therefore be at rest from seeking after it." Our dependence on these foreign goods leads us to our slavish respect for numbers. The political parties meet in numerous conventions; the greater the concourse, and with each new uproar of announcement, The delegation from Essex! The Democrats from New Hampshire! The Whigs of Maine! the young patriot feels himself stronger than before by a new thousand of eyes and arms. In like manner the reformers summon conventions, and vote and resolve in multitude. Not so, O friends! will the God deign to enter and inhabit you, but by a method precisely the reverse. It is only as a man puts off all foreign support, and stands alone, that I see him to be strong and to prevail. He is weaker by every recruit to his banner. Is not a man better than a town? Ask nothing of men, and in the endless mutation, thou only firm column must presently appear the upholder of all that surrounds thee. He who knows that power is inborn, that he is weak because he has looked for good out of him and elsewhere, and so perceiving, throws himself unhesitatingly on his thought, instantly rights himself, stands in the erect position, commands his limbs, works miracles; just as a man who stands on his feet is stronger than a man who stands on his head.
|
||||||
|
|
||||||
|
So use all that is called Fortune. Most men gamble with her, and gain all, and lose all, as her wheel rolls. But do thou leave as unlawful these winnings, and deal with Cause and Effect, the chancellors of God. In the Will work and acquire, and thou hast chained the wheel of Chance, and shalt sit hereafter out of fear from her rotations. A political victory, a rise of rents, the recovery of your sick, or the return of your absent friend, or some other favorable event, raises your spirits, and you think good days are preparing for you. Do not believe it. Nothing can bring you peace but yourself. Nothing can bring you peace but the triumph of principles.
|
||||||
|
|
||||||
|
> classic English essay by Ralph Waldo Emerson called "Self-Reliance":
|
||||||
28
themes/JuiceBar/exampleSite/content/post/lorem-ipsum.md
Normal file
28
themes/JuiceBar/exampleSite/content/post/lorem-ipsum.md
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
---
|
||||||
|
title: "Lorem Ipsum"
|
||||||
|
date: 2022-04-10T16:50:28+08:00
|
||||||
|
categories : [ "Development" ]
|
||||||
|
protected: true
|
||||||
|
password: "111111"
|
||||||
|
---
|
||||||
|
Lorem ipsum dolor sit amet, consectetur...
|
||||||
|
## What is Lorem Ipsum?
|
||||||
|
In mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus ut
|
||||||
|
|
||||||
|
Vivamus ut tincidunt urna. Nam eu mollis dolor...
|
||||||
|
|
||||||
|
## In mollis cursus ligula
|
||||||
|
Etiam et ligula sit amet urna aliquam suscipit...
|
||||||
|
|
||||||
|
- Cras dui nulla,
|
||||||
|
- ornare eget fermentum quis,
|
||||||
|
- accumsan vitae purus.
|
||||||
|
|
||||||
|
Nam eget pharetra arcu. Cras dui nulla, ornare eget...
|
||||||
|
|
||||||
|
### Nullam a risus maximus
|
||||||
|
Fusce facilisis non anteIn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utIn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus ut quis blandit...
|
||||||
|
|
||||||
|
### Donec vel accumsan justo
|
||||||
|
Maecenas eu libero ac justo tempor pellentesque...
|
||||||
|
In mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utIn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utIn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus utn mollis cursus ligula, et venenatis neque maximus ut
|
||||||
14
themes/JuiceBar/exampleSite/content/post/什么是好小说.md
Normal file
14
themes/JuiceBar/exampleSite/content/post/什么是好小说.md
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
---
|
||||||
|
title: "什么是好小说"
|
||||||
|
date: 2023-02-18T22:11:12+08:00
|
||||||
|
categories: ['Essay']
|
||||||
|
---
|
||||||
|
我想冒昧地谈一谈，在我看来一部好小说应该具有哪些特性。它的主题应该能引起广泛的兴趣，即不仅能使一群人——不管是批评家、教授、有高度文化修养的人，还是公共汽车售票员或者酒吧侍者——感兴趣，而且具有较普遍的人性，对普通男女都有感染力。主题还应该能引起持久的兴趣，一个选择只有一时兴趣的题材进行创作的小说家，是个浅薄的小说家，因为一旦人们对这样的题材失去兴趣，他的小说也就像上星期的报纸一样不值一读了。作者讲述的故事应该合情合理而且有条有理，故事应该有开端、中间和结尾，结尾必须是开端的自然结局。情节要具有可能性，不仅仅要有利于主题发展，还应该是由故事自然产生的。小说中的人物要有个性，他们的行为应该于他们的性格，决不能让读者议论说：“某某人是决不会干那种事的。”相反，要读者不得不承认：“某某人那样做，完全是情理之中的事。“我觉得，要是人物又很有趣，那就更好。福楼拜的《感情教育》虽然受到许多著名批评家的高度称赞，但是他选择的主人公却是个没有个性、没有生气、也没有任何特点的人，以至他的所作所为以及在他身上所发生的一切，都无法使人产生兴趣。结果，虽然想说中有许多出色之处，但整部小说还是令人难以卒读。我觉得，我必须解释一下，为什么我认为人物必须具有个性。因为要求小说家创造出完全新型的人物，是强人所难，小说家使用的材料是人性，虽然在各种不同的环境中人性千变万化，但也不是无限的，人们创作小说、故事、戏剧、史诗已有几千年历史，一个小说家能够创造出一种新型人物的机会，可说微乎其微，回顾整个小说史，我所能想到的唯一具有独创性的任务，就是堂·吉诃德。然而，即便是他，我还是毫不惊讶地听说，有个知识渊博的批评家已为他找到一个古老的祖先。因此，只要一个小说家能通过个性来观察他的人物，只要他的人物个性鲜明，而且鲜明到足以让人错以为他是一种独创的人物，那么这个小说家就已经是很成功了。
|
||||||
|
|
||||||
|
既然行为应源于性格，那么语言也应如此。一个上流社会女子，谈吐就应该像个上流社会女子。一个妓女的语言，就得像个妓女。一个赛马场招徕顾客的人或者一个律师，讲话也得符合各自身份（我不得不说，梅瑞耿斯或亨利·詹姆斯的作品就有一个缺点，就是他们的人物都千篇一律地用梅瑞耿斯或亨利·詹姆斯的腔调说话）。小说中的对话不能杂乱无章，也不应该用来发表作者的意见。它必须服从于典型化人物的塑造和故事情节的发展，叙述的部分应该写得直截了当，要生动、明确，只需把人物的动机以及他们所处的环境令人信服地交代清楚，而不应过于冗长。文笔要简洁，使一般文化修养的读者阅读时也不觉得费劲，风格要和内容一致，就像式样精巧的鞋要和大小匀称的脚相配。最后，好的小说还应引人入胜。我虽然把这一点放到最后说，但却是最基本的要点，没有这一点，其他一切全都会落空。一部小说在提供娱乐的同时越发引人深思，就越好。娱乐一词有多种含义，提供乐趣或者消遣只是其中之一。人们容易犯的错误是，认为娱乐就其含义而言，消遣是唯一重要的。其实，《呼啸山庄》或《卡拉马佐兄弟》和《特里斯川·项狄传》或《康第姐》同样具有娱乐性。虽然感染人的程度不同，但同样真实。当然，小说家有权处理那些和每个人都密切相关的重要主题，如：上帝的存在、灵魂的不朽、生命的意义及价值，等等。但是，他在这样做的时候，最好记住约翰逊博士的至理名言：”关于上帝、灵魂或者生命这样的主题，没有人再能发表新的真实见解，或者真实的新见解。“即便这些主题是小说家所要讲述的故事的一个组成部分，而且对人物的典型化是必需的，会影响到人物的行为举止——也就是说，如果不是这样，他们就不会有那样的行为举止——小说家也只能指望读者对他所涉及到的这些主题感兴趣而已。
|
||||||
|
|
||||||
|
即便一部长篇小说具有我提出的所有优点（这要求已相当高），它在形式上也会有这样那样的缺陷，就如白璧微瑕，很难做到尽善尽美。因此，没有一部长篇小说是十全十美的，一个短篇小说可能是十全十美的，根据它的篇幅，大约在10分钟到1个小时内就能读完，它的主题单一、明确，完整描写一个精神的或物质的事件，或者描写一连串密切相关的事件。它可以做到不可增减的程度。我相信，像这样完美的境界，短篇小说是可以达到的，而且我认为要找到一批这样的短篇小说也不难。但是，长篇小说却是一种篇幅不限定的叙事文学，它可以长得像《战争与和平》那样，同时表现一系列相互关联的事件，又同时表现许许多多人物。也可以短得像《嘉尔曼》那样。为了把故事讲得真是，作者总要降到与故事有关的其他事情，而且这些事情并不总是很有趣的。事件的发展往往需要有时间上的间隔，作者为了使作品得到平衡，就得尽力插入一些内容来填补因间隔而留下的空白。这样的段落称之为”桥“。大多数小说家虽然都天生有过”桥“的才能，但在此过程中，枯燥无味却是难免的。小说家也是人，不可避免地会受到时代风气的影响，更何况小说家的感受性还胜过一般人，因此他时常会不自主地写出一些追随世风的、昙花一现的东西。举例来说：19世纪之前的小说家是不太注意景物描写的，写道某物也至多一二句话。但是，当浪漫主义作家，如夏多布里昂，受到公众喜爱后，为描写而描写就成了一时的风尚，某个人物上街到灶火点去买牙刷，作者也会告诉你，他路过的屋子是什么样子，店里出售的是什么商品，等等。黎明和夕阳、夜晚的星空、万里无云的晴天、白雪皑皑的山岭、阴森幽暗的树木——所有这一切，都会引来没完没了的冗长描写。许多描写固然很美，但离题万里。只是到了很久之后，作家们才明白，不管多么富有诗意、多么逼真形象的景物描写，除非它有助于推动故事的发展或者有助于读者了解人物的某些情况，否则就是多余的废话。这还是长篇小说偶尔才有的缺点，另一种缺点则是内在的、必然的。要完成一部洋洋洒洒的长篇巨著是很费时日的，至少也得几个星期，一般需要好几个月，有时甚至要好几年。作家的创造力往往会衰退，这是很自然的事。这样他就只能硬着头皮坚持写下去，而在这种情况下写出来的东西，如果对读者还会有吸引力的话，那简直是惊人的奇迹了。
|
||||||
|
|
||||||
|
过去，读者总希望小说越长越好，因为他们花钱买小说书，当然想读出本钱来。于是，作家们就挖空心思在自己讲述的故事中添加许多的材料，他们找到了一条捷径那就是让小说中插入小说，有时插入的部分长得像一个中篇小说，而和整部小说的主题又毫无关系，即使有也是牵强附会的。《堂·吉诃德》的作者塞万提斯就是这么做的，而且其大胆程度简直无人能与之相比。那些插入的文字，后来一直被视为是这部不朽名著的一个污点，现在也不再有人会耐心地去读它们了。正因为这一点，塞万提斯受到了现代批评家的攻击。不过，我们知道，他在后半部里避免了这种不良倾向，因此要比前半部好得多，写出了那些被认为奇妙得不可思议的篇章。遗憾的是，他的后继者（他们肯定不读批评文章）并没有停止使用这种方法，他们继续向书商提供大量的廉价故事，足以满足读者的需要。到了19世纪，新的出版形式又使小说家面临新的诱惑。月刊因为用很大篇幅刊登消遣文学而大获成功，对此虽有人嗤之以鼻，但它却为小说作者提供好机会，即：在月刊上连载小说可得到丰厚的报酬。几乎与此同时，出版商也发现，在月刊上连载知名作家的小说是有利可图的。作家要按合同定期向出版商提供一定数量的小说，或者说要写满一定的页数。这样一来，就逼着他们慢吞吞地讲故事，一写就是洋洋万言。我们从他们自己说的话中就得知，这些连载小说的作者，甚至他们中最杰出的如狄更斯、萨克雷和特罗洛普等人也不是感到，要一次又一次定期交出等着连载的那部分小说，实在是一种难以承受的沉重负担。无怪乎，他们只好把小说拉长！无怪乎，他们只好用不相干的内容把故事弄得拖泥带水！所以，如果考虑到当时的小说家有那么多的障碍和陷阱，那么当你发现当时最优秀的小说也有缺陷时，就不会大惊小怪了。实际上，使我觉得惊讶的倒是，它们的缺陷并不像想象的那么多。
|
||||||
|
|
||||||
|
> 毛姆 《什么是好小说》
|
||||||
BIN
themes/JuiceBar/exampleSite/static/images/avatar.jpg
Normal file
BIN
themes/JuiceBar/exampleSite/static/images/avatar.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
BIN
themes/JuiceBar/exampleSite/static/images/profile.jpg
Normal file
BIN
themes/JuiceBar/exampleSite/static/images/profile.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 75 KiB |
BIN
themes/JuiceBar/images/hopeless-cloud.png
Normal file
BIN
themes/JuiceBar/images/hopeless-cloud.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 775 B |
6
themes/JuiceBar/layouts/404.html
Normal file
6
themes/JuiceBar/layouts/404.html
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<div class="container">
|
||||||
|
<p>Page not found</p>
|
||||||
|
<p><a href="/">Go to Home Page</a></p>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
12
themes/JuiceBar/layouts/_default/about.html
Normal file
12
themes/JuiceBar/layouts/_default/about.html
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
{{/* 单个帖子的模板 */}}
|
||||||
|
{{ define "main" }}
|
||||||
|
<div class="single-container is-centered">
|
||||||
|
<div class="archive">
|
||||||
|
<h1 class="title is-1">{{ .Title }}</h1>
|
||||||
|
<div class="content about-content">
|
||||||
|
{{ .Content }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
13
themes/JuiceBar/layouts/_default/baseof.html
Normal file
13
themes/JuiceBar/layouts/_default/baseof.html
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="{{ .Site.LanguageCode }}">
|
||||||
|
{{- partial "head.html" . -}}
|
||||||
|
<body>
|
||||||
|
{{- partial "header.html" . -}}
|
||||||
|
<main>
|
||||||
|
{{- block "main" . }}{{- end }}
|
||||||
|
</main>
|
||||||
|
{{- partial "footer.html" . -}}
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
5
themes/JuiceBar/layouts/_default/index.json
Normal file
5
themes/JuiceBar/layouts/_default/index.json
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
{{- $.Scratch.Add "index" slice -}}
|
||||||
|
{{- range .Site.RegularPages -}}
|
||||||
|
{{- $.Scratch.Add "index" (dict "title" .Title "tags" .Params.tags "categories" .Params.categories "contents" .Plain "permalink" .Permalink "date" .Date "section" .Section) -}}
|
||||||
|
{{- end -}}
|
||||||
|
{{- $.Scratch.Get "index" | jsonify -}}
|
||||||
16
themes/JuiceBar/layouts/_default/list.html
Normal file
16
themes/JuiceBar/layouts/_default/list.html
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
{{/* 列表类型页面的通用模板.点击blog之后展示出来的页面 */}}
|
||||||
|
{{/* user：为博客文章列表创建一个索引页面。
|
||||||
|
>> hugo new blog/_index.md */}}
|
||||||
|
{{ define "main" }}
|
||||||
|
<div class="container">
|
||||||
|
<div class="section">
|
||||||
|
<div class="content">
|
||||||
|
<h1>{{ .Title }}</h1>
|
||||||
|
{{ .Content }}
|
||||||
|
{{ range .Pages.ByPublishDate.Reverse }}
|
||||||
|
<a href="{{ .Permalink }}">{{ .Title }}</a>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
15
themes/JuiceBar/layouts/_default/single.html
Normal file
15
themes/JuiceBar/layouts/_default/single.html
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
{{- with site.Params.homeInfoParams }}
|
||||||
|
<article class="first-entry home-info">
|
||||||
|
<header class="entry-header">
|
||||||
|
<h1>{{ .Title }}</h1>
|
||||||
|
</header>
|
||||||
|
<div class="entry-content">
|
||||||
|
{{ .Content}}
|
||||||
|
</div>
|
||||||
|
<footer class="entry-footer">
|
||||||
|
{{ partial "social_icons.html" site.Params.socialIcons }}
|
||||||
|
</footer>
|
||||||
|
</article>
|
||||||
|
{{- end -}}
|
||||||
|
{{ end }}
|
||||||
26
themes/JuiceBar/layouts/_default/summary.html
Normal file
26
themes/JuiceBar/layouts/_default/summary.html
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
<article class="post">
|
||||||
|
<div class="single-container column is-centered">
|
||||||
|
<div class="archive" id="post-container">
|
||||||
|
<header class="post-header">
|
||||||
|
<h1 class="post-title hover-underline-animation"><a class="post-link" href="{{ .RelPermalink }}">{{ .Title
|
||||||
|
}}</a></h1>
|
||||||
|
|
||||||
|
|
||||||
|
</header>
|
||||||
|
<div class="post-content">
|
||||||
|
<div class="excerpt post-summary">
|
||||||
|
{{ if .Params.protected}}
|
||||||
|
<p>Psst! The article you seek is guarded by a mischievous password, hidden within the realms of whimsy and giggles. Unleash your inner unicorn, sprinkle some sparkle, and let the charm of curiosity guide you to unlock its enchanting secrets!</p>
|
||||||
|
{{ else }}
|
||||||
|
{{ .Summary }}
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="post-time-container">
|
||||||
|
<span class="post-time"> {{ .Date.Format (.Site.Params.dateFormatToUse | default "2006-01-02") }} </span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
23
themes/JuiceBar/layouts/categories/taxonomy.html
Normal file
23
themes/JuiceBar/layouts/categories/taxonomy.html
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<div class="container">
|
||||||
|
<div class="section">
|
||||||
|
<h2 class="archive-title">Category: {{ .Title }}</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="each-category column is-centered">
|
||||||
|
|
||||||
|
|
||||||
|
{{ range .Paginator.Pages}}
|
||||||
|
|
||||||
|
<article class="archive-item">
|
||||||
|
<a href="{{ .Permalink }}" class="archive-item-link hover-underline-animation">{{ .Title }}</a>
|
||||||
|
<span class="archive-item-date">
|
||||||
|
{{ .Date.Format "January 2, 2006" }}
|
||||||
|
</span>
|
||||||
|
|
||||||
|
</article>
|
||||||
|
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
33
themes/JuiceBar/layouts/categories/terms.html
Normal file
33
themes/JuiceBar/layouts/categories/terms.html
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<div class="container">
|
||||||
|
<div class="section">
|
||||||
|
<div class="content">
|
||||||
|
<h1>{{ .Title }}</h1>
|
||||||
|
{{ .Content }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section class="card-container" >
|
||||||
|
|
||||||
|
{{ range .Data.Terms.ByCount }}
|
||||||
|
<div class="card">
|
||||||
|
|
||||||
|
<a href="{{ .Page.Permalink }}">
|
||||||
|
</a>
|
||||||
|
<div class="card-content has-text-centered">
|
||||||
|
<div>
|
||||||
|
<a class="title is-5 is-size-6-mobile" href="{{ .Page.Permalink }}">{{ .Page.Title }}</a>
|
||||||
|
{{ $pageCount := len .Pages }}
|
||||||
|
<strong>
|
||||||
|
<sup style="font-size:16px;">{{ $pageCount }}</sup>
|
||||||
|
</strong>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{{ end }}
|
||||||
51
themes/JuiceBar/layouts/index.html
Normal file
51
themes/JuiceBar/layouts/index.html
Normal file
@ -0,0 +1,51 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<article>
|
||||||
|
{{- with site.Params}}
|
||||||
|
<div class="is-centered">
|
||||||
|
<div class="title subtitle heading is-6">
|
||||||
|
<div id="home-box" >
|
||||||
|
{{ with .imageUrl }}
|
||||||
|
<div class="avatar-container">
|
||||||
|
<img src="{{.}}" class="author-avatar">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<h1 id="home-title" class="title is-1 ">{{ .Title }}</h1>
|
||||||
|
<div class="description column content typewriter-effect">
|
||||||
|
<div class="text" id="typewriter-text"> {{ .Content }}</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<script>
|
||||||
|
const typeWriter = document.getElementById('typewriter-text');
|
||||||
|
typeWriter.style.setProperty('--characters', typeWriter.innerHTML.length);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="social-icon">
|
||||||
|
|
||||||
|
{{ range .Social }}
|
||||||
|
<a href="{{ .url }}" title="{{ .name }}"><span class="change-color icon">
|
||||||
|
{{ partial "svg.html" . }}
|
||||||
|
</span></a>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{- end -}}
|
||||||
|
|
||||||
|
</article>
|
||||||
|
<div class="summary">
|
||||||
|
{{- $paginator := .Paginate (where (where .Site.RegularPages "Type" "post") ".Params.draft" "!=" true) }}
|
||||||
|
{{ range $paginator.Pages }}
|
||||||
|
{{ .Render "summary" }}
|
||||||
|
{{ end }}
|
||||||
|
{{ partial "pagination.html" . }}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
49
themes/JuiceBar/layouts/partials/comment.html
Normal file
49
themes/JuiceBar/layouts/partials/comment.html
Normal file
@ -0,0 +1,49 @@
|
|||||||
|
{{- if isset .Site.Params "giscus" -}}
|
||||||
|
<hr style="border-top: 1px solid #EEEEEE;">
|
||||||
|
<div id="comment"></div>
|
||||||
|
<script>
|
||||||
|
const getStoredTheme = () => localStorage.getItem("theme") === "dark" ? "dark" : "light";
|
||||||
|
|
||||||
|
const setGiscusTheme = () => {
|
||||||
|
const sendMessage = (message) => {
|
||||||
|
const iframe = document.querySelector('iframe.giscus-frame');
|
||||||
|
if (iframe) {
|
||||||
|
iframe.contentWindow.postMessage({giscus: message}, 'https://giscus.app');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
sendMessage({setConfig: {theme: getStoredTheme()}})
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
|
const giscusAttributes = {
|
||||||
|
"src": "https://giscus.app/client.js",
|
||||||
|
"data-repo": "{{ .Site.Params.giscus.repo }}",
|
||||||
|
"data-repo-id": "{{ .Site.Params.giscus.repoID }}",
|
||||||
|
"data-category": "{{ .Site.Params.giscus.category }}",
|
||||||
|
"data-category-id": "{{ .Site.Params.giscus.categoryID }}",
|
||||||
|
"data-mapping": "{{ default " pathname" .Site.Params.giscus.mapping }}",
|
||||||
|
"data-reactions-enabled": "{{ default "1" .Site.Params.giscus.reactionsEnabled }}",
|
||||||
|
"data-emit-metadata": "{{ default "0" .Site.Params.giscus.emitMetadata }}",
|
||||||
|
"data-input-position": "{{ default "bottom" .Site.Params.giscus.inputPosition }}",
|
||||||
|
"data-theme": getStoredTheme(),
|
||||||
|
"data-lang": "{{ default "en" .Site.Params.giscus.lang }}",
|
||||||
|
"data-loading": "{{ default "lazy" .Site.Params.giscus.loading }}",
|
||||||
|
"crossorigin": "anonymous",
|
||||||
|
};
|
||||||
|
|
||||||
|
// Dynamically create script tag.
|
||||||
|
const giscusScript = document.createElement("script");
|
||||||
|
Object.entries(giscusAttributes).forEach(
|
||||||
|
([key, value]) => giscusScript.setAttribute(key, value));
|
||||||
|
document.getElementById("comment").appendChild(giscusScript);
|
||||||
|
|
||||||
|
// Update giscus theme when the theme switcher is clicked.
|
||||||
|
const themeToggle = document.querySelector(".theme-toggle");
|
||||||
|
if (themeToggle) {
|
||||||
|
themeToggle.addEventListener("click", setGiscusTheme);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
</script>
|
||||||
|
{{end}}
|
||||||
|
|
||||||
14
themes/JuiceBar/layouts/partials/footer.html
Normal file
14
themes/JuiceBar/layouts/partials/footer.html
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
<footer class="footer">
|
||||||
|
<div class="content has-text-centered">
|
||||||
|
{{- if site.Copyright }}
|
||||||
|
<span>{{ site.Copyright | markdownify }}</span>
|
||||||
|
{{- else }}
|
||||||
|
<span>© {{ now.Year }} <a href="{{ "" | absLangURL }}">{{ site.Title }}</a></span>
|
||||||
|
{{- end }}
|
||||||
|
<span>
|
||||||
|
Powered by
|
||||||
|
<a href="https://gohugo.io/" target="_blank">Hugo</a> &
|
||||||
|
<a href="https://github.com/hotjuicew/hugo-JuiceBar" target="_blank">JuiceBar</a>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
19
themes/JuiceBar/layouts/partials/head.html
Normal file
19
themes/JuiceBar/layouts/partials/head.html
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
||||||
|
<title>{{ if not .IsHome }}{{ with .Title }}{{ . }} | {{ end }}{{ end }}{{ .Site.Title }}</title>
|
||||||
|
<meta name="description"
|
||||||
|
content="{{ with .Description }}{{ . }}{{ else }}{{ with .Summary }}{{ . }}{{ else }}{{ .Site.Params.description }}{{end }}{{ end }}">
|
||||||
|
<link rel="canonical" href="{{ .Permalink }}" />
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.min.css">
|
||||||
|
{{ $styles := resources.Get "scss/style.scss" | toCSS | minify | fingerprint }}
|
||||||
|
<link rel="stylesheet" href="{{ $styles.Permalink }}">
|
||||||
|
|
||||||
|
{{ template "_internal/opengraph.html" . }}
|
||||||
|
{{ template "_internal/twitter_cards.html" . }}
|
||||||
|
{{ if not (in (string .Site.BaseURL) "localhost") }}
|
||||||
|
{{ template "_internal/google_analytics_async.html" . }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
</head>
|
||||||
102
themes/JuiceBar/layouts/partials/header.html
Normal file
102
themes/JuiceBar/layouts/partials/header.html
Normal file
@ -0,0 +1,102 @@
|
|||||||
|
<nav class="navbar is-light" role="navigation">
|
||||||
|
<div class="container">
|
||||||
|
<div class="navbar-brand">
|
||||||
|
<a href="/" title="home" class="navbar-item">
|
||||||
|
<span class="logo">
|
||||||
|
<h1>{{ .Site.Title }}</h1>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<!-- sun icon -->
|
||||||
|
<a id="theme-toggle" class="theme-toggle" href="#">
|
||||||
|
<img src="{{ .Site.BaseURL }}svg/sun.svg" alt="sun icon" class="theme-icon" />
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
|
||||||
|
<span aria-hidden="true"></span>
|
||||||
|
<span aria-hidden="true"></span>
|
||||||
|
<span aria-hidden="true"></span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="navbar-menu">
|
||||||
|
<div class="navbar-start">
|
||||||
|
{{ range .Site.Menus.main }}
|
||||||
|
<a href="{{ .URL }}" class="navbar-item">{{ .Name }}</a>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="search">
|
||||||
|
<div id="fastSearch">
|
||||||
|
<input id="searchInput" tabindex="0" placeholder="Search..">
|
||||||
|
<ul id="searchResults">
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a id="search-btn" style="display: inline-block;" href="# ">
|
||||||
|
<div class="icon-search"><svg class="search-svg" xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentcolor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg></div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="/js/fuse.min.js"></script> <!-- download and copy over fuse.min.js file from fusejs.io -->
|
||||||
|
<script src="/js/fastsearch.js"></script>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
//hamburger icon on a mobile device.
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
var burger = document.querySelector('.navbar-burger');
|
||||||
|
burger.addEventListener('click', function() {
|
||||||
|
burger.classList.toggle('is-active');
|
||||||
|
document.querySelector('.navbar-menu').classList.toggle('is-active');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// theme color switch
|
||||||
|
function setTheme(theme) {
|
||||||
|
let body = document.body;
|
||||||
|
let themeIcon = document.querySelector(".theme-icon");
|
||||||
|
if (theme === "dark") {
|
||||||
|
body.classList.add("dark-mode");
|
||||||
|
themeIcon.src = "{{ .Site.BaseURL }}svg/moon.svg";
|
||||||
|
themeIcon.alt = "moon icon";
|
||||||
|
} else {
|
||||||
|
body.classList.remove("dark-mode");
|
||||||
|
themeIcon.src = "{{ .Site.BaseURL }}svg/sun.svg";
|
||||||
|
themeIcon.alt = "sun icon";
|
||||||
|
}
|
||||||
|
// Save the user-selected theme mode to local storage.
|
||||||
|
localStorage.setItem("theme", theme);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Retrieve the user-selected theme mode from local storage
|
||||||
|
let theme = localStorage.getItem("theme") || "light";
|
||||||
|
const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||||
|
if (isDarkMode) {
|
||||||
|
// Site is in dark mode
|
||||||
|
setTheme('dark');
|
||||||
|
|
||||||
|
} else {
|
||||||
|
// Site is in light mode
|
||||||
|
setTheme('light');
|
||||||
|
}
|
||||||
|
setTheme(theme);
|
||||||
|
|
||||||
|
// Toggle theme when sun icon is clicked
|
||||||
|
document.getElementById("theme-toggle").addEventListener("click", function() {
|
||||||
|
if (theme === "light") {
|
||||||
|
theme = "dark";
|
||||||
|
} else {
|
||||||
|
theme = "light";
|
||||||
|
}
|
||||||
|
setTheme(theme);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</header>
|
||||||
15
themes/JuiceBar/layouts/partials/pagination.html
Normal file
15
themes/JuiceBar/layouts/partials/pagination.html
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
<hr>
|
||||||
|
<section class="pagination" >
|
||||||
|
{{ if .Paginator.HasPrev }}
|
||||||
|
|
||||||
|
<button class="button ">
|
||||||
|
<a href="{{ .Paginator.Prev.URL }}" class="pag-link"> Prev </a>
|
||||||
|
</button>
|
||||||
|
{{ end }}
|
||||||
|
<label class="pag-link">Page {{ .Paginator.PageNumber}} of {{.Paginator.TotalPages}}</label>
|
||||||
|
{{ if .Paginator.HasNext }}
|
||||||
|
<button class="button" >
|
||||||
|
<a href="{{ .Paginator.Next.URL }}" class="pag-link"> Next </a>
|
||||||
|
</button>
|
||||||
|
{{ end }}
|
||||||
|
</section>
|
||||||
217
themes/JuiceBar/layouts/partials/svg.html
Normal file
217
themes/JuiceBar/layouts/partials/svg.html
Normal file
@ -0,0 +1,217 @@
|
|||||||
|
{{- $icon_name := ( .name|lower )}}
|
||||||
|
{{- if (eq $icon_name "123rf") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path style="font-variation-settings:normal"
|
||||||
|
d="M7.48 3.826c-.702 0-1.345.388-1.675 1.008l-.711 1.334a4.214 4.214 0 0 1-1.614 1.67l-.388.224a2.207 2.207 0 0 0-1.104 1.913v8.607c0 .878.712 1.592 1.59 1.592h1.186c.468 0 .916-.19 1.244-.524l1.478-1.504c.266-.27.628-.421 1.006-.421h7.04c.378 0 .74.151 1.005.421l1.478 1.504c.329.334.778.524 1.247.524h1.183c.879 0 1.592-.714 1.592-1.592V9.975c0-.79-.422-1.518-1.106-1.912l-.388-.225a4.214 4.214 0 0 1-1.613-1.67l-.711-1.334a1.899 1.899 0 0 0-1.676-1.008z"
|
||||||
|
stroke-linejoin="miter" />
|
||||||
|
<circle cx="12" cy="12.467" r="2.723" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "adobestock") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path style="font-variation-settings:normal" d="M2.235 2.235h19.53v19.53H2.235z" />
|
||||||
|
<path style="font-variation-settings:normal"
|
||||||
|
d="M6.165 16.659s3.16 1.2 4.602-.17c1.37-1.3.787-3.163-.754-4.05-1.68-.969-3.284-1.788-3.036-3.536.446-3.138 4.386-1.851 4.386-1.851M15.792 7.794v7.774c0 1.023.635 1.766 2.043 1.624M17.826 10.04h-3.582" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "applemusic") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none">
|
||||||
|
<path
|
||||||
|
d="M23.994 6.124a9.23 9.23 0 00-.24-2.19c-.317-1.31-1.062-2.31-2.18-3.043a5.022 5.022 0 00-1.877-.726 10.496 10.496 0 00-1.564-.15c-.04-.003-.083-.01-.124-.013H5.986c-.152.01-.303.017-.455.026-.747.043-1.49.123-2.193.4-1.336.53-2.3 1.452-2.865 2.78-.192.448-.292.925-.363 1.408-.056.392-.088.785-.1 1.18 0 .032-.007.062-.01.093v12.223c.01.14.017.283.027.424.05.815.154 1.624.497 2.373.65 1.42 1.738 2.353 3.234 2.801.42.127.856.187 1.293.228.555.053 1.11.06 1.667.06h11.03a12.5 12.5 0 001.57-.1c.822-.106 1.596-.35 2.295-.81a5.046 5.046 0 001.88-2.207c.186-.42.293-.87.37-1.324.113-.675.138-1.358.137-2.04-.002-3.8 0-7.595-.003-11.393zm-6.423 3.99v5.712c0 .417-.058.827-.244 1.206-.29.59-.76.962-1.388 1.14-.35.1-.706.157-1.07.173-.95.045-1.773-.6-1.943-1.536a1.88 1.88 0 011.038-2.022c.323-.16.67-.25 1.018-.324.378-.082.758-.153 1.134-.24.274-.063.457-.23.51-.516a.904.904 0 00.02-.193c0-1.815 0-3.63-.002-5.443a.725.725 0 00-.026-.185c-.04-.15-.15-.243-.304-.234-.16.01-.318.035-.475.066-.76.15-1.52.303-2.28.456l-2.325.47-1.374.278c-.016.003-.032.01-.048.013-.277.077-.377.203-.39.49-.002.042 0 .086 0 .13-.002 2.602 0 5.204-.003 7.805 0 .42-.047.836-.215 1.227-.278.64-.77 1.04-1.434 1.233-.35.1-.71.16-1.075.172-.96.036-1.755-.6-1.92-1.544-.14-.812.23-1.685 1.154-2.075.357-.15.73-.232 1.108-.31.287-.06.575-.116.86-.177.383-.083.583-.323.6-.714v-.15c0-2.96 0-5.922.002-8.882 0-.123.013-.25.042-.37.07-.285.273-.448.546-.518.255-.066.515-.112.774-.165.733-.15 1.466-.296 2.2-.444l2.27-.46c.67-.134 1.34-.27 2.01-.403.22-.043.442-.088.663-.106.31-.025.523.17.554.482.008.073.012.148.012.223.002 1.91.002 3.822 0 5.732z" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "applepodcasts") -}}
|
||||||
|
<svg height="32px" width="32px" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
|
||||||
|
<path
|
||||||
|
d="M5.34 0A5.328 5.328 0 000 5.34v13.32A5.328 5.328 0 005.34 24h13.32A5.328 5.328 0 0024 18.66V5.34A5.328 5.328 0 0018.66 0zm6.525 2.568c2.336 0 4.448.902 6.056 2.587 1.224 1.272 1.912 2.619 2.264 4.392.12.59.12 2.2.007 2.864a8.506 8.506 0 01-3.24 5.296c-.608.46-2.096 1.261-2.336 1.261-.088 0-.096-.091-.056-.46.072-.592.144-.715.48-.856.536-.224 1.448-.874 2.008-1.435a7.644 7.644 0 002.008-3.536c.208-.824.184-2.656-.048-3.504-.728-2.696-2.928-4.792-5.624-5.352-.784-.16-2.208-.16-3 0-2.728.56-4.984 2.76-5.672 5.528-.184.752-.184 2.584 0 3.336.456 1.832 1.64 3.512 3.192 4.512.304.2.672.408.824.472.336.144.408.264.472.856.04.36.03.464-.056.464-.056 0-.464-.176-.896-.384l-.04-.03c-2.472-1.216-4.056-3.274-4.632-6.012-.144-.706-.168-2.392-.03-3.04.36-1.74 1.048-3.1 2.192-4.304 1.648-1.737 3.768-2.656 6.128-2.656zm.134 2.81c.409.004.803.04 1.106.106 2.784.62 4.76 3.408 4.376 6.174-.152 1.114-.536 2.03-1.216 2.88-.336.43-1.152 1.15-1.296 1.15-.023 0-.048-.272-.048-.603v-.605l.416-.496c1.568-1.878 1.456-4.502-.256-6.224-.664-.67-1.432-1.064-2.424-1.246-.64-.118-.776-.118-1.448-.008-1.02.167-1.81.562-2.512 1.256-1.72 1.704-1.832 4.342-.264 6.222l.413.496v.608c0 .336-.027.608-.06.608-.03 0-.264-.16-.512-.36l-.034-.011c-.832-.664-1.568-1.842-1.872-2.997-.184-.698-.184-2.024.008-2.72.504-1.878 1.888-3.335 3.808-4.019.41-.145 1.133-.22 1.814-.211zm-.13 2.99c.31 0 .62.06.844.178.488.253.888.745 1.04 1.259.464 1.578-1.208 2.96-2.72 2.254h-.015c-.712-.331-1.096-.956-1.104-1.77 0-.733.408-1.371 1.112-1.745.224-.117.534-.176.844-.176zm-.011 4.728c.988-.004 1.706.349 1.97.97.198.464.124 1.932-.218 4.302-.232 1.656-.36 2.074-.68 2.356-.44.39-1.064.498-1.656.288h-.003c-.716-.257-.87-.605-1.164-2.644-.341-2.37-.416-3.838-.218-4.302.262-.616.974-.966 1.97-.97z" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "bilibili") -}}
|
||||||
|
<svg height="32px" width="32px" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||||
|
xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<rect x="1.3333" y="6" width="21.333" height="15.333" rx="4" ry="4" />
|
||||||
|
<path d="m8 12.4v1.2" />
|
||||||
|
<path d="m16 12.4v1.2" />
|
||||||
|
<path d="m5.8853 2.6667 2.6667 2.6667" />
|
||||||
|
<path d="m18.115 2.6667-2.6667 2.6667" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "bitcoin") -}}
|
||||||
|
<svg height="32px" width="32px" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
|
||||||
|
<path
|
||||||
|
d="M23.638 14.904c-1.602 6.43-8.113 10.34-14.542 8.736C2.67 22.05-1.244 15.525.362 9.105 1.962 2.67 8.475-1.243 14.9.358c6.43 1.605 10.342 8.115 8.738 14.548v-.002zm-6.35-4.613c.24-1.59-.974-2.45-2.64-3.03l.54-2.153-1.315-.33-.525 2.107c-.345-.087-.705-.167-1.064-.25l.526-2.127-1.32-.33-.54 2.165c-.285-.067-.565-.132-.84-.2l-1.815-.45-.35 1.407s.975.225.955.236c.535.136.63.486.615.766l-1.477 5.92c-.075.166-.24.406-.614.314.015.02-.96-.24-.96-.24l-.66 1.51 1.71.426.93.242-.54 2.19 1.32.327.54-2.17c.36.1.705.19 1.05.273l-.51 2.154 1.32.33.545-2.19c2.24.427 3.93.257 4.64-1.774.57-1.637-.03-2.58-1.217-3.196.854-.193 1.5-.76 1.68-1.93h.01zm-3.01 4.22c-.404 1.64-3.157.75-4.05.53l.72-2.9c.896.23 3.757.67 3.33 2.37zm.41-4.24c-.37 1.49-2.662.735-3.405.55l.654-2.64c.744.18 3.137.524 2.75 2.084v.006z" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "email") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 21" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
|
||||||
|
<polyline points="22,6 12,13 2,6"></polyline>
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "facebook") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "github") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22">
|
||||||
|
</path>
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "gitlab") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M22.65 14.39L12 22.13 1.35 14.39a.84.84 0 0 1-.3-.94l1.22-3.78 2.44-7.51A.42.42 0 0 1 4.82 2a.43.43 0 0 1 .58 0 .42.42 0 0 1 .11.18l2.44 7.49h8.1l2.44-7.51A.42.42 0 0 1 18.6 2a.43.43 0 0 1 .58 0 .42.42 0 0 1 .11.18l2.44 7.51L23 13.45a.84.84 0 0 1-.35.94z">
|
||||||
|
</path>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "instagram") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect>
|
||||||
|
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path>
|
||||||
|
<line x1="17.5" y1="6.5" x2="17.5" y2="6.5"></line>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "linkedin") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path>
|
||||||
|
<rect x="2" y="9" width="4" height="12"></rect>
|
||||||
|
<circle cx="4" cy="4" r="2"></circle>
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "mastodon") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M21.58 13.913c-.29 1.469-2.592 3.121-5.238 3.396-1.379.184-2.737.368-4.185.276-2.368-.092-4.237-.551-4.237-.551 0 .184.014.459.043.643.308 2.294 2.317 2.478 4.22 2.57 1.922 0 3.633-.46 3.633-.46l.079 1.653s-1.344.734-3.738.918c-1.32.091-2.96-.092-4.869-.551-4.14-1.102-4.853-5.507-4.961-10.005-.034-1.285-.013-2.57-.013-3.58 0-4.589 3-5.966 3-5.966 1.513-.734 4.11-1.01 6.808-1.01h.067c2.699 0 5.296.276 6.81 1.01 0 0 3 1.377 3 5.967 0 0 .037 3.304-.419 5.69"
|
||||||
|
stroke="currentColor" />
|
||||||
|
<path
|
||||||
|
d="M17.832 8.633v5h-1.978V8.78c0-1.023-.43-1.542-1.29-1.542-.95 0-1.427.616-1.427 1.834v2.655H11.17V9.072c0-1.218-.476-1.834-1.427-1.834-.86 0-1.29.52-1.29 1.542v4.852H6.475V8.633c0-1.022.26-1.834.782-2.434.538-.6 1.243-.909 2.118-.909 1.012 0 1.779.39 2.286 1.169l.492.827.493-.827c.507-.78 1.274-1.169 2.286-1.169.875 0 1.58.308 2.118.909.522.6.782 1.412.782 2.434"
|
||||||
|
fill="currentColor" stroke="none" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "medium") -}}
|
||||||
|
<svg height="32px" width="32px" version="1.0" xmlns="http://www.w3.org/2000/svg" fill="currentColor" stroke-width="2"
|
||||||
|
viewBox="0 0 76.000000 76.000000" preserveAspectRatio="xMidYMid meet">
|
||||||
|
<g transform="translate(0.000000,76.000000) scale(0.100000,-0.100000)">
|
||||||
|
<path
|
||||||
|
d="M0 380 l0 -380 380 0 380 0 0 380 0 380 -380 0 -380 0 0 -380z m334 85 c30 -63 57 -115 59 -115 2 0 16 30 31 68 15 37 37 88 49 115 l20 47 76 0 76 -1 -27 -20 -28 -21 0 -151 c0 -150 0 -151 27 -179 l27 -28 -109 0 -109 0 27 28 c26 27 27 32 26 143 0 131 3 134 -71 -58 -24 -62 -48 -113 -53 -113 -6 0 -17 16 -24 35 -7 19 -36 83 -64 142 l-52 108 -3 -98 c-3 -97 -2 -99 28 -133 16 -19 30 -39 30 -44 0 -6 -31 -10 -70 -10 -45 0 -70 4 -70 11 0 6 14 27 30 46 30 33 30 35 30 151 0 116 0 118 -31 155 l-30 37 75 0 76 0 54 -115z" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "paypal") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M7.144 19.532l1.049-5.751c.11-.606.691-1.002 1.304-.948 2.155.192 6.877.1 8.818-4.002 2.554-5.397-.59-7.769-6.295-7.769H7.43a1.97 1.97 0 0 0-1.944 1.655L2.77 19.507a.857.857 0 0 0 .846.994h2.368a1.18 1.18 0 0 0 1.161-.969zM7.967 22.522a.74.74 0 0 0 .666.416h2.313c.492 0 .923-.351 1.003-.837l.759-4.601c.095-.523.597-.866 1.127-.819 1.86.166 5.567-.118 6.85-3.821.554-1.6.705-2.954.408-4.018"
|
||||||
|
style="font-variation-settings:normal" stroke="currentColor" stroke-linejoin="miter" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "peertube") -}}
|
||||||
|
<svg height="32px" width="32px" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
|
||||||
|
<path d="M12 6.545v10.91L20.727 12M3.273 12v12L12 17.455M3.273 0v12L12 6.545" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "phone") -}}
|
||||||
|
<svg height="32px" width="32px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<rect x="9" y="4" width="6" height="1" rx="0.5" fill="currentColor" />
|
||||||
|
<path
|
||||||
|
d="M12 20C12.2652 20 12.5196 19.8946 12.7071 19.7071C12.8946 19.5196 13 19.2652 13 19C13 18.7348 12.8946 18.4804 12.7071 18.2929C12.5196 18.1054 12.2652 18 12 18C11.7348 18 11.4804 18.1054 11.2929 18.2929C11.1054 18.4804 11 18.7348 11 19C11 19.2652 11.1054 19.5196 11.2929 19.7071C11.4804 19.8946 11.7348 20 12 20Z"
|
||||||
|
fill="currentColor" />
|
||||||
|
<rect x="5" y="1" width="14" height="22" rx="2" stroke="currentColor" stroke-width="2" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "qq") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path transform="scale(0.04) translate(75 40)" stroke-width="50"
|
||||||
|
d="M433.754 420.445c-11.526 1.393-44.86-52.741-44.86-52.741 0 31.345-16.136 72.247-51.051 101.786 16.842 5.192 54.843 19.167 45.803 34.421-7.316 12.343-125.51 7.881-159.632 4.037-34.122 3.844-152.316 8.306-159.632-4.037-9.045-15.25 28.918-29.214 45.783-34.415-34.92-29.539-51.059-70.445-51.059-101.792 0 0-33.334 54.134-44.859 52.741-5.37-.65-12.424-29.644 9.347-99.704 10.261-33.024 21.995-60.478 40.144-105.779C60.683 98.063 108.982.006 224 0c113.737.006 163.156 96.133 160.264 214.963 18.118 45.223 29.912 72.85 40.144 105.778 21.768 70.06 14.716 99.053 9.346 99.704z">
|
||||||
|
</path>
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "reddit") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none" stroke-width="1">
|
||||||
|
<path
|
||||||
|
d="M24 11.779c0-1.459-1.192-2.645-2.657-2.645-.715 0-1.363.286-1.84.746-1.81-1.191-4.259-1.949-6.971-2.046l1.483-4.669 4.016.941-.006.058c0 1.193.975 2.163 2.174 2.163 1.198 0 2.172-.97 2.172-2.163s-.975-2.164-2.172-2.164c-.92 0-1.704.574-2.021 1.379l-4.329-1.015c-.189-.046-.381.063-.44.249l-1.654 5.207c-2.838.034-5.409.798-7.3 2.025-.474-.438-1.103-.712-1.799-.712-1.465 0-2.656 1.187-2.656 2.646 0 .97.533 1.811 1.317 2.271-.052.282-.086.567-.086.857 0 3.911 4.808 7.093 10.719 7.093s10.72-3.182 10.72-7.093c0-.274-.029-.544-.075-.81.832-.447 1.405-1.312 1.405-2.318zm-17.224 1.816c0-.868.71-1.575 1.582-1.575.872 0 1.581.707 1.581 1.575s-.709 1.574-1.581 1.574-1.582-.706-1.582-1.574zm9.061 4.669c-.797.793-2.048 1.179-3.824 1.179l-.013-.003-.013.003c-1.777 0-3.028-.386-3.824-1.179-.145-.144-.145-.379 0-.523.145-.145.381-.145.526 0 .65.647 1.729.961 3.298.961l.013.003.013-.003c1.569 0 2.648-.315 3.298-.962.145-.145.381-.144.526 0 .145.145.145.379 0 .524zm-.189-3.095c-.872 0-1.581-.706-1.581-1.574 0-.868.709-1.575 1.581-1.575s1.581.707 1.581 1.575-.709 1.574-1.581 1.574z" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "rss") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M4 11a9 9 0 0 1 9 9" />
|
||||||
|
<path d="M4 4a16 16 0 0 1 16 16" />
|
||||||
|
<circle cx="5" cy="19" r="1" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "slack") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M22.08 9C19.81 1.41 16.54-.35 9 1.92S-.35 7.46 1.92 15 7.46 24.35 15 22.08 24.35 16.54 22.08 9z"></path>
|
||||||
|
<line x1="12.57" y1="5.99" x2="16.15" y2="16.39"></line>
|
||||||
|
<line x1="7.85" y1="7.61" x2="11.43" y2="18.01"></line>
|
||||||
|
<line x1="16.39" y1="7.85" x2="5.99" y2="11.43"></line>
|
||||||
|
<line x1="18.01" y1="12.57" x2="7.61" y2="16.15"></line>
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "snapchat") -}}
|
||||||
|
<svg height="32px" width="32px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
|
||||||
|
<path
|
||||||
|
d="M12.206.793c.99 0 4.347.276 5.93 3.821.529 1.193.403 3.219.299 4.847l-.003.06c-.012.18-.022.345-.03.51.075.045.203.09.401.09.3-.016.659-.12 1.033-.301.165-.088.344-.104.464-.104.182 0 .359.029.509.09.45.149.734.479.734.838.015.449-.39.839-1.213 1.168-.089.029-.209.075-.344.119-.45.135-1.139.36-1.333.81-.09.224-.061.524.12.868l.015.015c.06.136 1.526 3.475 4.791 4.014.255.044.435.27.42.509 0 .075-.015.149-.045.225-.24.569-1.273.988-3.146 1.271-.059.091-.12.375-.164.57-.029.179-.074.36-.134.553-.076.271-.27.405-.555.405h-.03c-.135 0-.313-.031-.538-.074-.36-.075-.765-.135-1.273-.135-.3 0-.599.015-.913.074-.6.104-1.123.464-1.723.884-.853.599-1.826 1.288-3.294 1.288-.06 0-.119-.015-.18-.015h-.149c-1.468 0-2.427-.675-3.279-1.288-.599-.42-1.107-.779-1.707-.884-.314-.045-.629-.074-.928-.074-.54 0-.958.089-1.272.149-.211.043-.391.074-.54.074-.374 0-.523-.224-.583-.42-.061-.192-.09-.389-.135-.567-.046-.181-.105-.494-.166-.57-1.918-.222-2.95-.642-3.189-1.226-.031-.063-.052-.15-.055-.225-.015-.243.165-.465.42-.509 3.264-.54 4.73-3.879 4.791-4.02l.016-.029c.18-.345.224-.645.119-.869-.195-.434-.884-.658-1.332-.809-.121-.029-.24-.074-.346-.119-1.107-.435-1.257-.93-1.197-1.273.09-.479.674-.793 1.168-.793.146 0 .27.029.383.074.42.194.789.3 1.104.3.234 0 .384-.06.465-.105l-.046-.569c-.098-1.626-.225-3.651.307-4.837C7.392 1.077 10.739.807 11.727.807l.419-.015h.06z" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "spotify") -}}
|
||||||
|
<svg height="32px" width="32px" fill="currentColor" stoke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path
|
||||||
|
d="M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.599-1.559.3z" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "stackoverflow") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M2.913 16.041v6.848h17.599v-6.848M7.16 18.696h8.925M7.65 13.937l8.675 1.8M9.214 9.124l8.058 3.758M12.086 4.65l6.849 5.66M15.774 1.111l5.313 7.162" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "steam") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" stroke="none">
|
||||||
|
<path
|
||||||
|
d="M11.979 0C5.678 0 .511 4.86.022 11.037l6.432 2.658c.545-.371 1.203-.59 1.912-.59.063 0 .125.004.188.006l2.861-4.142V8.91c0-2.495 2.028-4.524 4.524-4.524 2.494 0 4.524 2.031 4.524 4.527s-2.03 4.525-4.524 4.525h-.105l-4.076 2.911c0 .052.004.105.004.159 0 1.875-1.515 3.396-3.39 3.396-1.635 0-3.016-1.173-3.331-2.727L.436 15.27C1.862 20.307 6.486 24 11.979 24c6.627 0 11.999-5.373 11.999-12S18.605 0 11.979 0zM7.54 18.21l-1.473-.61c.262.543.714.999 1.314 1.25 1.297.539 2.793-.076 3.332-1.375.263-.63.264-1.319.005-1.949s-.75-1.121-1.377-1.383c-.624-.26-1.29-.249-1.878-.03l1.523.63c.956.4 1.409 1.5 1.009 2.455-.397.957-1.497 1.41-2.454 1.012H7.54zm11.415-9.303c0-1.662-1.353-3.015-3.015-3.015-1.665 0-3.015 1.353-3.015 3.015 0 1.665 1.35 3.015 3.015 3.015 1.663 0 3.015-1.35 3.015-3.015zm-5.273-.005c0-1.252 1.013-2.266 2.265-2.266 1.249 0 2.266 1.014 2.266 2.266 0 1.251-1.017 2.265-2.266 2.265-1.253 0-2.265-1.014-2.265-2.265z" />
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "telegram") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M21.198 2.433a2.242 2.242 0 0 0-1.022.215l-8.609 3.33c-2.068.8-4.133 1.598-5.724 2.21a405.15 405.15 0 0 1-2.849 1.09c-.42.147-.99.332-1.473.901-.728.968.193 1.798.919 2.286 1.61.516 3.275 1.009 4.654 1.472.509 1.793.997 3.592 1.48 5.388.16.36.506.494.864.498l-.002.018s.281.028.555-.038a2.1 2.1 0 0 0 .933-.517c.345-.324 1.28-1.244 1.811-1.764l3.999 2.952.032.018s.442.311 1.09.355c.324.022.75-.04 1.116-.308.37-.27.613-.702.728-1.196.342-1.492 2.61-12.285 2.997-14.072l-.01.042c.27-1.006.17-1.928-.455-2.474a1.654 1.654 0 0 0-1.034-.407z" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "tiktok") -}}
|
||||||
|
<svg height="32px" width="32px" version="1.0" xmlns="http://www.w3.org/2000/svg" fill="currentColor" stroke-width="2"
|
||||||
|
viewBox="0 0 76.000000 76.000000" preserveAspectRatio="xMidYMid meet">
|
||||||
|
<path d="M65.9,19.4c1.4,0.2,2.8,0.1,2.8,0.1s0,6.2,0,12.2c-6.3,0-12.1-2-16.8-5.4V51c0.1,20-24.6,29.8-38.3,15.6
|
||||||
|
c-14.7-15.1-2.1-40.5,19-37.7v12.3c-9.5-3-17.2,8-11.2,15.9c5.8,7.7,18.3,3.6,18.3-6.1c0,0,0-48.2,0-48.2c2.4,0,9.9,0,12.2,0v1.6
|
||||||
|
c0.7,7.4,6.1,13.4,13.3,15v0C65.4,19.3,65.6,19.4,65.9,19.4z" />
|
||||||
|
</svg>
|
||||||
|
{{- else if (eq $icon_name "twitter") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z">
|
||||||
|
</path>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
{{- else if (eq $icon_name "youtube") -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path
|
||||||
|
d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z">
|
||||||
|
</path>
|
||||||
|
<polygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"></polygon>
|
||||||
|
</svg>
|
||||||
|
{{- else if $icon_name -}}
|
||||||
|
<svg height="32px" width="32px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path>
|
||||||
|
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path>
|
||||||
|
</svg>
|
||||||
|
{{- end -}}
|
||||||
34
themes/JuiceBar/layouts/partials/toc.html
Normal file
34
themes/JuiceBar/layouts/partials/toc.html
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
{{- $toc := .TableOfContents -}}
|
||||||
|
{{- if $toc -}}
|
||||||
|
<!-- When the $toc variable is not empty, generate the table of contents for the article -->
|
||||||
|
<div class="post-toc">
|
||||||
|
{{ if and (gt .WordCount 80) (.Params.toc | default true) }}
|
||||||
|
<aside>
|
||||||
|
<button id="tocButton" ><h4 id="contents" style="margin-left: 1vw;color:rgb(96, 134, 180);margin-bottom: 0;">CONTENTS</h4></button>
|
||||||
|
<div id="hide">
|
||||||
|
{{- $toc := replaceRE `<ul>\n<li>\n<ul>` `<ul>` $toc -}}
|
||||||
|
{{- safeHTML $toc -}}
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
{{- end -}}
|
||||||
|
<script>
|
||||||
|
// document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
let button = document.getElementById('tocButton');
|
||||||
|
let hide = document.getElementById("hide");
|
||||||
|
let contents=document.getElementById("contents");
|
||||||
|
button.addEventListener("click", function() {
|
||||||
|
if (hide.style.display!='block') {
|
||||||
|
hide.style.display='block'
|
||||||
|
} else {
|
||||||
|
hide.style.display='none'
|
||||||
|
contents.style.color='rgb(96, 134, 180)'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
// });
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
32
themes/JuiceBar/layouts/post/list.html
Normal file
32
themes/JuiceBar/layouts/post/list.html
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<div class="container">
|
||||||
|
<div class="section">
|
||||||
|
<div class="content">
|
||||||
|
<h1 class="h1-title">Archives</h1>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="archive-container column is-centered">
|
||||||
|
<div class="archive">
|
||||||
|
|
||||||
|
{{ range (where (where site.RegularPages "Type" "in" site.Params.mainSections) ".Params.draft" "!=" true).GroupByDate "2006" }}
|
||||||
|
<h2 class="archive-title">{{ .Key }}</h2>
|
||||||
|
{{ range .Pages }}
|
||||||
|
{{/* {{ range .Paginators.Pages }} */}}
|
||||||
|
|
||||||
|
<article class="archive-item">
|
||||||
|
<a href="{{ .Permalink }}" class="archive-item-link hover-underline-animation">{{ .Title }}</a>
|
||||||
|
<span class="archive-item-date">
|
||||||
|
{{ .Date.Format "January 2, 2006" }}
|
||||||
|
</span>
|
||||||
|
|
||||||
|
</article>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
{{ end }}
|
||||||
144
themes/JuiceBar/layouts/post/single.html
Normal file
144
themes/JuiceBar/layouts/post/single.html
Normal file
@ -0,0 +1,144 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
{{ if .Params.protected }}
|
||||||
|
<div id="verification">
|
||||||
|
<!-- Show password entry box -->
|
||||||
|
<div id="secret-word">Unlock it!</div>
|
||||||
|
<form id="password-form" onsubmit="checkPassword(); return false;">
|
||||||
|
<input type="password" name="password" id="password" placeholder="Please enter password" required>
|
||||||
|
<input type="hidden" name="encryptedPassword" id="encrypted-password">
|
||||||
|
<input type="submit" value="Submit" name="submit" id="submit">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
<!-- Display unencrypted diary contents -->
|
||||||
|
<div class="single-container {{ if .Params.protected }}hidden{{ end }}">
|
||||||
|
<div class="archive">
|
||||||
|
<h1 class="title is-1">{{ .Title }}</h1>
|
||||||
|
<div class="title subtitle heading is-6">
|
||||||
|
<div class="author-info columns is-vcentered">
|
||||||
|
<div class="column">
|
||||||
|
<div class="columns is-vcentered is-mobile">
|
||||||
|
{{ with .Site.Params.authorImage }}
|
||||||
|
<div class="column is-narrow">
|
||||||
|
<img src="{{ . }}" class="author-image">
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
<div class="column">
|
||||||
|
<p>{{ .Site.Params.Author }}</p>
|
||||||
|
<p><time>{{ .PublishDate.Format "January 2, 2006" }}</time>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="small-categories-container">
|
||||||
|
{{ range $idx, $category := .Params.categories }}
|
||||||
|
{{- if ne $idx 0 }}, {{ end }}<a href="{{ " categories/" | relURL }}{{ $category | urlize }}">{{
|
||||||
|
$category }}</a>
|
||||||
|
{{- end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content article-content">
|
||||||
|
<div class="toc-container">
|
||||||
|
{{ partial "toc.html" . }}
|
||||||
|
</div>
|
||||||
|
{{ .Content }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a href="#" id="scrollToTopButton">
|
||||||
|
<svg t="1686753152588" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||||
|
p-id="3988" width="48" height="48">
|
||||||
|
<path
|
||||||
|
d="M518.5 360.3c-3.2-4.4-9.7-4.4-12.9 0l-178 246c-3.8 5.3 0 12.7 6.5 12.7H381c10.2 0 19.9-4.9 25.9-13.2L512 460.4l105.2 145.4c6 8.3 15.6 13.2 25.9 13.2H690c6.5 0 10.3-7.4 6.5-12.7l-178-246z"
|
||||||
|
p-id="3989" fill="#FAB005"></path>
|
||||||
|
<path
|
||||||
|
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64z m0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
|
||||||
|
p-id="3990" fill="#FAB005"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
{{- /* Comment */ -}}
|
||||||
|
{{- partial "comment.html" . -}}
|
||||||
|
<div class="pp-container">
|
||||||
|
<section class="pre-and-post">
|
||||||
|
<div class="has-text-left">
|
||||||
|
{{ with .PrevInSection }}
|
||||||
|
<p>Previous post</p>
|
||||||
|
<a href="{{ .Permalink }}">{{ .Title }}</a>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
<div class="has-text-right">
|
||||||
|
{{ with .NextInSection }}
|
||||||
|
<p>Next post</p>
|
||||||
|
<a href="{{ .Permalink }}">{{ .Title }}</a>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<script></script>
|
||||||
|
<script>
|
||||||
|
// Quickly reach the top of the article
|
||||||
|
document.getElementById('scrollToTopButton').addEventListener('click', function () {
|
||||||
|
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||||||
|
});
|
||||||
|
console.log('window.matchMedia("(max-width: 768px)").matches', window.matchMedia("(max-width: 768px)").matches)
|
||||||
|
//Set the element to be displayed on mobile only when the mouse is scrolled up, not when it is scrolled down
|
||||||
|
// if (window.matchMedia("(max-width: 768px)").matches) {
|
||||||
|
// var prevScrollPos = window.pageYOffset;
|
||||||
|
|
||||||
|
// window.addEventListener('scroll', function () {
|
||||||
|
// var currentScrollPos = window.pageYOffset;
|
||||||
|
|
||||||
|
// if (currentScrollPos < prevScrollPos) {
|
||||||
|
// document.querySelector('#scrollToTopButton').style.display = 'block';
|
||||||
|
// } else {
|
||||||
|
// document.querySelector('#scrollToTopButton').style.display = 'none';
|
||||||
|
// }
|
||||||
|
|
||||||
|
// prevScrollPos = currentScrollPos;
|
||||||
|
// });
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// Set the mobile SUBMIT width to the width of the input box
|
||||||
|
const passwordInput = document.querySelector("#password");
|
||||||
|
const submitButton = document.querySelector("#submit");
|
||||||
|
passwordInput.style.width = (passwordInput.scrollWidth) + "px";
|
||||||
|
submitButton.style.width = window.getComputedStyle(passwordInput).width;
|
||||||
|
|
||||||
|
window.addEventListener('DOMContentLoaded', () => {
|
||||||
|
const submitButton = document.getElementById('submit');
|
||||||
|
submitButton.addEventListener('click', function (event) {
|
||||||
|
event.preventDefault(); // Blocking the default form submission behavior
|
||||||
|
checkPassword();
|
||||||
|
});
|
||||||
|
|
||||||
|
function checkPassword() {
|
||||||
|
const passwordInput = document.querySelector('input[name="password"]');
|
||||||
|
const password = passwordInput.value;
|
||||||
|
const correctPassword = "{{ .Params.password }}"; // Get the correct password from the article's meta information
|
||||||
|
|
||||||
|
if (password === correctPassword) {
|
||||||
|
// Password verification successful, display the original content
|
||||||
|
document.getElementById("verification").style.display = "none";
|
||||||
|
document.querySelector(".single-container").classList.remove('hidden');
|
||||||
|
//Hide password parameters
|
||||||
|
hidePasswordFromURL()
|
||||||
|
} else {
|
||||||
|
// Password verification failed, error message displayed
|
||||||
|
alert("Incorrect password. Please try again.");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function hidePasswordFromURL() {
|
||||||
|
const urlParams = new URLSearchParams(window.location.search);
|
||||||
|
urlParams.set('password', '******');
|
||||||
|
const newURL = window.location.pathname + '?' + urlParams.toString();
|
||||||
|
window.history.replaceState({}, '', newURL);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
{{ end }}
|
||||||
2
themes/JuiceBar/layouts/shortcodes/rawhtml.html
Normal file
2
themes/JuiceBar/layouts/shortcodes/rawhtml.html
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
<!-- raw html -->
|
||||||
|
{{.Inner}}
|
||||||
180
themes/JuiceBar/static/js/fastsearch.js
Normal file
180
themes/JuiceBar/static/js/fastsearch.js
Normal file
@ -0,0 +1,180 @@
|
|||||||
|
var fuse; // holds our search engine
|
||||||
|
var fuseIndex;
|
||||||
|
var searchVisible = false;
|
||||||
|
var firstRun = true; // allow us to delay loading json data unless search activated
|
||||||
|
var list = document.getElementById('searchResults'); // targets the <ul>
|
||||||
|
var first = list.firstChild; // first child of search list
|
||||||
|
var last = list.lastChild; // last child of search list
|
||||||
|
var maininput = document.getElementById('searchInput'); // input box for search
|
||||||
|
var resultsAvailable = false; // Did we get any search results?
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// The main keyboard event listener running the show
|
||||||
|
//
|
||||||
|
document.addEventListener('keydown', function(event) {
|
||||||
|
|
||||||
|
// CMD-/ to show / hide Search
|
||||||
|
if (event.altKey && event.which === 191) {
|
||||||
|
// Load json search index if first time invoking search
|
||||||
|
// Means we don't load json unless searches are going to happen; keep user payload small unless needed
|
||||||
|
doSearch(event)
|
||||||
|
}
|
||||||
|
|
||||||
|
// Allow ESC (27) to close search box
|
||||||
|
if (event.keyCode == 27) {
|
||||||
|
if (searchVisible) {
|
||||||
|
document.getElementById("fastSearch").style.visibility = "hidden";
|
||||||
|
document.activeElement.blur();
|
||||||
|
searchVisible = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// DOWN (40) arrow
|
||||||
|
if (event.keyCode == 40) {
|
||||||
|
if (searchVisible && resultsAvailable) {
|
||||||
|
console.log("down");
|
||||||
|
event.preventDefault(); // stop window from scrolling
|
||||||
|
if ( document.activeElement == maininput) { first.focus(); } // if the currently focused element is the main input --> focus the first <li>
|
||||||
|
else if ( document.activeElement == last ) { last.focus(); } // if we're at the bottom, stay there
|
||||||
|
else { document.activeElement.parentElement.nextSibling.firstElementChild.focus(); } // otherwise select the next search result
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// UP (38) arrow
|
||||||
|
if (event.keyCode == 38) {
|
||||||
|
if (searchVisible && resultsAvailable) {
|
||||||
|
event.preventDefault(); // stop window from scrolling
|
||||||
|
if ( document.activeElement == maininput) { maininput.focus(); } // If we're in the input box, do nothing
|
||||||
|
else if ( document.activeElement == first) { maininput.focus(); } // If we're at the first item, go to input box
|
||||||
|
else { document.activeElement.parentElement.previousSibling.firstElementChild.focus(); } // Otherwise, select the search result above the current active one
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// execute search as each character is typed
|
||||||
|
//
|
||||||
|
document.getElementById("searchInput").onkeyup = function(e) {
|
||||||
|
executeSearch(this.value);
|
||||||
|
}
|
||||||
|
|
||||||
|
document.querySelector("body").onclick = function(e) {
|
||||||
|
if (e.target.tagName === 'BODY' || e.target.tagName === 'DIV') {
|
||||||
|
hideSearch()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.querySelector("#search-btn").onclick = function(e) {
|
||||||
|
doSearch(e)
|
||||||
|
}
|
||||||
|
|
||||||
|
function doSearch(e) {
|
||||||
|
e.stopPropagation();
|
||||||
|
if (firstRun) {
|
||||||
|
loadSearch() // loads our json data and builds fuse.js search index
|
||||||
|
firstRun = false // let's never do this again
|
||||||
|
}
|
||||||
|
// Toggle visibility of search box
|
||||||
|
if (!searchVisible) {
|
||||||
|
showSearch() // search visible
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
hideSearch()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function hideSearch() {
|
||||||
|
document.getElementById("fastSearch").style.visibility = "hidden" // hide search box
|
||||||
|
document.activeElement.blur() // remove focus from search box
|
||||||
|
searchVisible = false
|
||||||
|
}
|
||||||
|
|
||||||
|
function showSearch() {
|
||||||
|
document.getElementById("fastSearch").style.visibility = "visible" // show search box
|
||||||
|
document.getElementById("searchInput").focus() // put focus in input box so you can just start typing
|
||||||
|
searchVisible = true
|
||||||
|
}
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// fetch some json without jquery
|
||||||
|
//
|
||||||
|
function fetchJSONFile(path, callback) {
|
||||||
|
var httpRequest = new XMLHttpRequest();
|
||||||
|
httpRequest.onreadystatechange = function() {
|
||||||
|
if (httpRequest.readyState === 4) {
|
||||||
|
if (httpRequest.status === 200) {
|
||||||
|
var data = JSON.parse(httpRequest.responseText);
|
||||||
|
if (callback) callback(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
httpRequest.open('GET', path);
|
||||||
|
httpRequest.send();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// load our search index, only executed once
|
||||||
|
// on first call of search box (CMD-/)
|
||||||
|
//
|
||||||
|
function loadSearch() {
|
||||||
|
console.log('loadSearch()')
|
||||||
|
fetchJSONFile('/index.json', function(data){
|
||||||
|
|
||||||
|
var options = { // fuse.js options; check fuse.js website for details
|
||||||
|
shouldSort: true,
|
||||||
|
location: 0,
|
||||||
|
distance: 100,
|
||||||
|
threshold: 0.4,
|
||||||
|
minMatchCharLength: 2,
|
||||||
|
keys: [
|
||||||
|
'permalink',
|
||||||
|
'title',
|
||||||
|
'tags',
|
||||||
|
'contents'
|
||||||
|
]
|
||||||
|
};
|
||||||
|
// Create the Fuse index
|
||||||
|
fuseIndex = Fuse.createIndex(options.keys, data)
|
||||||
|
fuse = new Fuse(data, options, fuseIndex); // build the index from the json file
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// ==========================================
|
||||||
|
// using the index we loaded on CMD-/, run
|
||||||
|
// a search query (for "term") every time a letter is typed
|
||||||
|
// in the search box
|
||||||
|
//
|
||||||
|
function executeSearch(term) {
|
||||||
|
let results = fuse.search(term); // the actual query being run using fuse.js
|
||||||
|
let searchitems = ''; // our results bucket
|
||||||
|
|
||||||
|
if (results.length === 0) { // no results based on what was typed into the input box
|
||||||
|
resultsAvailable = false;
|
||||||
|
searchitems = '';
|
||||||
|
} else { // build our html
|
||||||
|
// console.log(results)
|
||||||
|
permalinks = [];
|
||||||
|
numLimit = 5;
|
||||||
|
for (let item in results) { // only show first 5 results
|
||||||
|
if (item > numLimit) {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
if (permalinks.includes(results[item].item.permalink)) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
// console.log('item: %d, title: %s', item, results[item].item.title)
|
||||||
|
searchitems = searchitems + '<li><a href="' + results[item].item.permalink + '" tabindex="0">' + '<span class="title">' + results[item].item.title + '</span></a></li>';
|
||||||
|
permalinks.push(results[item].item.permalink);
|
||||||
|
}
|
||||||
|
resultsAvailable = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
document.getElementById("searchResults").innerHTML = searchitems;
|
||||||
|
if (results.length > 0) {
|
||||||
|
first = list.firstChild.firstElementChild; // first result container — used for checking against keyboard up/down location
|
||||||
|
last = list.lastChild.firstElementChild; // last result container — used for checking against keyboard up/down location
|
||||||
|
}
|
||||||
|
}
|
||||||
9
themes/JuiceBar/static/js/fuse.min.js
vendored
Normal file
9
themes/JuiceBar/static/js/fuse.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
3
themes/JuiceBar/static/svg/moon.svg
Normal file
3
themes/JuiceBar/static/svg/moon.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg id="moon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 268 B |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user