Refactored template code

This commit is contained in:
Brandon Rozek 2022-05-08 18:02:35 -04:00
parent b28e531f9f
commit c3e09727a6
20 changed files with 332 additions and 395 deletions

View file

@ -1,21 +1,21 @@
#contentBody img { main .e-content img {
box-shadow: none; box-shadow: none;
} }
#contentBody hr { main .e-content hr {
border-bottom: 1px solid #201d1a; border-bottom: 1px solid #201d1a;
} }
#contentBody hr { main .e-content hr {
background-color: #1e1b17; background-color: #1e1b17;
} }
#contentBody blockquote { main .e-content blockquote {
color: #958c82; color: #958c82;
border-left: 0.25em solid #201d1a; border-left: 0.25em solid #201d1a;
} }
#contentBody kbd { main .e-content kbd {
color: #bbb2a9; color: #bbb2a9;
background-color: #050403; background-color: #050403;
border: solid 1px #39342e; border: solid 1px #39342e;
@ -23,56 +23,56 @@
box-shadow: none; box-shadow: none;
} }
#contentBody h1 .octicon-link, main .e-content h1 .octicon-link,
#contentBody h2 .octicon-link, main .e-content h2 .octicon-link,
#contentBody h3 .octicon-link, main .e-content h3 .octicon-link,
#contentBody h4 .octicon-link, main .e-content h4 .octicon-link,
#contentBody h5 .octicon-link, main .e-content h5 .octicon-link,
#contentBody h6 .octicon-link { main .e-content h6 .octicon-link {
color: #e4e0dc; color: #e4e0dc;
} }
#contentBody h1 { main .e-content h1 {
border-bottom: 1px solid #363636; border-bottom: 1px solid #363636;
} }
#contentBody h2 { main .e-content h2 {
border-bottom: 1px solid #363636; border-bottom: 1px solid #363636;
} }
#contentBody h6 { main .e-content h6 {
font-size: 0.85em; font-size: 0.85em;
color: #958c82; color: #958c82;
} }
#contentBody table th, main .e-content table th,
#contentBody table td { main .e-content table td {
padding: 6px 13px; padding: 6px 13px;
border: 1px solid #363636; border: 1px solid #363636;
background-color: #090909; background-color: #090909;
} }
#contentBody img { main .e-content img {
background-color: #090909; background-color: #090909;
} }
#contentBody code { main .e-content code {
background-color: #090909; background-color: #090909;
} }
#contentBody .highlight pre, main .e-content .highlight pre,
#contentBody pre { main .e-content pre {
background-color: #090909; background-color: #090909;
} }
#contentBody .full-commit .btn-outline:not(:disabled):hover { main .e-content .full-commit .btn-outline:not(:disabled):hover {
color: #005cc5; color: #005cc5;
border-color: #005cc5; border-color: #005cc5;
} }
#contentBody kbd { main .e-content kbd {
color: #bbb2a9; color: #bbb2a9;
background-color: #050403; background-color: #050403;
border: solid 1px #2e2a25; border: solid 1px #2e2a25;
@ -80,10 +80,10 @@
box-shadow: none; box-shadow: none;
} }
#contentBody :checked+.radio-label { main .e-content :checked+.radio-label {
border-color: #0366d6; border-color: #0366d6;
} }
#contentBody hr { main .e-content hr {
border-bottom-color: #111; border-bottom-color: #111;
} }

View file

@ -1,82 +1,82 @@
#contentBody a { main .e-content a {
background-color: transparent; background-color: transparent;
} }
#contentBody a:active, main .e-content a:active,
#contentBody a:hover { main .e-content a:hover {
outline-width: 0; outline-width: 0;
} }
#contentBody strong { main .e-content strong {
font-weight: inherit; font-weight: inherit;
} }
#contentBody strong { main .e-content strong {
font-weight: bolder; font-weight: bolder;
} }
#contentBody h1 { main .e-content h1 {
font-size: 2em; font-size: 2em;
margin: 0.67em 0; margin: 0.67em 0;
} }
#contentBody img { main .e-content img {
border-style: none; border-style: none;
box-shadow: 0px 3px 15px rgba(0,0,0,0.2); box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
} }
#contentBody code, main .e-content code,
#contentBody kbd, main .e-content kbd,
#contentBody pre { main .e-content pre {
font-family: monospace, monospace; font-family: monospace, monospace;
font-size: 1em; font-size: 1em;
} }
#contentBody hr { main .e-content hr {
box-sizing: content-box; box-sizing: content-box;
height: 0; height: 0;
overflow: visible; overflow: visible;
} }
#contentBody input { main .e-content input {
font: inherit; font: inherit;
margin: 0; margin: 0;
} }
#contentBody input { main .e-content input {
overflow: visible; overflow: visible;
} }
#contentBody [type="checkbox"] { main .e-content [type="checkbox"] {
box-sizing: border-box; box-sizing: border-box;
padding: 0; padding: 0;
} }
#contentBody * { main .e-content * {
box-sizing: border-box; box-sizing: border-box;
} }
#contentBody input { main .e-content input {
font-family: inherit; font-family: inherit;
font-size: inherit; font-size: inherit;
line-height: inherit; line-height: inherit;
} }
#contentBody a { main .e-content a {
/* color: #0366d6; */ /* color: #0366d6; */
/* text-decoration: none; */ /* text-decoration: none; */
text-decoration: underline; text-decoration: underline;
} }
#contentBody a:hover { main .e-content a:hover {
text-decoration: underline; text-decoration: underline;
} }
#contentBody strong { main .e-content strong {
font-weight: 600; font-weight: 600;
} }
#contentBody hr { main .e-content hr {
height: 0; height: 0;
margin: 15px 0; margin: 15px 0;
overflow: hidden; overflow: hidden;
@ -85,190 +85,190 @@
border-bottom: 1px solid #dfe2e5; border-bottom: 1px solid #dfe2e5;
} }
#contentBody hr::before { main .e-content hr::before {
display: table; display: table;
content: ""; content: "";
} }
#contentBody hr::after { main .e-content hr::after {
display: table; display: table;
clear: both; clear: both;
content: ""; content: "";
} }
#contentBody table { main .e-content table {
border-spacing: 0; border-spacing: 0;
border-collapse: collapse; border-collapse: collapse;
} }
#contentBody td, main .e-content td,
#contentBody th { main .e-content th {
padding: 0; padding: 0;
} }
#contentBody h1, main .e-content h1,
#contentBody h2, main .e-content h2,
#contentBody h3, main .e-content h3,
#contentBody h4, main .e-content h4,
#contentBody h5, main .e-content h5,
#contentBody h6 { main .e-content h6 {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
} }
#contentBody h1 { main .e-content h1 {
font-size: 32px; font-size: 32px;
font-weight: 600; font-weight: 600;
} }
#contentBody h2 { main .e-content h2 {
font-size: 24px; font-size: 24px;
font-weight: 600; font-weight: 600;
} }
#contentBody h3 { main .e-content h3 {
font-size: 20px; font-size: 20px;
font-weight: 600; font-weight: 600;
} }
#contentBody h4 { main .e-content h4 {
font-size: 16px; font-size: 16px;
font-weight: 600; font-weight: 600;
} }
#contentBody h5 { main .e-content h5 {
font-size: 14px; font-size: 14px;
font-weight: 600; font-weight: 600;
} }
#contentBody h6 { main .e-content h6 {
font-size: 12px; font-size: 12px;
font-weight: 600; font-weight: 600;
} }
#contentBody p { main .e-content p {
margin-top: 0; margin-top: 0;
margin-bottom: 10px; margin-bottom: 10px;
} }
#contentBody blockquote { main .e-content blockquote {
margin: 0; margin: 0;
} }
#contentBody ul, main .e-content ul,
#contentBody ol { main .e-content ol {
padding-left: 0; padding-left: 0;
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
} }
#contentBody ol ol, main .e-content ol ol,
#contentBody ul ol { main .e-content ul ol {
list-style-type: lower-roman; list-style-type: lower-roman;
} }
#contentBody ul ul ol, main .e-content ul ul ol,
#contentBody ul ol ol, main .e-content ul ol ol,
#contentBody ol ul ol, main .e-content ol ul ol,
#contentBody ol ol ol { main .e-content ol ol ol {
list-style-type: lower-alpha; list-style-type: lower-alpha;
} }
#contentBody dd { main .e-content dd {
margin-left: 0; margin-left: 0;
} }
#contentBody code { main .e-content code {
font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace; font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
font-size: 12px; font-size: 12px;
} }
#contentBody pre { main .e-content pre {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace; font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
font-size: 12px; font-size: 12px;
} }
#contentBody .octicon { main .e-content .octicon {
vertical-align: text-bottom; vertical-align: text-bottom;
} }
#contentBody .pl-0 { main .e-content .pl-0 {
padding-left: 0 !important; padding-left: 0 !important;
} }
#contentBody .pl-1 { main .e-content .pl-1 {
padding-left: 4px !important; padding-left: 4px !important;
} }
#contentBody .pl-2 { main .e-content .pl-2 {
padding-left: 8px !important; padding-left: 8px !important;
} }
#contentBody .pl-3 { main .e-content .pl-3 {
padding-left: 16px !important; padding-left: 16px !important;
} }
#contentBody .pl-4 { main .e-content .pl-4 {
padding-left: 24px !important; padding-left: 24px !important;
} }
#contentBody .pl-5 { main .e-content .pl-5 {
padding-left: 32px !important; padding-left: 32px !important;
} }
#contentBody .pl-6 { main .e-content .pl-6 {
padding-left: 40px !important; padding-left: 40px !important;
} }
#contentBody::before { main .e-content::before {
display: table; display: table;
content: ""; content: "";
} }
#contentBody::after { main .e-content::after {
display: table; display: table;
clear: both; clear: both;
content: ""; content: "";
} }
#contentBody>*:first-child { main .e-content>*:first-child {
margin-top: 0 !important; margin-top: 0 !important;
} }
#contentBody>*:last-child { main .e-content>*:last-child {
margin-bottom: 0 !important; margin-bottom: 0 !important;
} }
#contentBody a:not([href]) { main .e-content a:not([href]) {
color: inherit; color: inherit;
text-decoration: none; text-decoration: none;
} }
#contentBody .anchor { main .e-content .anchor {
float: left; float: left;
padding-right: 4px; padding-right: 4px;
margin-left: -20px; margin-left: -20px;
line-height: 1; line-height: 1;
} }
#contentBody .anchor:focus { main .e-content .anchor:focus {
outline: none; outline: none;
} }
#contentBody p, main .e-content p,
#contentBody blockquote, main .e-content blockquote,
#contentBody ul, main .e-content ul,
#contentBody ol, main .e-content ol,
#contentBody dl, main .e-content dl,
#contentBody table, main .e-content table,
#contentBody pre { main .e-content pre {
margin-top: 0; margin-top: 0;
margin-bottom: 16px; margin-bottom: 16px;
} }
#contentBody hr { main .e-content hr {
height: 0.25em; height: 0.25em;
padding: 0; padding: 0;
margin: 24px 0; margin: 24px 0;
@ -276,21 +276,21 @@
border: 0; border: 0;
} }
#contentBody blockquote { main .e-content blockquote {
padding: 0 1em; padding: 0 1em;
color: #6a737d; color: #6a737d;
border-left: 0.25em solid #dfe2e5; border-left: 0.25em solid #dfe2e5;
} }
#contentBody blockquote>:first-child { main .e-content blockquote>:first-child {
margin-top: 0; margin-top: 0;
} }
#contentBody blockquote>:last-child { main .e-content blockquote>:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
#contentBody kbd { main .e-content kbd {
display: inline-block; display: inline-block;
padding: 3px 5px; padding: 3px 5px;
font-size: 11px; font-size: 11px;
@ -304,106 +304,106 @@
box-shadow: inset 0 -1px 0 #959da5; box-shadow: inset 0 -1px 0 #959da5;
} }
#contentBody h1, main .e-content h1,
#contentBody h2, main .e-content h2,
#contentBody h3, main .e-content h3,
#contentBody h4, main .e-content h4,
#contentBody h5, main .e-content h5,
#contentBody h6 { main .e-content h6 {
margin-top: 24px; margin-top: 24px;
margin-bottom: 16px; margin-bottom: 16px;
font-weight: 600; font-weight: 600;
line-height: 1.25; line-height: 1.25;
} }
#contentBody h1 .octicon-link, main .e-content h1 .octicon-link,
#contentBody h2 .octicon-link, main .e-content h2 .octicon-link,
#contentBody h3 .octicon-link, main .e-content h3 .octicon-link,
#contentBody h4 .octicon-link, main .e-content h4 .octicon-link,
#contentBody h5 .octicon-link, main .e-content h5 .octicon-link,
#contentBody h6 .octicon-link { main .e-content h6 .octicon-link {
color: #1b1f23; color: #1b1f23;
vertical-align: middle; vertical-align: middle;
visibility: hidden; visibility: hidden;
} }
#contentBody h1:hover .anchor, main .e-content h1:hover .anchor,
#contentBody h2:hover .anchor, main .e-content h2:hover .anchor,
#contentBody h3:hover .anchor, main .e-content h3:hover .anchor,
#contentBody h4:hover .anchor, main .e-content h4:hover .anchor,
#contentBody h5:hover .anchor, main .e-content h5:hover .anchor,
#contentBody h6:hover .anchor { main .e-content h6:hover .anchor {
text-decoration: none; text-decoration: none;
} }
#contentBody h1:hover .anchor .octicon-link, main .e-content h1:hover .anchor .octicon-link,
#contentBody h2:hover .anchor .octicon-link, main .e-content h2:hover .anchor .octicon-link,
#contentBody h3:hover .anchor .octicon-link, main .e-content h3:hover .anchor .octicon-link,
#contentBody h4:hover .anchor .octicon-link, main .e-content h4:hover .anchor .octicon-link,
#contentBody h5:hover .anchor .octicon-link, main .e-content h5:hover .anchor .octicon-link,
#contentBody h6:hover .anchor .octicon-link { main .e-content h6:hover .anchor .octicon-link {
visibility: visible; visibility: visible;
} }
#contentBody h1 { main .e-content h1 {
padding-bottom: 0.3em; padding-bottom: 0.3em;
font-size: 2em; font-size: 2em;
border-bottom: 1px solid #c9c9c9; border-bottom: 1px solid #c9c9c9;
} }
#contentBody h2 { main .e-content h2 {
padding-bottom: 0.3em; padding-bottom: 0.3em;
font-size: 1.5em; font-size: 1.5em;
border-bottom: 1px solid #c9c9c9; border-bottom: 1px solid #c9c9c9;
} }
#contentBody h3 { main .e-content h3 {
font-size: 1.25em; font-size: 1.25em;
} }
#contentBody h4 { main .e-content h4 {
font-size: 1em; font-size: 1em;
} }
#contentBody h5 { main .e-content h5 {
font-size: 0.875em; font-size: 0.875em;
} }
#contentBody h6 { main .e-content h6 {
font-size: 0.85em; font-size: 0.85em;
color: #6a737d; color: #6a737d;
} }
#contentBody ul, main .e-content ul,
#contentBody ol { main .e-content ol {
padding-left: 2em; padding-left: 2em;
} }
#contentBody ul ul, main .e-content ul ul,
#contentBody ul ol, main .e-content ul ol,
#contentBody ol ol, main .e-content ol ol,
#contentBody ol ul { main .e-content ol ul {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
} }
#contentBody li { main .e-content li {
word-wrap: break-all; word-wrap: break-all;
} }
#contentBody li>p { main .e-content li>p {
margin-top: 16px; margin-top: 16px;
} }
#contentBody li+li { main .e-content li+li {
margin-top: 0.25em; margin-top: 0.25em;
} }
#contentBody dl { main .e-content dl {
padding: 0; padding: 0;
} }
#contentBody dl dt { main .e-content dl dt {
padding: 0; padding: 0;
margin-top: 16px; margin-top: 16px;
font-size: 1em; font-size: 1em;
@ -411,43 +411,43 @@
font-weight: 600; font-weight: 600;
} }
#contentBody dl dd { main .e-content dl dd {
padding: 0 16px; padding: 0 16px;
margin-bottom: 16px; margin-bottom: 16px;
} }
#contentBody table { main .e-content table {
display: block; display: block;
width: 100%; width: 100%;
overflow: auto; overflow: auto;
} }
#contentBody table th { main .e-content table th {
font-weight: 600; font-weight: 600;
} }
#contentBody table th, main .e-content table th,
#contentBody table td { main .e-content table td {
padding: 6px 13px; padding: 6px 13px;
border: 1px solid #c9c9c9; border: 1px solid #c9c9c9;
background-color: #f6f6f6; background-color: #f6f6f6;
} }
#contentBody img { main .e-content img {
max-width: 100%; max-width: 100%;
box-sizing: content-box; box-sizing: content-box;
background-color: #f6f6f6; background-color: #f6f6f6;
} }
#contentBody img[align=right] { main .e-content img[align=right] {
padding-left: 20px; padding-left: 20px;
} }
#contentBody img[align=left] { main .e-content img[align=left] {
padding-right: 20px; padding-right: 20px;
} }
#contentBody code { main .e-content code {
padding: 0.2em 0.4em; padding: 0.2em 0.4em;
margin: 0; margin: 0;
font-size: 85%; font-size: 85%;
@ -455,11 +455,11 @@
border-radius: 3px; border-radius: 3px;
} }
#contentBody pre { main .e-content pre {
word-wrap: normal; word-wrap: normal;
} }
#contentBody pre>code { main .e-content pre>code {
padding: 0; padding: 0;
margin: 0; margin: 0;
font-size: 100%; font-size: 100%;
@ -469,17 +469,17 @@
border: 0; border: 0;
} }
#contentBody .highlight { main .e-content .highlight {
margin-bottom: 16px; margin-bottom: 16px;
} }
#contentBody .highlight pre { main .e-content .highlight pre {
margin-bottom: 0; margin-bottom: 0;
word-break: normal; word-break: normal;
} }
#contentBody .highlight pre, main .e-content .highlight pre,
#contentBody pre { main .e-content pre {
padding: 16px; padding: 16px;
overflow: auto; overflow: auto;
font-size: 85%; font-size: 85%;
@ -487,7 +487,7 @@
background-color: #f6f6f6; background-color: #f6f6f6;
} }
#contentBody pre code { main .e-content pre code {
display: inline; display: inline;
max-width: auto; max-width: auto;
padding: 0; padding: 0;
@ -499,12 +499,12 @@
border: 0; border: 0;
} }
#contentBody .full-commit .btn-outline:not(:disabled):hover { main .e-content .full-commit .btn-outline:not(:disabled):hover {
color: #005cc5; color: #005cc5;
border-color: #005cc5; border-color: #005cc5;
} }
#contentBody kbd { main .e-content kbd {
display: inline-block; display: inline-block;
padding: 3px 5px; padding: 3px 5px;
font: 11px "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace; font: 11px "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
@ -518,25 +518,25 @@
box-shadow: inset 0 -1px 0 #c6cbd1; box-shadow: inset 0 -1px 0 #c6cbd1;
} }
#contentBody :checked+.radio-label { main .e-content :checked+.radio-label {
position: relative; position: relative;
z-index: 1; z-index: 1;
border-color: #0366d6; border-color: #0366d6;
} }
#contentBody .task-list-item { main .e-content .task-list-item {
list-style-type: none; list-style-type: none;
} }
#contentBody .task-list-item+.task-list-item { main .e-content .task-list-item+.task-list-item {
margin-top: 3px; margin-top: 3px;
} }
#contentBody .task-list-item input { main .e-content .task-list-item input {
margin: 0 0.2em 0.25em -1.6em; margin: 0 0.2em 0.25em -1.6em;
vertical-align: middle; vertical-align: middle;
} }
#contentBody hr { main .e-content hr {
border-bottom-color: #eee; border-bottom-color: #eee;
} }

View file

@ -97,6 +97,8 @@ a:active {
main { main {
padding: 20px 10px; padding: 20px 10px;
max-width: 800px;
margin: 0 auto;
} }
mark { mark {
@ -245,13 +247,16 @@ mark {
} }
/* Page */ /* Page */
#contentBody { main .e-content {
max-width: 800px;
margin: 0 auto;
/* padding: 20px 10px; */
text-align: left; text-align: left;
} }
main .e-content h2 {
padding-bottom: .3em;
font-size: 1.5em;
border-bottom: 1px solid #c9c9c9;
}
/* /*
** Home Page ** Home Page

View file

@ -1,10 +1,12 @@
{{ define "main"}} {{ define "main" }}
{{ partial "header.html" . }} {{ partial "header.html" . }}
<!-- content --> <!-- content -->
<main> <main class="h-entry">
<div id="contentBody"> {{ .Scratch.Set "beforeDateString" "Published on "}}
{{ .Content }} {{ partial "date.html" . }}
</div> <div class="e-content">
{{ .Content }}
</div>
</main> </main>
{{ partial "footer.html" . }} {{ partial "footer.html" . }}
{{ end }} {{ end }}

View file

@ -3,7 +3,8 @@
"ref": "{{ $page.Permalink }}", "ref": "{{ $page.Permalink }}",
"title": {{ $page.Title | jsonify }}, "title": {{ $page.Title | jsonify }},
"section": "{{ $page.Section }}", "section": "{{ $page.Section }}",
"tags": {{ $page.Params.tags | jsonify }},
"date" : {{ $page.Date.Format "2006.01.02" | jsonify }}, "date" : {{ $page.Date.Format "2006.01.02" | jsonify }},
"body": {{ $page.Plain | jsonify }} "body": {{ $page.Plain | jsonify }}
} }
{{ end }}] {{ end }}]

View file

@ -1,24 +1,10 @@
{{ define "main"}} {{ define "main"}}
{{ partial "header.html" . }} {{ partial "header.html" . }}
<main> <main>
{{ if not .Date.IsZero }} {{ partial "date.html" . }}
<!-- date --> {{ partial "tags_list_page.html" . }}
{{ $singlePageDateFormat := .Site.Params.singlePageDateFormat | default "January 2, 2006"}}
<p class="date">{{ .Date.Format $singlePageDateFormat }}</p>
{{ end }}
<!-- tags -->
<div id="tags">
<ul>
{{ range .Param "tags" }}
{{ $name := . }}
{{ with $.Site.GetPage (printf "/tags/%s" ($name | urlize)) }}
<li><a href="{{ .Permalink }}">{{ $name }}</a></li>
{{ end }}
{{ end }}
</ul>
</div>
<!-- content --> <!-- content -->
<div id="contentBody"> <div class="e-content">
{{ .Content }} {{ .Content }}
</div> </div>
</main> </main>

View file

@ -1,7 +0,0 @@
<!DOCTYPE html>
<html>
{{ partial "head.html" . }}
<body>
{{ block "main" . }}{{ end }}
</body>
</html>

View file

@ -1,42 +1,21 @@
{{ define "main"}} {{ define "main"}}
{{ partial "header.html" . }} {{ partial "header.html" . }}
<main> <main>
<!-- search box --> {{ partial "search.html" . }}
<div id="searchBox"> {{ partial "tags_list_all.html" . }}
<input type="text" id="searchBoxInput" placeholder="Search..." />
<img id="searchBoxIcon" src="{{ .Site.BaseURL }}/img/search.png" />
</div>
<!-- search results -->
<div id="searchResults"></div>
<!-- tags -->
<div id="tags">
<ul>
{{ range .Site.Taxonomies.tags.ByCount }}
<li><a href="{{ .Page.Permalink }}">{{ .Page.Title }} ({{ .Count }})</a></li>
{{ end }}
</ul>
</div>
<!-- contents --> <!-- contents -->
<div id="contentsList"> <div id="contentsList">
{{ $listPageDateFormat := .Site.Params.listPageDateFormat | default "January, 2006"}} {{ $listPageDateFormat := .Site.Params.listPageDateFormat | default "January, 2006"}}
{{ range $index, $value := .Pages.GroupByDate $listPageDateFormat }} {{ range $index, $value := .Pages.GroupByDate $listPageDateFormat }}
{{ if (ne $index 0) }} {{ if (ne $index 0) }}
<hr class="separator"> <hr class="separator">
{{ end }} {{ end }}
<p class="date">{{ .Key }}</p> <p class="date">{{ .Key }}</p>
{{ range .Pages }} {{ range .Pages }}
<p><a href="{{ .Permalink }}">{{ .Title }}</a></p> <p><a href="{{ .Permalink }}">{{ .Title }}</a></p>
{{ end }} {{ end }}
{{ end }} {{ end }}
</div> </div>
</main> </main>
{{ partial "footer.html" . }} {{ partial "footer.html" . }}
{{ $jquery := resources.Get "js/jquery-3.5.1.min.js" }}
{{ $mark := resources.Get "js/jquery.mark.es6.min.js" }}
{{ $lunr := resources.Get "js/lunr.js" }}
{{ $search := resources.Get "js/search.js" }}
<script src="{{ $jquery.Permalink }}"></script>
<script src="{{ $mark.Permalink }}"></script>
<script src="{{ $lunr.Permalink }}"></script>
<script src="{{ $search.Permalink }}"></script>
{{ end }} {{ end }}

View file

@ -1,10 +0,0 @@
[{{ range $index, $page := .Pages }}{{ if ne $index 0 }},{{ end }}
{
"ref": "{{ $page.Permalink }}",
"title": {{ $page.Title | jsonify }},
"section": "{{ $page.Section }}",
"tags": {{ $page.Params.tags | jsonify }},
"date" : {{ $page.Date.Format "2006.01.02" | jsonify }},
"body": {{ $page.Plain | jsonify }}
}
{{ end }}]

View file

@ -1,76 +1,41 @@
{{ define "main"}} {{ define "main"}}
{{ .Scratch.Set "customTitleHeaderSet" true }}
{{ .Scratch.Set "customTitleHeader" "Blog" }}
{{ .Scratch.Set "customTitleHeaderLink" "/blog" }}
{{ partial "header.html" . }}
<main>
<article class="h-entry"> <article class="h-entry">
{{ .Scratch.Set "customTitleHeaderSet" true }} <h1 class='title'>{{ .Title }}</h1>
{{ .Scratch.Set "customTitleHeader" "Blog" }} <a style="display: none" class="u-url" href="{{ .Permalink }}"></a>
{{ .Scratch.Set "customTitleHeaderLink" "/blog" }} {{ .Scratch.Set "beforeDateString" "Published on "}}
{{ partial "header.html" . }} {{ partial "date.html" . }}
<main> {{ partial "reading_time.html" . }}
<h1 class='title'>{{ .Title }}</h1> {{ partial "tags_list_page.html" . }}
<a style="display: none" class="u-url" href="{{ .Permalink }}"></a> <!-- content -->
<!-- date --> <div class="e-content">
{{ if not .Date.IsZero }} {{ .Content }}
{{ $singlePageDateFormat := .Site.Params.singlePageDateFormat | default "January 2, 2006"}} </div>
{{ $pubdate := .Date.Format $singlePageDateFormat }}
<p class="date">Published on <time class="dt-published" datetime='{{ .Date.Format "2006-01-02T15:04:05Z0700" }}'>{{ $pubdate }}</time></p>
{{- if .Lastmod }}
{{- $lastmod := .Lastmod.Format $singlePageDateFormat }}
{{- if ne $lastmod $pubdate }}
<p class="date-updated">Updated on <time class='dt-updated' datetime='{{ .Lastmod.Format "2006-01-02T15:04:05Z0700" }}'>{{ $lastmod }}</time></p>
{{- end }}
{{ end }}
{{ end }}
{{ $readTime := mul (div (countwords .Content) 220.0) 60 }}
{{ if gt $readTime 60 }}
<p>
Reading Time:
{{ math.Ceil (div $readTime 60) }} minutes.
</p>
{{ end }}
<!-- tags -->
<div id="tags">
<ul>
{{ range .Param "tags" }}
{{ $name := . }}
{{ with $.Site.GetPage (printf "/tags/%s" ($name | urlize)) }}
<li><a class="p-category" href="{{ .Permalink }}">{{ $name }}</a></li>
{{ end }}
{{ end }}
</ul>
</div>
<!-- content -->
<div id="contentBody" class="e-content">
{{ .Content }}
</div>
</article> </article>
<!-- Webmentions --> {{ partial "webmentions.html" . }}
<div id="webmentions"></div> </main>
<form method="post" action="https://webmention.io/brandonrozek.com/webmention"> <!-- Metadata -->
<p>Have you published a response to this? <label for="webmention-source">Let me know the <abbr title="Uniform Resource Locator">URL</abbr></label>:</p> <script type="application/ld+json">
<input type="url" name="source" id="webmention-source"> {
<input type="hidden" name="target" value="{{ .Permalink }}"> "@context": "https://schema.org",
<button type="submit">Ping!</button> "@type": "NewsArticle",
</form> "headline": "{{ .Title }}",
</main> "image": [
{{ $webmentionjs := resources.Get "js/webmention.min.js" }} "{{ .Site.BaseURL }}/img/{{ .Site.Params.avatar }}"
<script src="{{ $webmentionjs.Permalink }}" async></script> ],
<!-- Metadata --> "datePublished": "{{ .Date.Format "2006-01-02" }}",
<script type="application/ld+json"> "author": [{
{ "@type": "Person",
"@context": "https://schema.org", "name": "{{ .Site.Params.Author }}",
"@type": "NewsArticle", "url": "{{ .Site.BaseURL }}",
"headline": "{{ .Title }}", "email": "mailto://{{ .Site.Params.email }}",
"image": [ "image": "{{ .Site.BaseURL }}/img/{{ .Site.Params.avatar }}"
"{{ .Site.BaseURL }}/img/{{ .Site.Params.avatar }}" }]
], }
"datePublished": "{{ .Date.Format "2006-01-02" }}", </script>
"author": [{ {{ partial "footer.html" . }}
"@type": "Person",
"name": "{{ .Site.Params.Author }}",
"url": "{{ .Site.BaseURL }}",
"email": "mailto://{{ .Site.Params.email }}",
"image": "{{ .Site.BaseURL }}/img/{{ .Site.Params.avatar }}"
}]
}
</script>
{{ partial "footer.html" . }}
{{ end }} {{ end }}

View file

@ -1,41 +1,24 @@
{{ define "main"}} {{ define "main"}}
{{ partial "header.html" . }} {{ partial "header.html" . }}
<main> <main>
<!-- search box --> {{ partial "search.html" . }}
<div id="searchBox"> <!-- contents -->
<input type="text" id="searchBoxInput" placeholder="Search..." /> <div id="feedList">
<img id="searchBoxIcon" src="{{ .Site.BaseURL }}/img/search.png" /> {{ $listPageDateFormat := .Site.Params.listPageDateFormat | default "January, 2006"}}
</div> {{ range $index, $value := .Pages.GroupByDate $listPageDateFormat }}
<!-- search results --> {{ range .Pages }}
<div id="searchResults"></div> <article class="h-entry">
<!-- contents --> <h2 class='title p-name'>{{ .Title }}</h2>
<div id="feedList"> {{ .Scratch.Set "noDateUpdate" true }}
{{ $listPageDateFormat := .Site.Params.listPageDateFormat | default "January, 2006"}} {{ partial "date.html" . }}
{{ range $index, $value := .Pages.GroupByDate $listPageDateFormat }}
{{ range .Pages }}
<article class="h-entry">
<h2 class='title p-name'>{{ .Title }}</h2>
<!-- date -->
{{ if not .Date.IsZero }}
{{ $singlePageDateFormat := .Site.Params.singlePageDateFormat | default "January 2, 2006"}}
<p class="date"><time class="dt-published" datetime='{{ .Date.Format "2006-01-02T15:04:05Z0700" }}'>{{ .Date.Format $singlePageDateFormat }}</time></p>
<a style="display: none" class="u-url" href="{{ .Permalink }}"></a> <a style="display: none" class="u-url" href="{{ .Permalink }}"></a>
{{ end }} <div class="e-content">
<div id="contentBody" class="e-content"> {{ .Content }}
{{ .Content }} </div>
</div> </article>
</article> {{ end }}
{{ end }} {{ end }}
{{ end }} </div>
</div>
</main> </main>
{{ partial "footer.html" . }} {{ partial "footer.html" . }}
{{ $jquery := resources.Get "js/jquery-3.5.1.min.js" }}
{{ $mark := resources.Get "js/jquery.mark.es6.min.js" }}
{{ $lunr := resources.Get "js/lunr.js" }}
{{ $search := resources.Get "js/search.js" }}
<script src="{{ $jquery.Permalink }}"></script>
<script src="{{ $mark.Permalink }}"></script>
<script src="{{ $lunr.Permalink }}"></script>
<script src="{{ $search.Permalink }}"></script>
{{ end }} {{ end }}

View file

@ -0,0 +1,14 @@
{{ if not .Date.IsZero }}
{{ $publishString := .Scratch.Get "beforeDateString" }}
{{ $singlePageDateFormat := .Site.Params.singlePageDateFormat | default "January 2, 2006"}}
{{ $pubdate := .Date.Format $singlePageDateFormat }}
<p class="date">{{ $publishString }}<time class="dt-published" datetime='{{ .Date.Format "2006-01-02T15:04:05Z0700" }}'>{{ $pubdate }}</time></p>
{{- if and (not (.Scratch.Get "noDateUpdate")) .Lastmod }}
{{- $lastmod := .Lastmod.Format $singlePageDateFormat }}
{{- if ne $lastmod $pubdate }}
<p class="date-updated">Updated on <time class='dt-updated' datetime='{{ .Lastmod.Format "2006-01-02T15:04:05Z0700" }}'>{{ $lastmod }}</time></p>
{{- end }}
{{ end }}
{{ end }}

View file

@ -0,0 +1,8 @@
<!-- Reading Time -->
{{ $readTime := mul (div (countwords .Content) 220.0) 60 }}
{{ if gt $readTime 60 }}
<p>
Reading Time:
{{ math.Ceil (div $readTime 60) }} minutes.
</p>
{{ end }}

View file

@ -0,0 +1,16 @@
<!-- search box -->
<div id="searchBox">
<input type="text" id="searchBoxInput" placeholder="Search..." />
<img id="searchBoxIcon" src="{{ .Site.BaseURL }}/img/search.png" />
</div>
<!-- search results -->
<div id="searchResults"></div>
{{ $jquery := resources.Get "js/jquery-3.5.1.min.js" }}
{{ $mark := resources.Get "js/jquery.mark.es6.min.js" }}
{{ $lunr := resources.Get "js/lunr.js" }}
{{ $search := resources.Get "js/search.js" }}
<script src="{{ $jquery.Permalink }}"></script>
<script src="{{ $mark.Permalink }}"></script>
<script src="{{ $lunr.Permalink }}"></script>
<script src="{{ $search.Permalink }}"></script>

View file

@ -1,7 +1,3 @@
{{ define "main"}}
{{ partial "header.html" }}
<h1>{{ .Title }}</h1>
<main>
<!-- tags --> <!-- tags -->
<div id="tags"> <div id="tags">
<ul> <ul>
@ -9,7 +5,4 @@
<li><a href="{{ .Page.Permalink }}">{{ .Page.Title }} ({{ .Count }})</a></li> <li><a href="{{ .Page.Permalink }}">{{ .Page.Title }} ({{ .Count }})</a></li>
{{ end }} {{ end }}
</ul> </ul>
</div> </div>
</main>
{{ partial "footer.html" . }}
{{ end }}

View file

@ -0,0 +1,11 @@
<!-- List the tags that apply to this page -->
<div id="tags">
<ul>
{{ range .Param "tags" }}
{{ $name := . }}
{{ with $.Site.GetPage (printf "/tags/%s" ($name | urlize)) }}
<li><a href="{{ .Permalink }}">{{ $name }}</a></li>
{{ end }}
{{ end }}
</ul>
</div>

View file

@ -0,0 +1,11 @@
<!-- Webmentions -->
<div id="webmentions"></div>
<form method="post" action="https://webmention.io/brandonrozek.com/webmention">
<p>Have you published a response to this? <label for="webmention-source">Let me know the <abbr title="Uniform Resource Locator">URL</abbr></label>:</p>
<input type="url" name="source" id="webmention-source">
<input type="hidden" name="target" value="{{ .Permalink }}">
<button type="submit">Ping!</button>
</form>
</main>
{{ $webmentionjs := resources.Get "js/webmention.min.js" }}
<script src="{{ $webmentionjs.Permalink }}" async></script>

View file

@ -4,34 +4,38 @@
<style> <style>
.toot { .toot {
margin-bottom: 2rem; margin-bottom: 2rem;
padding: 15px;
border: 1px solid #656565;
border-radius: 10px;
}
.toot .date {
vertical-align: top;
margin-bottom: 0;
} }
.toot .e-content img { .toot .e-content img {
display: inline-block; display: inline-block;
border: 2px solid black;
} }
.toot .e-content p:first-of-type { .toot .e-content p:first-of-type {
display: inline-block; display: inline-block;
} }
</style> </style>
{{ range sort $dataJ "created_at" "desc" }} {{ range sort $dataJ "created_at" "desc" }}
{{ if ne .content "" }} {{ if ne .content "" }}
<article class="toot h-entry"> <article class="toot h-entry">
<div>
<div class="e-content"> <div class="e-content">
<img width=50 src="{{ .account.avatar }}"/> <img width=50 src="{{ .account.avatar }}"/>
<p class="date">Published on <time class="dt-published" datetime='{{ .created_at }}'>{{ dateFormat "January 2, 2006 15:04" (time .created_at) }}</time></p> <p class="date">Tooted on <time class="dt-published" datetime='{{ .created_at }}'>{{ dateFormat "January 2, 2006 15:04" (time .created_at) }}</time></p>
{{ .content | safeHTML }} {{ .content | safeHTML }}
</div> </div>
</div> <div class=".toot-social">
<div class=".toot-social"> <span><i class='fas fa-share'></i> {{ .replies_count }} </span>
<span><i class='fas fa-share'></i> {{ .replies_count }} </span> <span><i class='fas fa-retweet'></i> {{ .reblogs_count }} </span>
<span><i class='fas fa-retweet'></i> {{ .reblogs_count }} </span> <span><i class='fas fa-star'></i> {{ .favourites_count }} </span>
<span><i class='fas fa-star'></i> {{ .favourites_count }} </span> <span>| Source: <a href="{{ .url }}">{{ .url }}</a></span>
<span>| Source: <a href="{{ .url }}">{{ .url }}</a></span> </div>
</div>
</article> </article>
{{ end }} {{ end }}
{{ end }} {{ end }}

View file

@ -1,20 +1,8 @@
{{ define "main"}} {{ define "main"}}
{{ partial "header.html" . }} {{ partial "header.html" . }}
<!-- search box --> <main>
<div id="searchBox"> {{ partial "search.html" . }}
<input type="text" id="searchBoxInput" placeholder="Search..." /> {{ partial "tags_list_all.html" . }}
<img id="searchBoxIcon" src="{{ .Site.BaseURL }}/img/search.png" />
</div>
<!-- search results -->
<div id="searchResults"></div>
<!-- tags -->
<div id="tags">
<ul>
{{ range .Site.Taxonomies.tags.ByCount }}
<li><a href="{{ .Page.Permalink }}">{{ .Page.Title }} ({{ .Count }})</a></li>
{{ end }}
</ul>
</div>
<!-- contents --> <!-- contents -->
<div id="contentsList"> <div id="contentsList">
{{ $listPageDateFormat := .Site.Params.listPageDateFormat | default "January, 2006"}} {{ $listPageDateFormat := .Site.Params.listPageDateFormat | default "January, 2006"}}
@ -28,11 +16,5 @@
{{ end }} {{ end }}
{{ end }} {{ end }}
</div> </div>
{{ partial "footer.html" . }} </main>
{{ $jquery := resources.Get "js/jquery-3.5.1.min.js" }}
{{ $mark := resources.Get "js/jquery.mark.es6.min.js" }}
{{ $lunr := resources.Get "js/lunr.js" }}
{{ $search := resources.Get "js/search.js" }}
{{ $js := slice $jquery $mark $lunr $search | resources.Concat "bundle.js" | resources.Minify | resources.Fingerprint }}
<script src="{{ $js.Permalink }}"></script>
{{ end }} {{ end }}

View file

@ -1,13 +1,7 @@
{{ define "main"}} {{ define "main"}}
<h1>{{ .Title }}</h1>
{{ partial "header.html" . }} {{ partial "header.html" . }}
<!-- tags --> <main>
<div id="tags"> {{ partial "tags_list_all.html" . }}
<ul> </main>
{{ range .Site.Taxonomies.tags.ByCount }}
<li><a href="{{ .Page.Permalink }}">{{ .Page.Title }} ({{ .Count }})</a></li>
{{ end }}
</ul>
</div>
{{ partial "footer.html" . }} {{ partial "footer.html" . }}
{{ end }} {{ end }}