Update with custom theme files

This commit is contained in:
Ben Goldsworthy 2022-11-10 22:48:02 -07:00
parent 3b303aee07
commit 0c277c2458
45 changed files with 4324 additions and 11 deletions

111
layouts/blog/section.html Normal file
View file

@ -0,0 +1,111 @@
{{ define "title" }}
{{ .Page.Title | plainify }} | {{ .Site.Title }}
{{ end }}
{{ define "main-class" }}--section{{ end }}
{{ define "main-type" }}{{ .Params.mainType }}{{ end }}
{{ define "footer-scripts" }}
<script>
// Source: https://css-tricks.com/the-complete-guide-to-lazy-loading-images/
document.addEventListener("DOMContentLoaded", function() {
var lazyloadImages;
if ("IntersectionObserver" in window) {
lazyloadImages = document.querySelectorAll(".lazy");
var imageObserver = new IntersectionObserver(function(entries, observer) {
entries.forEach(function(entry) {
if (entry.isIntersecting) {
console.log("Ding");
var image = entry.target;
image.classList.remove("lazy");
imageObserver.unobserve(image);
}
});
});
lazyloadImages.forEach(function(image) {
imageObserver.observe(image);
});
} else {
var lazyloadThrottleTimeout;
lazyloadImages = document.querySelectorAll(".lazy");
function lazyload () {
if(lazyloadThrottleTimeout) {
clearTimeout(lazyloadThrottleTimeout);
}
lazyloadThrottleTimeout = setTimeout(function() {
var scrollTop = window.pageYOffset;
lazyloadImages.forEach(function(img) {
if(img.offsetTop < (window.innerHeight + scrollTop)) {
img.src = img.dataset.src;
img.classList.remove('lazy');
}
});
if(lazyloadImages.length == 0) {
document.removeEventListener("scroll", lazyload);
window.removeEventListener("resize", lazyload);
window.removeEventListener("orientationChange", lazyload);
}
}, 20);
}
document.addEventListener("scroll", lazyload);
window.addEventListener("resize", lazyload);
window.addEventListener("orientationChange", lazyload);
}
});
</script>
{{ end }}
{{ define "main-header" }}
<header class="site-content__header">
<h1 class="page-title">{{ .Title | safeHTML }}
{{ if eq .Type "blog" }}
{{ with .GetPage "blog/posts" }}
{{ range .AlternativeOutputFormats -}}
<a href="{{ .RelPermalink }}">
<img class="feed-icon" src="{{ $.Site.Params.feedIcon }}">
</a>
{{ end }}
{{ end }}
{{ else }}
{{ range .AlternativeOutputFormats -}}
<a href="{{ .RelPermalink }}">
<img class="feed-icon" src="{{ $.Site.Params.feedIcon }}">
</a>
{{ end }}
{{ end }}
</h1>
{{ .Content }}
<nav class="page-header__minor-links">
<ul class="minor-links__categories">
<li><a href="/series"><h2>Series</h2></a> <p>({{ len .Site.Taxonomies.series }})</p></li>
{{ range .Site.Taxonomies.categories }}
<li><a href="{{ .Page.RelPermalink }}"><h2>{{ .Page.Title | safeHTML }}</h2></a> <p>({{ len . }})</p></li>
{{ end }}
</ul>
{{ if eq .Type "blog" }}
{{ with .GetPage "blog/posts" }}
{{ partial "years-list.html" . }}
{{ end }}
{{ else }}
{{ partial "years-list.html" . }}
{{ end }}
</nav>
</header>
{{ end }}
{{ define "main-body" }}
{{ if eq .Type "blog" }}
{{ with .GetPage "blog/posts" }}
{{ partial "items-grid.html" . }}
{{ end }}
{{ else }}
{{ partial "items-grid.html" . }}
{{ end }}
{{ end }}

127
layouts/blog/single.html Normal file
View file

@ -0,0 +1,127 @@
{{ define "title" }}
&ldquo;{{ .Title | plainify }}&rdquo; | {{ .Site.Title }}
{{ end }}
{{ define "main-class" }}--single{{ end }}
{{ define "footer-scripts" }}
{{ with .Params.locations }}
<script src="https://www.openlayers.org/api/OpenLayers.js"></script>
<script>
map = new OpenLayers.Map("mapdiv");
map.addLayer(new OpenLayers.Layer.OSM());
var lonLats = [];
{{ range . }}
{{ with ( index $.Site.Data.locations . ) }}
lonLats.push(new OpenLayers.LonLat( {{ .lon }} , {{ .lat }} )
.transform(
new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
map.getProjectionObject() // to Spherical Mercator Projection
));
{{ else }}
{{ warnf "Could not find lat-lon for %q (%q)" . $.File.Path }}
{{ end }}
{{ end }}
/* TODO: Smarter zoom selection */
var zoom=5;
var markers = new OpenLayers.Layer.Markers( "Markers" );
map.addLayer(markers);
for (var i = 0; i < lonLats.length; i++) {
markers.addMarker(new OpenLayers.Marker(lonLats[i]));
}
/* TODO: Smarter centering */
map.setCenter(lonLats[0], zoom);
</script>
{{ end }}
{{ with .Params.scripts }}
{{ if in . "mathjax" }}
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
<script src="/js/mathjax-config.js"></script>
{{ end }}
{{ end }}
{{ end }}
{{ define "main-header" }}
<header class="site-content__header">
{{ if .Params.series }}
<p class="article-header__series">Part of series:
{{ range ( .GetTerms "series" ) }}
<a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
{{ end }}
</p>
{{ end }}
<div class="article-header__featured-image"
{{ if .Params.featured_image }}
{{ if .Resources.GetMatch .Params.featured_image }}
style="background-image: url({{ ( .Resources.GetMatch .Params.featured_image ).RelPermalink }})"
{{ else }}
style="background-image: url({{ .Params.featured_image }})"
{{ end }}
{{ end }}>
<div class="article-header__title-wrapper">
<h1 class="article-header__title{{ if gt ( len ( .Title | plainify ) ) 40 }} article-header__title--long{{ end }}">
<span role="text" itemprop="name">{{ .Title | safeHTML }}</span>
</h1>
{{ with .Params.subtitle }}
<p class="article-header__subtitle">{{ . | safeHTML }}</p>
{{ end }}
</div>
{{ with .Resources.GetMatch .Params.featured_image }}
<p class="attr">
{{ if .Params.attrlink }}<a href="{{ .Params.attrlink }}" target="_blank" rel="noopener">{{ end }}
{{- .Params.Attr | safeHTML -}}
{{ if .Params.attrlink }}</a>{{ end }}
{{ if .Params.attrlicence }} ({{ .Params.attrlicence }}){{ end }}
<p>
{{ end }}
</div>
<p class="article-header__word-count">~<span itemprop="wordCount">{{ .FuzzyWordCount | lang.NumFmt 0 }}</span> words</p>
<p class="article-header__publish-date">Published: <span itemprop="datePublished" datetime="{{ .PublishDate }}">{{ .PublishDate.Format "January 2" }}<sup>{{ if in (slice 1 21 31) .PublishDate.Day}}st{{ else if in (slice 2 22) .PublishDate.Day}}nd{{ else if in (slice 3 23) .PublishDate.Day}}rd{{ else }}th{{ end }}</sup>, 1{{ .PublishDate.Format "2006" | lang.NumFmt 0 }}&nbsp;<abbr style="text-transform: small-caps; font-size: 0.8em;" title="Holocene Era">HE</abbr></span></p>
<p class="article-header__modified-date">Last modified: <span itemprop="dateModified" datetime="{{ .Lastmod }}">{{ .Lastmod.Format "January 2" }}<sup>{{ if in (slice 1 21 31) .Lastmod.Day}}st{{ else if in (slice 2 22) .Lastmod.Day}}nd{{ else if in (slice 3 23) .Lastmod.Day}}rd{{ else }}th{{ end }}</sup>, 1{{ .Lastmod.Format "2006" | lang.NumFmt 0 }}&nbsp;<abbr style="text-transform: small-caps; font-size: 0.8em;" title="Holocene Era">HE</abbr></span></p>
{{ $post_age_in_years := math.Round ( div ( div ( now.Sub .PublishDate ).Hours 24 ) 365 ) }}
{{ if ( or .Params.site .Params.controversial ( gt $post_age_in_years 2 ) ) }}
<aside class="article-header__warnings">
<ul>
{{ if ( gt $post_age_in_years 2 ) }}<li>This piece was written <strong>over {{ $post_age_in_years }} years ago</strong>. It may no longer accurately reflect my views now, or may be factually outdated.</li>{{ end }}
{{ if .Params.controversial }}<li>This piece has been marked as potentially <strong>controversial</strong>, whether due to the topic addressed, the content of the article, or both. Don't say you weren't warned.</li>{{ end }}
{{ if .Params.site }}<li>This piece was originally written for an older version of this site. As such, it may not have transferred over properly and some images and links might be broken.</li>{{ end }}
</ul>
</aside>
{{ end }}
{{ if .Params.notes }}
<aside class="article-header__notes">
<ul>
{{ range .Params.notes }}
<li>{{ . | safeHTML }}</li>
{{ end }}
</ul>
</aside>
{{ end }}
{{ if and ( .TableOfContents ) ( ne .TableOfContents "<nav id=\"TableOfContents\"></nav>" ) }}
<nav class="article-header__table-of-contents">
<h2 class="article-header__subtitle">Table of Contents</h2>
{{ .TableOfContents }}
</nav>
{{ end }}
</header>
{{ end }}
{{ define "main-body" }}
<article class="site-content__body" itemprop="articleBody">
{{ .Content }}
</article>
{{ end }}
{{ define "main-footer" }}
{{ partial "post-meta.html" . }}
{{ end }}