Merge branch 'newsletter'
* newsletter: (28 commits) newsletter section: only show list when there are pages lower nav height in mobile use content-gap instead of gap for header consistant header gaps subtle adjustments clear debug code finish newsletter archives add newsletter sub box in single enhance inline links fix rss pages query newsletter regular page responsive enlarge post footer bottom border size from 1 to 3px fix all pages query issues in: list, archives, newsletter section, post_nav_links fixup! finish newsletter section styling newsletter section page responsive finish newsletter section styling adjust first-entry ul/ol margin styling newsletter section list rename .list to .list-page styling newsletter sub form ...
This commit is contained in:
Reorx
commit
ae58c91ac4
|
|
@ -4,8 +4,18 @@
|
|||
min-height: calc(100vh - var(--header-height) - var(--footer-height));
|
||||
max-width: calc(var(--main-width) + var(--gap) * 2);
|
||||
margin: auto;
|
||||
padding: var(--gap);
|
||||
padding-bottom: 0;
|
||||
padding: var(--content-gap) var(--gap) 0;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 500px) {
|
||||
.main {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* same as .post-header */
|
||||
.page-header {
|
||||
margin: var(--content-gap) 0 calc(var(--content-gap) * 1.5);
|
||||
}
|
||||
|
||||
.mark-line {
|
||||
|
|
@ -14,7 +24,7 @@
|
|||
}
|
||||
mark {
|
||||
margin: 0 -0.4em;
|
||||
padding: 0.1em 0.4em;
|
||||
padding: 0em 0.4em;
|
||||
border-radius: 0.8em 0.3em;
|
||||
background: transparent;
|
||||
background-image: linear-gradient(
|
||||
|
|
@ -27,6 +37,70 @@ mark {
|
|||
box-decoration-break: clone;
|
||||
}
|
||||
|
||||
/* for home and section page */
|
||||
.first-entry {
|
||||
position: relative;
|
||||
min-height: 320px;
|
||||
margin: var(--gap) 0 calc(var(--gap) * 2) 0;
|
||||
}
|
||||
|
||||
.first-entry .entry-header {
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
margin: var(--gap) 0 calc(var(--gap) * 2);
|
||||
}
|
||||
|
||||
.first-entry .entry-header h1 {
|
||||
font-size: 34px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.first-entry .entry-content {
|
||||
margin: 14px 0;
|
||||
font-size: 17px;
|
||||
color: var(--primary);
|
||||
line-height: 1.6em;
|
||||
display: block;
|
||||
overflow: initial; /* fix <mark> edge get cut */
|
||||
}
|
||||
|
||||
@media screen and (max-width: 500px) {
|
||||
.first-entry .entry-header h1 {
|
||||
font-size: 30px;
|
||||
}
|
||||
.first-entry .entry-content {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.first-entry .entry-content p {
|
||||
margin-bottom: .8em;
|
||||
}
|
||||
.first-entry .entry-content ul,
|
||||
.first-entry .entry-content ol {
|
||||
margin: .8em 0;
|
||||
}
|
||||
.first-entry .entry-content li p {
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
|
||||
.first-entry .entry-footer {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.inline-links a {
|
||||
font-weight: 500;
|
||||
color: var(--primary);
|
||||
box-shadow: var(--link-underline-shadow);
|
||||
transition: var(--link-transition);
|
||||
}
|
||||
.inline-links a:hover {
|
||||
color: var(--link-hover-color);
|
||||
box-shadow: var(--link-hover-underline-shadow);
|
||||
}
|
||||
|
||||
|
||||
/* for post page */
|
||||
.main.post {
|
||||
max-width: calc(var(--post-width) + var(--gap) * 2);
|
||||
|
|
|
|||
|
|
@ -1,46 +1,3 @@
|
|||
.first-entry {
|
||||
position: relative;
|
||||
min-height: 320px;
|
||||
margin: var(--gap) 0 calc(var(--gap) * 2) 0;
|
||||
}
|
||||
|
||||
.first-entry .entry-header {
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
margin: var(--gap) 0 calc(var(--gap) * 2);
|
||||
}
|
||||
|
||||
.first-entry .entry-header h1 {
|
||||
font-size: 34px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
@media screen and (max-width: 400px) {
|
||||
.first-entry .entry-header h1 {
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.first-entry .entry-content {
|
||||
margin: 14px 0;
|
||||
font-size: 17px;
|
||||
color: var(--primary);
|
||||
line-height: 1.6em;
|
||||
display: block;
|
||||
overflow: initial; /* fix <mark> edge get cut */
|
||||
}
|
||||
|
||||
.first-entry .entry-content p {
|
||||
margin-bottom: .8em;
|
||||
}
|
||||
.first-entry .entry-content li p {
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
|
||||
.first-entry .entry-footer {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.home-info .entry-content {
|
||||
-webkit-line-clamp: unset;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,10 @@
|
|||
.page-header,
|
||||
.post-header {
|
||||
margin: 32px 0;
|
||||
margin: var(--content-gap) 0 calc(var(--content-gap) * 1.5);
|
||||
}
|
||||
|
||||
.post-title {
|
||||
font-size: 40px;
|
||||
margin: var(--content-gap) 0;
|
||||
margin-bottom: var(--content-gap);
|
||||
}
|
||||
|
||||
.post-description {
|
||||
|
|
@ -401,6 +400,8 @@ h6:hover .anchor {
|
|||
|
||||
.post-footer {
|
||||
margin-top: calc(var(--content-gap) * 1.5);
|
||||
padding-bottom: calc(var(--content-gap) * 2);
|
||||
border-bottom: 3px solid var(--tertiary);
|
||||
}
|
||||
|
||||
.share-buttons {
|
||||
|
|
@ -453,7 +454,7 @@ h6:hover .anchor {
|
|||
}
|
||||
|
||||
.paginav {
|
||||
margin: var(--content-gap) 0;
|
||||
margin-top: var(--content-gap);
|
||||
display: flex;
|
||||
line-height: 30px;
|
||||
border-radius: var(--radius);
|
||||
|
|
@ -574,10 +575,7 @@ h6:hover .anchor {
|
|||
}
|
||||
|
||||
.comments {
|
||||
border-top: 1px solid var(--tertiary);
|
||||
}
|
||||
.comments {
|
||||
margin: 40px 0 20px;
|
||||
margin: var(--content-gap) 0;
|
||||
}
|
||||
.comments .title {
|
||||
margin: 20px 0;
|
||||
|
|
@ -593,6 +591,7 @@ h6:hover .anchor {
|
|||
vertical-align: super;
|
||||
}
|
||||
|
||||
/* footnotes */
|
||||
.footnotes {
|
||||
font-size: .8em;
|
||||
color: var(--primary-dim);
|
||||
|
|
|
|||
|
|
@ -117,7 +117,7 @@ img {
|
|||
background: 0 0;
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-track {
|
||||
.list-page:not(.dark)::-webkit-scrollbar-track {
|
||||
background: var(--code-bg);
|
||||
}
|
||||
|
||||
|
|
@ -127,7 +127,7 @@ img {
|
|||
border-radius: var(--radius);
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-thumb {
|
||||
.list-page:not(.dark)::-webkit-scrollbar-thumb {
|
||||
border: 5px solid var(--code-bg);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -27,6 +27,12 @@
|
|||
--link-transition: all 0.3s ease;
|
||||
--line-yellow: url("data:image/svg+xml;charset=utf-8,%3Csvg preserveAspectRatio='none' width='120' height='6' viewBox='0 0 120 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M119 0.8C60 4 50-0.5 1 1.5' stroke='%23fc0' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
|
||||
}
|
||||
@media screen and (max-width: 500px) {
|
||||
:root {
|
||||
--header-height: 52px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.dark {
|
||||
--theme: rgb(29, 30, 32);
|
||||
|
|
@ -47,10 +53,10 @@
|
|||
--link-hover-underline-shadow: 0 2px 0 var(--link-hover-underline-color);
|
||||
}
|
||||
|
||||
.list {
|
||||
.list-page {
|
||||
background: var(--code-bg);
|
||||
}
|
||||
|
||||
.dark.list {
|
||||
.dark.list-page {
|
||||
background: var(--theme);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
|
||||
/* footer */
|
||||
@media screen and (max-width: 900px) {
|
||||
.list .top-link {
|
||||
.list-page .top-link {
|
||||
transform: translateY(-5rem);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
300
assets/css/extended/newsletter.scss
Normal file
300
assets/css/extended/newsletter.scss
Normal file
|
|
@ -0,0 +1,300 @@
|
|||
/*
|
||||
color candidates:
|
||||
#CB3A56 茜色
|
||||
#F05654 銀紅
|
||||
#F20C00 石榴紅
|
||||
#FF2D51 火紅
|
||||
*/
|
||||
|
||||
$medium: 960px;
|
||||
$small: 500px;
|
||||
|
||||
body.type-newsletter {
|
||||
--signature: #CB3A56;
|
||||
--signature-bg: rgba(203, 58, 87, 0.239);
|
||||
--signature-bg-dim: rgba(203, 58, 87, 0.147);
|
||||
--main-border: 5px solid var(--signature);
|
||||
--icon-length: 50px;
|
||||
--icon-font-size: 32px;
|
||||
|
||||
// override theme-vars
|
||||
--link-hover-color: var(--signature);
|
||||
--link-hover-underline-color: var(--signature);
|
||||
--link-hover-underline-shadow: 0 2px 0 var(--link-hover-underline-color);
|
||||
|
||||
@media screen and (max-width: $small) {
|
||||
--icon-length: 40px;
|
||||
--icon-font-size: 24px;
|
||||
}
|
||||
|
||||
/* a links in section/archives page content and regular page post-content */
|
||||
&.kind-section .main .content a,
|
||||
&.layout-archives .main .content a,
|
||||
&.kind-page .post-content a {
|
||||
font-weight: 500;
|
||||
color: var(--primary);
|
||||
box-shadow: var(--link-underline-shadow);
|
||||
// transition: var(--link-transition);
|
||||
&:hover {
|
||||
color: var(--link-hover-color);
|
||||
box-shadow: var(--link-hover-underline-shadow);
|
||||
}
|
||||
}
|
||||
|
||||
/* shared */
|
||||
.sub-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: calc(var(--content-gap) * 1.5) 0;
|
||||
form {
|
||||
display: flex;
|
||||
line-height: 1.2em;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
input {
|
||||
border: 3px solid var(--signature-bg-dim);
|
||||
color: var(--secondary);
|
||||
border-radius: 0px;
|
||||
appearance: none;
|
||||
outline: none;
|
||||
background-color: var(--theme);
|
||||
flex-grow: 1;
|
||||
padding: 9px 15px;
|
||||
transition: var(--link-transition);
|
||||
|
||||
&:focus {
|
||||
color: var(--primary);
|
||||
border-color: var(--signature);
|
||||
}
|
||||
}
|
||||
button {
|
||||
display: block;
|
||||
background-color: var(--signature);
|
||||
color: var(--theme);
|
||||
padding: 12px 15px;
|
||||
margin-left: var(--content-gap);
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: $small) {
|
||||
.sub-form {
|
||||
button {
|
||||
margin-left: 0;
|
||||
margin-top: calc(var(--content-gap)/2);
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
body.type-newsletter.kind-section,
|
||||
body.type-newsletter.layout-archives {
|
||||
/* section/archives page */
|
||||
|
||||
.main {
|
||||
border: var(--main-border);
|
||||
background-color: var(--theme);
|
||||
margin-top: var(--content-gap);
|
||||
padding-top: 0;
|
||||
padding-bottom: var(--icon-length);
|
||||
min-height: calc(100vh - var(--header-height) - var(--footer-height) - var(--content-gap));
|
||||
max-width: var(--nav-width);
|
||||
|
||||
@media screen and (max-width: $medium) {
|
||||
margin-left: var(--gap);
|
||||
margin-right: var(--gap);
|
||||
}
|
||||
}
|
||||
|
||||
.main-icon {
|
||||
position: absolute;
|
||||
left: 0; top: 0;
|
||||
width: var(--icon-length);
|
||||
height: var(--icon-length);
|
||||
line-height: calc(var(--icon-length) - 3px);
|
||||
border-right: var(--main-border);
|
||||
border-bottom: var(--main-border);
|
||||
background-color: var(--signature);
|
||||
color: var(--theme);
|
||||
font-size: var(--icon-font-size);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.main {
|
||||
.content {
|
||||
max-width: calc(var(--post-width));
|
||||
margin: var(--icon-length) auto 0;
|
||||
}
|
||||
|
||||
.first-entry {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.subtitle {
|
||||
text-align: center;
|
||||
color: var(--secondary);
|
||||
line-height: 1.2em;
|
||||
margin-bottom: var(--content-gap);
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: 40px 0 20px;
|
||||
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: var(--content-gap);
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
border-bottom: 1px solid var(--tertiary-bg);
|
||||
padding: 8px 0;
|
||||
|
||||
.date, .issueno {
|
||||
font-size: .9em;
|
||||
color: var(--secondary);
|
||||
}
|
||||
.date {
|
||||
width: 150px;
|
||||
}
|
||||
.title {
|
||||
flex-grow: 1;
|
||||
font-weight: 500;
|
||||
a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
box-shadow: none;
|
||||
}
|
||||
a:hover {
|
||||
color: var(--signature);
|
||||
}
|
||||
em {
|
||||
color: var(--secondary);
|
||||
font-style: normal;
|
||||
font-size: .8em;
|
||||
margin-inline-start: 1em;
|
||||
vertical-align: top;
|
||||
}
|
||||
}
|
||||
.issueno {
|
||||
width: 50px;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: $small) {
|
||||
.list {
|
||||
.item {
|
||||
flex-wrap: wrap;
|
||||
.date {
|
||||
flex-grow: 1;
|
||||
order: 1;
|
||||
}
|
||||
.issueno {
|
||||
order: 2;
|
||||
}
|
||||
.title {
|
||||
order: 3;
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* regular page */
|
||||
body.type-newsletter.kind-page {
|
||||
.newsletter-brand {
|
||||
--icon-length: 50px;
|
||||
--padding: 15px;
|
||||
display: flex;
|
||||
background-color: var(--signature-bg-dim);
|
||||
transition: var(--link-transition);
|
||||
font-size: 32px;
|
||||
margin-bottom: var(--content-gap);
|
||||
line-height: var(--icon-length);
|
||||
box-shadow: none; // reset
|
||||
|
||||
.icon, .name {
|
||||
height: var(--icon-length);
|
||||
}
|
||||
.icon {
|
||||
width: var(--icon-length);
|
||||
color: var(--theme);
|
||||
text-align: center;
|
||||
background-color: var(--signature);
|
||||
}
|
||||
.name {
|
||||
padding: 0 var(--padding);
|
||||
font-weight: bolder;
|
||||
color: var(--signature);
|
||||
}
|
||||
.remark {
|
||||
color: var(--signature);
|
||||
font-weight: 300;
|
||||
transition: var(--link-transition);
|
||||
}
|
||||
.arrow {
|
||||
margin-left: auto;
|
||||
color: transparent;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: var(--padding);
|
||||
transition: var(--link-transition);
|
||||
}
|
||||
|
||||
&:hover, &:active {
|
||||
box-shadow: none; // reset
|
||||
background-color: var(--signature-bg);
|
||||
.arrow {
|
||||
color: var(--signature);
|
||||
}
|
||||
.remark {
|
||||
color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: $small) {
|
||||
.newsletter-brand {
|
||||
font-size: 24px;
|
||||
.remark {
|
||||
margin-left: auto;
|
||||
padding-right: var(--padding);
|
||||
}
|
||||
.arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.post-title {
|
||||
font-size: 36px;
|
||||
}
|
||||
.post-footer {
|
||||
border-bottom-color: var(--signature);
|
||||
}
|
||||
|
||||
.newsletter-sub {
|
||||
margin-top: calc(var(--content-gap) * 1.5);
|
||||
background-color: var(--signature-bg-dim);
|
||||
padding: 1em;
|
||||
.notice {
|
||||
font-size: .8em;
|
||||
color: var(--signature);
|
||||
line-height: 1.6;
|
||||
}
|
||||
.sub-form {
|
||||
margin: 1em 0;
|
||||
input {
|
||||
border-color: var(--signature-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -9,7 +9,13 @@
|
|||
{{- end }}
|
||||
</header>
|
||||
|
||||
{{- $pages := where site.AllPages "Type" "in" site.Params.mainSections }}
|
||||
{{/* get pages from the current page's section */}}
|
||||
{{/* in this way, archives.html could be used for section archives other than the only one archives of the whole site */}}
|
||||
{{- $sections := site.Params.mainSections }}
|
||||
{{- if .Section }}
|
||||
{{- $sections = slice .Section }}
|
||||
{{- end }}
|
||||
{{- $pages := where (where site.RegularPages "Section" "in" $sections) "Params.hidden" "!=" true }}
|
||||
|
||||
{{- range $pages.GroupByPublishDate "2006" }}
|
||||
{{- if ne .Key "0001" }}
|
||||
|
|
@ -22,7 +28,6 @@
|
|||
<h3 class="archive-month-header">{{- .Key }}<sup class="archive-count"> {{ len .Pages }}</sup></h3>
|
||||
<div class="archive-posts">
|
||||
{{- range .Pages }}
|
||||
{{- if eq .Kind "page" }}
|
||||
<div class="archive-entry">
|
||||
<h3 class="archive-entry-title">
|
||||
{{- .Title | markdownify }}
|
||||
|
|
@ -34,7 +39,6 @@
|
|||
<a class="entry-link" aria-label="post link to {{ .Title | plainify }}" href="{{ .Permalink }}"></a>
|
||||
</div>
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
</div>
|
||||
</div>
|
||||
{{- end }}
|
||||
|
|
|
|||
|
|
@ -8,11 +8,11 @@
|
|||
|
||||
<body class="
|
||||
{{- if (or (ne .Kind `page` ) (eq .Layout `archives`) (eq .Layout `search`)) -}}
|
||||
{{- print "list" -}}
|
||||
{{- print "list-page" -}}
|
||||
{{- end -}}
|
||||
{{- if eq site.Params.defaultTheme `dark` -}}
|
||||
{{- print " dark" }}
|
||||
{{- end -}}
|
||||
{{- end }} type-{{ .Type }} kind-{{ .Kind }} layout-{{ .Layout -}}
|
||||
" id="top">
|
||||
{{- partialCached "header.html" . .Page -}}
|
||||
<main class="main {{- if (eq .Kind `page`) -}}{{- print " post" -}}{{- end -}}">
|
||||
|
|
|
|||
|
|
@ -13,6 +13,14 @@
|
|||
{{ .Description | markdownify }}
|
||||
</div>
|
||||
{{- end }}
|
||||
<div class="inline-links">
|
||||
{{- with .Param "archivesSlug" }}
|
||||
<a href="{{ $.RelPermalink }}{{ . }}/">Archives</a>
|
||||
{{- end }}
|
||||
{{ with .OutputFormats.Get "rss" -}}
|
||||
• <a href="{{ .Permalink }}" target="_blank">RSS</a>
|
||||
{{ end -}}
|
||||
</div>
|
||||
</header>
|
||||
{{- end }}
|
||||
|
||||
|
|
@ -27,7 +35,8 @@
|
|||
|
||||
{{- $pages := .Pages }}
|
||||
{{- if .IsHome }}
|
||||
{{- $pages = where site.RegularPages "Type" "in" site.Params.mainSections }}
|
||||
{{/* get all regular pages instead of pages in a section */}}
|
||||
{{- $pages = where site.RegularPages "Section" "in" site.Params.mainSections }}
|
||||
{{- end }}
|
||||
{{- $pages = where $pages "Params.hidden" "!=" true }}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
{{- $pctx := . -}}
|
||||
{{- if .IsHome -}}{{ $pctx = site }}{{- end -}}
|
||||
{{- $pages := slice -}}
|
||||
{{- if or $.IsHome $.IsSection -}}
|
||||
{{- $pages = where $pctx.RegularPages "Type" "in" site.Params.mainSections }}
|
||||
{{- else -}}
|
||||
{{- $pages = $pctx.Pages -}}
|
||||
{{- end -}}
|
||||
{{- $pages := .Pages -}}
|
||||
{{- if $.IsHome -}}
|
||||
{{/* get all regular pages instead of pages in a section */}}
|
||||
{{- $pages = where site.RegularPages "Section" "in" site.Params.mainSections -}}
|
||||
{{- end }}
|
||||
{{- $pages = where $pages "Params.hidden" "!=" true -}}
|
||||
|
||||
{{- $limit := site.Config.Services.RSS.Limit -}}
|
||||
{{- if ge $limit 1 -}}
|
||||
{{- $pages = $pages | first $limit -}}
|
||||
{{- end -}}
|
||||
|
||||
{{- printf "<?xml version=\"1.0\" encoding=\"utf-8\" standalone=\"yes\"?>" | safeHTML }}
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content/">
|
||||
<channel>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,24 @@
|
|||
{{- define "main" }}
|
||||
{{- $isNewsletter := eq .Type "newsletter" }}
|
||||
|
||||
<article class="post-single">
|
||||
<header class="post-header">
|
||||
{{ partial "breadcrumbs.html" . }}
|
||||
|
||||
{{- if $isNewsletter -}}
|
||||
{{- partial "newsletter_brand.html" . }}
|
||||
{{- end -}}
|
||||
<h1 class="post-title">
|
||||
{{ .Title }}
|
||||
{{- if .Draft }}<sup><span class="entry-isdraft"> [draft]</span></sup>{{- end }}
|
||||
{{- if $isNewsletter -}}
|
||||
{{- replace .Title (.Param "titlePrefix") (.Param "titlePrefixReplace") -}}
|
||||
{{- else -}}
|
||||
{{- .Title -}}
|
||||
{{- end -}}
|
||||
{{- if .Draft -}}<sup><span class="entry-isdraft"> [draft]</span></sup>{{- end -}}
|
||||
</h1>
|
||||
{{- if .Description }}
|
||||
<div class="post-description">
|
||||
{{ .Description }}
|
||||
{{- .Description -}}
|
||||
</div>
|
||||
{{- end }}
|
||||
{{- if not (.Param "hideMeta") }}
|
||||
|
|
@ -43,6 +52,15 @@
|
|||
{{- if (.Param "ShowPostNavLinks") }}
|
||||
{{- partial "post_nav_links.html" . }}
|
||||
{{- end }}
|
||||
|
||||
{{- if $isNewsletter }}
|
||||
<div class="newsletter-sub">
|
||||
<div class="notice">
|
||||
感谢你能读到这里，如果觉得有趣的话，欢迎在下方输入邮箱进行订阅。
|
||||
</div>
|
||||
{{- partial "newsletter_sub_form.html"}}
|
||||
</div>
|
||||
{{- end }}
|
||||
</footer>
|
||||
|
||||
{{- if not (.Param "noComments") }}
|
||||
|
|
|
|||
33
layouts/newsletter/archives.html
Normal file
33
layouts/newsletter/archives.html
Normal file
|
|
@ -0,0 +1,33 @@
|
|||
{{- define "main" }}
|
||||
<div class="main-icon">＠</div>
|
||||
|
||||
<div class="content">
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{- partial "newsletter_sub_form.html"}}
|
||||
|
||||
{{/* get pages from the current page's section */}}
|
||||
{{- $sections := slice .Section }}
|
||||
{{- $pages := where (where site.RegularPages "Section" "in" $sections) "Params.hidden" "!=" true }}
|
||||
|
||||
{{/* TODO statistics */}}
|
||||
<div class="list">
|
||||
{{- range $pages }}
|
||||
<div class="item">
|
||||
<div class="date">
|
||||
{{- if not .Date.IsZero -}}
|
||||
{{ .Date | time.Format (default "January 2, 2006" site.Params.DateFormat) }}
|
||||
{{- end }}
|
||||
</div>
|
||||
<div class="title">
|
||||
<a href="{{ .Permalink }}">{{- .Title }}
|
||||
{{- if .Draft }}<em>[Draft]</em>{{- end }}
|
||||
{{- if .Weight }}<em>[Pinned]</em>{{- end }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="issueno">{{ with .Param "issueno" }}#{{ . }}{{ end }}</div>
|
||||
</div>
|
||||
{{- end }}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{{ end }}
|
||||
50
layouts/newsletter/section.html
Normal file
50
layouts/newsletter/section.html
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
{{/* section is AKA list */}}
|
||||
|
||||
{{- define "main" }}
|
||||
<div class="main-icon">＠</div>
|
||||
|
||||
<div class="content">
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ with .Param "subtitle" }}<div class="subtitle">{{ . }}</div>{{ end }}
|
||||
|
||||
<div class="first-entry">
|
||||
<section class="entry-content">{{ .Description | markdownify }}</section>
|
||||
{{- partial "newsletter_sub_form.html"}}
|
||||
</div>
|
||||
|
||||
{{ $pages := where .Pages "Params.hidden" "!=" true }}
|
||||
{{ if $pages }}
|
||||
<h2>最新通讯</h2>
|
||||
|
||||
<div class="list">
|
||||
{{- range first 5 $pages }}
|
||||
<div class="item">
|
||||
<div class="date">
|
||||
{{- if not .Date.IsZero -}}
|
||||
{{ .Date | time.Format (default "January 2, 2006" site.Params.DateFormat) }}
|
||||
{{- end }}
|
||||
</div>
|
||||
<div class="title">
|
||||
<a href="{{ .Permalink }}">{{- .Title }}
|
||||
{{- if .Draft }}<em>[Draft]</em>{{- end }}
|
||||
{{- if .Weight }}<em>[Pinned]</em>{{- end }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="issueno">{{ with .Param "issueno" }}#{{ . }}{{ end }}</div>
|
||||
</div>
|
||||
{{- end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<h2>相关链接</h2>
|
||||
<div class="inline-links">
|
||||
{{- with .Param "archivesSlug" }}
|
||||
<a href="{{ $.RelPermalink }}{{ . }}/">Archives</a>
|
||||
{{- end }}
|
||||
{{ with .OutputFormats.Get "rss" -}}
|
||||
• <a href="{{ .Permalink }}" target="_blank">RSS</a>
|
||||
{{ end -}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{{ end }}
|
||||
|
|
@ -47,10 +47,11 @@
|
|||
{{- /* order is important */}}
|
||||
{{- $core := (slice $theme_vars $reset $common $commonHighlight $media) | resources.Concat "assets/css/core.css" }}
|
||||
{{- $extended := (resources.Match "css/extended/*.css") | resources.Concat "assets/css/extended.css" }}
|
||||
{{- $extendedScss := (resources.Match "css/extended/*.scss") | resources.Concat "assets/css/extended.scss" | resources.ToCSS }}
|
||||
|
||||
{{- /* bundle all required css */}}
|
||||
{{- /* Add extended css after theme style */ -}}
|
||||
{{- $stylesheet := (slice $core $extended) | resources.Concat "assets/css/stylesheet.css" | minify }}
|
||||
{{- $stylesheet := (slice $core $extended $extendedScss) | resources.Concat "assets/css/stylesheet.css" | minify }}
|
||||
|
||||
{{- if not site.Params.assets.disableFingerprinting }}
|
||||
{{- $stylesheet := $stylesheet | fingerprint }}
|
||||
|
|
@ -125,15 +126,15 @@
|
|||
--border: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
.list {
|
||||
.list-page {
|
||||
background: var(--theme);
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-track {
|
||||
.list-page:not(.dark)::-webkit-scrollbar-track {
|
||||
background: 0 0;
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-thumb {
|
||||
.list-page:not(.dark)::-webkit-scrollbar-thumb {
|
||||
border-color: var(--theme);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -133,7 +133,7 @@ function toggleThemeListener() {
|
|||
<a href="{{ $menu_item_url }}" title="{{ .Title | default .Name }} {{- cond $is_search (" (Alt + /)" | safeHTMLAttr) ("" | safeHTMLAttr ) }}"
|
||||
{{- if $is_search -}}data-no-instant{{- end -}}
|
||||
{{- cond $is_search (" accesskey=/" | safeHTMLAttr) ("" | safeHTMLAttr ) }}
|
||||
{{- if eq $menu_item_url $page_url }} class="active" {{- end }}
|
||||
{{- if strings.HasPrefix $page_url $menu_item_url }} class="active" {{- end }}
|
||||
{{- if .Params.External }} target="_blank" {{- end }}
|
||||
>
|
||||
{{- .Pre }}
|
||||
|
|
|
|||
8
layouts/partials/newsletter_brand.html
Normal file
8
layouts/partials/newsletter_brand.html
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
<a class="newsletter-brand" href="{{ .Parent.Permalink }}">
|
||||
<div class="icon">＠</div>
|
||||
<div class="name">{{ .Param "newsletterName" }}</div>
|
||||
{{ with .Param "issueno" }}<div class="remark">#{{ . }}</div>{{ end }}
|
||||
<div class="arrow">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>
|
||||
</div>
|
||||
</a>
|
||||
8
layouts/partials/newsletter_sub_form.html
Normal file
8
layouts/partials/newsletter_sub_form.html
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
{{/* Add `layouts/partials/newsletter_sub_form.html` in your own code to customize the form */}}
|
||||
|
||||
<div class="sub-form">
|
||||
<form action="">
|
||||
<input type="text" name="email" placeholder="Your email address">
|
||||
<button>订阅 | Subscribe</button>
|
||||
</form>
|
||||
</div>
|
||||
|
|
@ -1,4 +1,10 @@
|
|||
{{- $pages := where site.RegularPages "Type" "in" site.Params.mainSections }}
|
||||
{{/* get pages from the current page's section */}}
|
||||
{{- $sections := site.Params.mainSections }}
|
||||
{{- if .Section }}
|
||||
{{- $sections = slice .Section }}
|
||||
{{- end }}
|
||||
{{- $pages := where (where site.RegularPages "Section" "in" $sections) "Params.hidden" "!=" true }}
|
||||
|
||||
{{- if and (gt (len $pages) 1) (in $pages . ) }}
|
||||
<nav class="paginav">
|
||||
{{- with $pages.Next . }}
|
||||
|
|
|
|||
Loading…
Reference in a new issue