diff options
| -rw-r--r-- | README.md | 16 | ||||
| -rw-r--r-- | assets/stylesheets/highlight.css (renamed from static/stylesheets/highlight.css) | 0 | ||||
| -rw-r--r-- | assets/stylesheets/style.css (renamed from static/stylesheets/style.css) | 129 | ||||
| -rw-r--r-- | layouts/_default/baseof.html | 13 | ||||
| -rw-r--r-- | layouts/_default/single.html | 24 | ||||
| -rw-r--r-- | layouts/partials/footer-content.html (renamed from layouts/partials/theme-copyright.html) | 0 | ||||
| -rw-r--r-- | layouts/shortcodes/img.html | 5 | ||||
| -rw-r--r-- | static/icons/rss_feed_24dp_78A75A_FILL0_wght400_GRAD0_opsz24.svg | 1 |
8 files changed, 105 insertions, 83 deletions
@@ -1,17 +1,15 @@ # TJKBasic Hugo Theme -This is the hugo theme used on [tjkeller.xyz](https://tjkeller.xyz). -The theme was made from scratch. +This is the Hugo theme used on [tjkeller.xyz](https://tjkeller.xyz). +The theme was made from scratch, but still benefited from the availability from other open themes to reference. -This is really just meant as a reference for those who would like to replicate some features from my site. -I would prefer if you did not just copy + paste my theme on your own site. +This theme is made available as a reference for those who would like to replicate some features from my site. +Starting from scratch comes with many benefits, so you're better off not building off of this theme as a starting point. +To be clear, I would prefer if you did not just copy + paste my theme for your own site. Nobody likes a copycat, so that would be lame! -I wouldn't even recommend using it as a starting point to build off of since I believe that I have benefited greatly by starting from scratch. -However, I still believe that having it up as a reference could be useful for those who would like to start from scratch, but are having difficulty implementing specific features, etc. - -Because of that, I am hereby graciously releasing this theme unto the unwashed, liberal masses under the GPLv3 licence! -I am entrusting you (the public) to more or less respect my wishes, but I of course don't mind if you copy certain portions, etc. so long as you don't rip off my entire site. +With that being said, I hereby (graciously) release this theme unto the unwashed, liberal masses under the GPLv3 license! +I am entrusting you (the public) to more or less respect my wishes, just don't rip off my entire site if you can help it. Also, check out the `hugo.yaml` file. It contains some settings that you need to include in your main `hugo.yaml` to make it function correctly for some reason. diff --git a/static/stylesheets/highlight.css b/assets/stylesheets/highlight.css index 5efc353..5efc353 100644 --- a/static/stylesheets/highlight.css +++ b/assets/stylesheets/highlight.css diff --git a/static/stylesheets/style.css b/assets/stylesheets/style.css index 4c32ae3..2253b65 100644 --- a/static/stylesheets/style.css +++ b/assets/stylesheets/style.css @@ -2,13 +2,14 @@ html { background: #222; } body { - margin: 0 0 1.5em 0; + margin: 0; color: white; font-family: "Noto Serif", serif; text-underline-offset: 2.25px; overflow-x: hidden; } +/* header */ header { display: grid; grid-template-columns: 1fr auto 1fr; @@ -18,6 +19,7 @@ header { user-select: none; position: sticky; top: 0; + z-index: 100 } #title { @@ -32,14 +34,17 @@ header { header a { color: white; - text-decoration: none; position: relative; width: fit-content; } +header a:hover { + text-decoration: none; +} + header a:hover::after { content: ""; - background: green; + background: #309a00; position: absolute; display: block; bottom: -.3em; @@ -48,6 +53,7 @@ header a:hover::after { width: calc(100% + 2ex); } +/* page */ main, footer{ max-width: 900px; margin: 1.5em auto; @@ -58,10 +64,18 @@ main, footer{ text-align: right; color: #555; } -#publishing a { - color: #555; +#publishing a { color: #555 } +#publishing a:not(:last-child)::after { content: "," } + +footer span, +#copyright, #theme-copyright { + text-align: center; + display: block; + margin: .25em; + color: #6a6a6a; } +/* elements */ hr { color: #555; margin: 2em 0; @@ -71,16 +85,49 @@ h1, h2, h3, h4, h5, h6 { text-align: center; } -.monodate { - font-family: monospace; +a { + color: lightgreen; + text-decoration: none; +} + +a:hover { + text-decoration: underline; } -.bold { - font-weight: bold; +/* images */ +img, figcaption { + margin: auto; + display: block; + width: fit-content; + max-width: 60%; + color: #ddd; } -a { - color: lightgreen; +/* tables */ +table { + border-collapse: collapse; +} + +tr:nth-child(even) { + background: #252525; +} + +th { + background: #333; + border-right: 1.5px solid #222; + padding: .25em; +} + +td:not(.img) { + padding-inline: .75ex; +} + +td:not(:last-child) { + border-right: 1.5px solid #2b2b2b; +} + +td.img { + border: none; } /* highlighted code */ @@ -122,53 +169,22 @@ ol, ul, pre code { max-width: 100%; } -.alpha-ol ol { - list-style-type: lower-alpha; -} - -img, figcaption { - margin: auto; - display: block; - width: fit-content; - max-width: 95%; - color: #ddd; -} - -#copyright, #theme-copyright { - text-align: center; +/* youtube iframe shortcode */ +div.yt-4x3 iframe { display: block; - opacity: .2; + aspect-ratio: 4/3; + max-width: 600px; + width: 100%; + margin: 2em auto; + border: 0; } -.overflow-box { - overflow: scroll; -} - -table { - border-collapse: collapse; -} - -tr:nth-child(even) { - background: #252525; -} - -th { - background: #333; - border-right: 1.5px solid #222; - padding: .25em; -} - -td:not(.img) { - padding-inline: .75ex; -} - -td:not(:last-child) { - border-right: 1.5px solid #2b2b2b; -} - -td.img { - border: none; -} +/* utility classes */ +.monodate, .monospace { font-family: monospace } +.bold { font-weight: bold } +.nowrap { white-space: nowrap } +.overflow-box { overflow: scroll } +.alpha-ol ol { list-style-type: lower-alpha } @media (max-width: 1000px) { header { @@ -188,4 +204,7 @@ td.img { ol, ul, pre code { margin-left: 0; } + img, figcaption { + max-width: 95%; + } } diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 18ea135..974affa 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -6,8 +6,12 @@ <title>{{ $title | title }}</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1"> - <link rel="stylesheet" type="text/css" href="/stylesheets/highlight.css"> - <link rel="stylesheet" type="text/css" href="/stylesheets/style.css"> + {{ $css := resources.Match "stylesheets/*.css" | resources.Concat "style.css" | minify | fingerprint }} + <link rel="stylesheet" href="{{ $css.Permalink }}"> + {{ with $.Resources.GetMatch "**.css*" }} + {{ $style := . | minify | fingerprint }} + <link type=text/css rel="stylesheet" href="{{ $style.Permalink }}"> + {{ end }} {{- block "head" . }}{{- end }} </head> <body> @@ -25,13 +29,10 @@ </main> <footer> <hr> - <div id="sharing"> - <a><img src="/icons/rss_feed_24dp_78A75A_FILL0_wght400_GRAD0_opsz24.svg" /></a> - </div> {{ if .Site.Params.copyright.include }} <span id="copyright">© {{ time.Now.Year }} {{ .Site.Params.copyright.name }} – {{ .Site.Params.copyright.type }}</span> {{ end }} - {{ partial "theme-copyright.html" . }} + {{ partial "footer-content.html" . }} </footer> </body> </html> diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 099d3fc..035d589 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -1,18 +1,20 @@ {{ define "main" }} <div id="publishing"> +{{ if ne .Date (time "0001-01-01") }} <span>{{ .PublishDate | time.Format ":date_long" }}</span> - {{ if and (isset .Params "lastmod") (ne .Lastmod .PublishDate) }} - <br> - <span>Revised: {{ .Lastmod | time.Format ":date_long" }}</span> - {{ end }} - {{ if isset .Params "tags" }} - <br> - <span>Tags:</span> - {{- range sort .Params.tags }} - <a href="/tags/{{ . }}">{{ . | humanize | title }}</a> - {{- end }} - {{ end }} +{{ end }} +{{ if and (isset .Params "lastmod") (ne .Lastmod .PublishDate) }} + <br> + <span>Revised: {{ .Lastmod | time.Format ":date_long" }}</span> +{{ end }} +{{ if isset .Params "tags" }} + <br> + <span>Tags:</span> + {{- range sort .Params.tags }} + <a href="/tags/{{ . }}">{{ . | humanize | title }}</a> + {{- end }} +{{ end }} </div> {{ .Content }} diff --git a/layouts/partials/theme-copyright.html b/layouts/partials/footer-content.html index b97de5f..b97de5f 100644 --- a/layouts/partials/theme-copyright.html +++ b/layouts/partials/footer-content.html diff --git a/layouts/shortcodes/img.html b/layouts/shortcodes/img.html index 56bf22f..a57e1ed 100644 --- a/layouts/shortcodes/img.html +++ b/layouts/shortcodes/img.html @@ -4,6 +4,7 @@ <!-- Get parameters --> {{- $alt := .Get "alt" | default "" -}} +{{- $caption := .Get "caption" | default "" -}} {{- $rotation := .Get "rotation" | default 0 -}} <!-- Get quality --> @@ -30,5 +31,7 @@ <figure> <img src="{{ $image.RelPermalink }}" title="{{ $alt }}" alt="{{ $alt }}" /> - <figcaption>{{ $alt }}</figcaption> + {{- if ne $caption "" -}} + <figcaption>{{ $caption }}</figcaption> + {{- end -}} </figure> diff --git a/static/icons/rss_feed_24dp_78A75A_FILL0_wght400_GRAD0_opsz24.svg b/static/icons/rss_feed_24dp_78A75A_FILL0_wght400_GRAD0_opsz24.svg deleted file mode 100644 index 01addb0..0000000 --- a/static/icons/rss_feed_24dp_78A75A_FILL0_wght400_GRAD0_opsz24.svg +++ /dev/null @@ -1 +0,0 @@ -<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#78A75A"><path d="M200-120q-33 0-56.5-23.5T120-200q0-33 23.5-56.5T200-280q33 0 56.5 23.5T280-200q0 33-23.5 56.5T200-120Zm480 0q0-117-44-218.5T516-516q-76-76-177.5-120T120-680v-120q142 0 265 53t216 146q93 93 146 216t53 265H680Zm-240 0q0-67-25-124.5T346-346q-44-44-101.5-69T120-440v-120q92 0 171.5 34.5T431-431q60 60 94.5 139.5T560-120H440Z"/></svg>
\ No newline at end of file |
