DRAFT | new theme - minimage

This commit is contained in:
Don Harper 2023-02-07 22:52:35 -06:00
parent 5116fe4640
commit ac8d9e7eb3
90 changed files with 15302 additions and 1 deletions

View file

@ -0,0 +1,14 @@
{{ define "main" }}
<div class="p-single">
<div class="c-container">
<article class="c-post">
<h1 id="title">404 Page Not Found</h1>
<p style="margin-top: 1em;">The requested URL was not found on this server.<br>
The page you are looking for may be temporarily inaccessible or deleted.</p>
<p style="margin-top: 2em;">
<a class="c-link" href="{{ "/" | relURL }}">go home</a>
</p>
</article>
</div>
</main>
{{ end }}

View file

@ -0,0 +1,12 @@
{{ partial "head" . }}
<body>
{{ partial "header" . }}
<main class="c-main-content">
{{ block "main" . }}{{ end }}
</main>
{{ partial "footer" . }}
</body>
</html>

View file

@ -0,0 +1,16 @@
{{ define "main" }}
{{ $pages := .Paginate (where .Site.RegularPages "Type" "in" .Site.Params.mainSections) 5 }}
<div class="p-archive">
<div class="c-container">
<ul class="c-archive-list">
{{ range $pages.Pages }}
{{ .Render "li" }}
{{ end }}
</ul>
{{ partial "pagenation.html" . }}
</div>
</div>
{{ end }}

View file

@ -0,0 +1,19 @@
<li class="c-archive-list__item">
<a class="c-post{{ if .Params.image }} c-post--has-thumb c-bg-img{{end}}" {{ if .Params.image }}style="background-image: url('{{ .Params.image | absURL }}')"{{ end }} href="{{ .Permalink }}">
<header class="c-post__header c-post__header--over-img">
<p class="c-post__title">{{ .Title }}</p>
<div class="c-post__header__meta">
<time class="c-pub-time" datetime="{{ .Date.Format " 2006-01-02T15:04:05Z07:00 " | safeHTML }}">
{{ .Lastmod.Format ( .Site.Params.dateformat | default "2006.01.02") }}
</time>
{{ if .Params.tags }}
<div class="c-tag">
{{ range .Params.tags }}
<span class="c-tag__item">{{ . }}</span>
{{ end }}
</div>
{{ end }}
</div>
</header>
</a>
</li>

View file

@ -0,0 +1,17 @@
{{ define "main" }}
{{ $pages := .Pages }}
{{ $paginator := .Paginate $pages }}
<div class="p-archive">
<div class="c-container">
<ul class="c-archive-list">
{{ range $pages }}
{{ .Render "li" }}
{{ end }}
</ul>
{{ partial "pagenation.html" . }}
</div>
</div>
{{ end }}

View file

@ -0,0 +1,38 @@
{{ define "main" }}
<div class="p-single">
<div class="c-container">
<article class="c-post">
<header class="c-post__header">
<h1 class="c-post__title">{{ .Title }}</h1>
<div class="c-post__header__meta">
<time class="c-pub-time" datetime="{{ .Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}">
{{ .Lastmod.Format ( .Site.Params.dateformat | default "2006.01.02") }}
</time>
{{ if .Params.tags }}
<div class="c-tag">
{{ range .Params.tags }}
<a class="c-tag__item c-link" href="{{ "/tags/" | relLangURL }}{{ . | urlize }}">{{ . }}</a>
{{ end }}
</div>
{{ end }}
</div>
{{ if .Params.image }}
<div class="c-thumb c-bg-img" style="background-image: url('{{ .Params.image | absURL }}')"></div>
{{ end }}
</header>
<div class="c-post__body">
{{ .Content }}
</div>
<footer class="c-post__footer">
{{ partial "share.html" . }}
{{ partial "pager.html" . }}
{{ partial "related.html" . }}
</footer>
{{ partial "json-single.html" . }}
</article>
</div>
</div>
{{ end }}

View file

@ -0,0 +1,16 @@
{{ define "main" }}
<div class="p-taxonomy">
<div class="c-container">
<ul class="c-taxonomy-list">
{{ $data := .Data }}
{{ range $key, $value := $data.Terms }}
<li class="c-taxonomy-list__item">
<a class="c-link" href="/{{ $data.Plural }}/{{ $key | urlize }}">{{ $key }}</a><span>({{ len $value }})</span>
</li>
{{ end }}
</ul>
</div>
</div>
{{ end }}

View file

@ -0,0 +1,12 @@
<footer class="c-global-footer">
<div class="c-container c-container--medium">
<nav class="c-footer-nav">
{{ range .Site.Menus.footer }}
<a class="c-footer-nav-item" href="{{ .URL }}">
{{ .Name }}
</a>
{{ end }}
</nav>
<p class="c-copy"><small>{{ .Site.Copyright }}</small></p>
</div>
</footer>

View file

@ -0,0 +1,22 @@
<div class="c-overlay">
<div class="c-container">
<nav class="c-global-nav">
<div class="c-global-nav__closer">
<svg class="icon icon-cross">
<use xlink:href="#icon-cross"></use>
<symbol id="icon-cross" viewBox="0 0 32 32">
<title>cross</title>
<path d="M31.708 25.708c-0-0-0-0-0-0l-9.708-9.708 9.708-9.708c0-0 0-0 0-0 0.105-0.105 0.18-0.227 0.229-0.357 0.133-0.356 0.057-0.771-0.229-1.057l-4.586-4.586c-0.286-0.286-0.702-0.361-1.057-0.229-0.13 0.048-0.252 0.124-0.357 0.228 0 0-0 0-0 0l-9.708 9.708-9.708-9.708c-0-0-0-0-0-0-0.105-0.104-0.227-0.18-0.357-0.228-0.356-0.133-0.771-0.057-1.057 0.229l-4.586 4.586c-0.286 0.286-0.361 0.702-0.229 1.057 0.049 0.13 0.124 0.252 0.229 0.357 0 0 0 0 0 0l9.708 9.708-9.708 9.708c-0 0-0 0-0 0-0.104 0.105-0.18 0.227-0.229 0.357-0.133 0.355-0.057 0.771 0.229 1.057l4.586 4.586c0.286 0.286 0.702 0.361 1.057 0.229 0.13-0.049 0.252-0.124 0.357-0.229 0-0 0-0 0-0l9.708-9.708 9.708 9.708c0 0 0 0 0 0 0.105 0.105 0.227 0.18 0.357 0.229 0.356 0.133 0.771 0.057 1.057-0.229l4.586-4.586c0.286-0.286 0.362-0.702 0.229-1.057-0.049-0.13-0.124-0.252-0.229-0.357z"></path>
</symbol>
</svg>
</div>
{{ range .Site.Menus.global }}
<div class="c-global-nav__item">
<a class="c-link" href="{{ .URL }}">
{{ .Name }}
</a>
</div>
{{ end }}
</nav>
</div>
</div>

View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html lang="{{ with .Site.LanguageCode }}{{ . }}{{ else }}jp{{ end }}">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
<title>{{ .Title }}{{ if not .IsHome }} &middot; {{ .Site.Title }}{{ end }} - {{ with .Site.Params.description }}{{ . }}{{ end }}</title>
{{ hugo.Generator }}
{{ with .Site.Params.description }}
<meta name="description" content="{{ . }}"> {{ end }}
{{ template "_internal/twitter_cards.html" . }}
{{ template "_internal/opengraph.html" . }}
{{ template "_internal/google_analytics.html" . }}
{{ template "_internal/schema.html" . }}
<link href="https://cdnjs.cloudflare.com/ajax/libs/10up-sanitize.css/13.0.0/sanitize.min.css" rel="stylesheet">
<link href="{{ "css/application.css" | absURL }}" rel="stylesheet">
<script src="{{ "js/application.js" | absURL }}" defer></script>
</head>

View file

@ -0,0 +1,24 @@
<header class="c-global-header">
<div class="c-container c-container--medium">
<div class="c-global-header__inner">
<div class="c-global-header__primary">
<h1 class="c-brand">
<a href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a>
</h1>
<p class="c-description">{{ .Site.Params.description }}</p>
</div>
<div class="c-global-header__utility">
<button type="button" class="c-menu">
<svg class="icon icon-menu">
<use xlink:href="#icon-menu"></use>
<symbol id="icon-menu" viewBox="0 0 32 32">
<title>menu</title>
<path d="M2 6h28v6h-28zM2 14h28v6h-28zM2 22h28v6h-28z"></path>
</symbol>
</svg>
</button>
</div>
{{ partial "global-nav.html" . }}
</div>
</div>
</header>

View file

@ -0,0 +1,37 @@
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "NewsArticle",
"mainEntityOfPage": {
"@type": "NewsArticle",
"@id": "{{ .Permalink }}",
"headline": "{{ substr (replace (.Content) "\n" "") 0 110 }}",
"author": "{{ .Site.Params.author }}",
"publisher": {
"@type": "Organization",
"name": "{{ .Site.Params.author }}",
"logo": "{{ .Site.BaseURL }}{{ .Site.Params.logo }}"
},
"image": "{{ .Site.BaseURL }}{{ .Params.image }}",
"datePublished": "{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}"
},
"headline": "{{ substr (replace (.Content) "\n" "") 0 110 }}",
"alternativeHeadline": "{{ .Site.Title }}",
"datePublished": "{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}",
"dateModified": "{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" }}",
"url": "{{ .Permalink }}",
"wordCount": "{{ .WordCount }}",
"author": {
"@type": "Person",
"name": "{{ .Site.Params.author }}"
},
"publisher": {
"@type": "Organization",
"name": "{{ .Site.Params.author }}"
},
"image": "",
{{if .Params.categories }}"genre": "{{ range .Params.categories }}{{ . }}{{ end }}",{{ end }}
{{if .Params.tags }}"keywords": "{{ range .Params.tags }}{{ . }}{{ end }}",{{ end }}
"description": "{{ .Description }}"
}
</script>

View file

@ -0,0 +1,15 @@
{{ if or (.Paginator.HasPrev) (.Paginator.HasNext) }}
<div class="c-pager">
<ul class="c-pager__list">
{{ if .Paginator.HasPrev }}
<li class="c-pager__list__item c-pager__list__item--prev">
<a class="c-link" href="{{ .Permalink }}page/{{ .Paginator.Prev.PageNumber }}">&larr; Newer Posts</a>
</li>
{{ end }} {{ if .Paginator.HasNext }}
<li class="c-pager__list__item c-pager__list__item--next">
<a class="c-link" href="{{ .Permalink }}page/{{ .Paginator.Next.PageNumber }}">Older Posts &rarr;</a>
</li>
{{ end }}
</ul>
</div>
{{ end }}

View file

@ -0,0 +1,13 @@
<div class="c-pager">
<ul class="c-pager__list">
{{ if .PrevInSection }}
<li class="c-pager__list__item c-pager__list__item--prev">
<a class="c-link" href="{{ .PrevInSection.Permalink }}" data-toggle="tooltip" data-placement="top" title="{{ .PrevInSection.Title }}">&larr; Previous Post</a>
</li>
{{ end }} {{ if .NextInSection }}
<li class="c-pager__list__item c-pager__list__item--next">
<a class="c-link" href="{{ .NextInSection.Permalink }}" data-toggle="tooltip" data-placement="top" title="{{ .NextInSection.Title }}">Next Post &rarr;</a>
</li>
{{ end }}
</ul>
</div>

View file

@ -0,0 +1,24 @@
{{ $related := .Site.RegularPages.Related . | first 5 }}
{{ with $related }}
<nav class="related-articles js-related-articles">
<h2 class="related-articles__headline">Related Contents</h2>
<ul class="related-articles__links">
{{ range . }}
<li class="related-articles__links__item js-items">
<article class="related-article">
<p class="related-article__stock">{{ .Date.Format "2006.01.02." }}</p>
<p class="related-article__title">
<a class="related-article__link" href="{{ .RelPermalink }}">{{ .Title }}</a>
</p>
<p class="related-article__tags">
{{ range .Params.tags }}
<span class="related-article__tags__item">
{{ . }}
</span>
{{ end }} </p>
</article>
</li>
{{ end }}
</ul>
</nav>
{{ end }}

View file

@ -0,0 +1,34 @@
<aside class="c-share">
<h2 class="c-share__title">Share</h2>
<div class="c-share__list">
<a class="c-share__list__item c-link" href="http://twitter.com/intent/tweet?text={{ .Title }}%20%7C%20{{ .Site.Title }}%20{{ .Permalink }}" target="_blank">
<svg class="icon icon-twitter">
<use xlink:href="#icon-twitter"></use>
<symbol id="icon-twitter" viewBox="0 0 32 32">
<title>twitter</title>
<path d="M32 7.075c-1.175 0.525-2.444 0.875-3.769 1.031 1.356-0.813 2.394-2.1 2.887-3.631-1.269 0.75-2.675 1.3-4.169 1.594-1.2-1.275-2.906-2.069-4.794-2.069-3.625 0-6.563 2.938-6.563 6.563 0 0.512 0.056 1.012 0.169 1.494-5.456-0.275-10.294-2.888-13.531-6.862-0.563 0.969-0.887 2.1-0.887 3.3 0 2.275 1.156 4.287 2.919 5.463-1.075-0.031-2.087-0.331-2.975-0.819 0 0.025 0 0.056 0 0.081 0 3.181 2.263 5.838 5.269 6.437-0.55 0.15-1.131 0.231-1.731 0.231-0.425 0-0.831-0.044-1.237-0.119 0.838 2.606 3.263 4.506 6.131 4.563-2.25 1.762-5.075 2.813-8.156 2.813-0.531 0-1.050-0.031-1.569-0.094 2.913 1.869 6.362 2.95 10.069 2.95 12.075 0 18.681-10.006 18.681-18.681 0-0.287-0.006-0.569-0.019-0.85 1.281-0.919 2.394-2.075 3.275-3.394z"></path>
</symbol>
</svg>
</a>
<a class="c-share__list__item c-link" href="https://www.facebook.com/sharer/sharer.php?u={{ .Permalink }}" target="_blank">
<svg class="icon icon-facebook">
<use xlink:href="#icon-facebook"></use>
<symbol id="icon-facebook" viewBox="0 0 32 32">
<title>facebook</title>
<path d="M19 6h5v-6h-5c-3.86 0-7 3.14-7 7v3h-4v6h4v16h6v-16h5l1-6h-6v-3c0-0.542 0.458-1 1-1z"></path>
</symbol>
</svg>
</a>
<a class="c-share__list__item" href="http://getpocket.com/edit?url={{ .Permalink }}" target="_blank">
<svg class="icon icon-get-pocket">
<use xlink:href="#icon-get-pocket"></use>
<symbol id="icon-get-pocket" viewBox="0 0 27 28">
<title>get-pocket</title>
<path d="M24.453 2c1.359 0 2.422 1.094 2.422 2.438v8.109c0 7.484-5.984 13.453-13.422 13.453-7.469 0-13.453-5.969-13.453-13.453v-8.109c0-1.328 1.109-2.438 2.438-2.438h22.016zM13.453 18.625c0.469 0 0.938-0.187 1.281-0.516l6.312-6.062c0.359-0.344 0.578-0.828 0.578-1.328 0-1.016-0.828-1.844-1.844-1.844-0.484 0-0.938 0.187-1.281 0.516l-5.047 4.844-5.047-4.844c-0.344-0.328-0.797-0.516-1.266-0.516-1.016 0-1.844 0.828-1.844 1.844 0 0.5 0.203 0.984 0.562 1.328l6.328 6.062c0.328 0.328 0.797 0.516 1.266 0.516z"></path>
</symbol>
</svg>
</a>
</div>
</aside>

View file

@ -0,0 +1,157 @@
{{ $masIns := .Get 0 }}
{{ $tootLink := "" }}
{{ $card := "" }}
{{ $handleInst := "" }}
{{ $mediaMD5 := "" }}
{{ $imageCount := 0 }}
{{ $votesCount := 0 }}
{{ $id := .Get 1 }}
{{ $urlToGet := print "https://" $masIns "/api/v1/statuses/" $id }}
{{ $json := getJSON $urlToGet }}
{{ $jsonHolder := $json }}{{/* Being safe */}}
{{ if isset $json "account" }}
{{ $tootLink = print "https://" $masIns "@" $json.account.acct "/status/" $id }}
{{ $handleInst = print "@" $json.account.acct "@" $masIns }}
{{ end }}
{{ if isset $json "content" }}
<blockquote class="tweet-card" cite="{{ $tootLink }}">
<div class="tweet-header">
<a class="tweet-profile twitterExt" href="https://{{ $masIns }}/@{{ $json.account.acct }}" rel="noopener">
<img
src="{{ $json.account.avatar }}"
alt="Mastodon avatar for {{ $handleInst }}"
loading="lazy"
/>
</a>
<div class="tweet-author">
<a class="tweet-author-name twitterExt" href="https://{{ $masIns }}/@{{ $json.account.acct }}" rel="noopener">{{ $json.account.display_name }}</a>
<a class="tweet-author-handle twitterExt" href="https://{{ $masIns }}/@{{ $json.account.acct }}" rel="noopener">{{ $handleInst }}</a>
</div>
</div>
<p class="tweet-body">
{{ $json.content | safeHTML }}
</p>
{{ with $json.media_attachments }}
{{ range $media_attachments := . }}
{{ if eq $media_attachments.type "image" }}
{{ $imageCount = (add ($imageCount) 1) }}
{{ end }}
{{ end }}
<div class="tweet-img-grid-{{ $imageCount }}">
{{ range $media_attachments := . }}
{{ if eq $media_attachments.type "image" }}
{{ $mediaMD5 = md5 $media_attachments.url }}
<style>
.img-{{ $mediaMD5 }} {
aspect-ratio: {{ $media_attachments.meta.original.width }} / {{ $media_attachments.meta.original.height }};
}
</style>
<img
src="{{ $media_attachments.url }}"
alt="Image {{ $media_attachments.id }} from toot {{ $id }} on {{ $masIns }}"
class="tweet-media-img img-{{ $mediaMD5 }}{{ if $json.sensitive }} tweet-sens-blur{{ end }}"
loading="lazy"
{{- if $json.sensitive }}onclick="this.classList.toggle('tweet-sens-blur-no')"{{- end }}
/>
{{- if $json.sensitive -}}
<div class="blur-text">
Sensitive content<br />
(flagged&nbsp;at&nbsp;origin)
</div>
{{- end -}}
{{ end }}
{{ end }}
</div>
{{/*
N.B.:
The above results in an empty, no-height div
when there's no image but there **is**
at least one item in `$media_attachments`.
Unfortunately, it seems to be the only way
to accomplish this. Not a good HTML practice,
but gets the job done.
*/}}
{{ range $media_attachments := . }}
{{ if eq $media_attachments.type "video" }}
{{ $mediaMD5 = md5 $media_attachments.url }}
<style>
.img-{{ $mediaMD5 }} {
aspect-ratio: {{ $media_attachments.meta.original.width }} / {{ $media_attachments.meta.original.height }};
}
</style>
<div class="ctr tweet-video-wrapper">
<video muted playsinline controls class="ctr tweet-media-img img-{{ $mediaMD5 }}{{ if $json.sensitive }} tweet-sens-blur{{ end }}"{{- if $json.sensitive }}onclick="this.classList.toggle('tweet-sens-blur-no')"{{- end }}>
<source src="{{ $media_attachments.url }}">
<p class="legal ctr">(Your browser doesn&rsquo;t support the <code>video</code> tag.)</p>
</video>
{{- if $json.sensitive -}}
<div class="blur-text">
Sensitive content<br />
(flagged&nbsp;at&nbsp;origin)
</div>
{{- end -}}
</div>
{{ end }}
{{ if eq $media_attachments.type "gifv" }}
{{ $mediaMD5 = md5 $media_attachments.url }}
<style>
.img-{{ $mediaMD5 }} {
aspect-ratio: {{ $media_attachments.meta.original.width }} / {{ $media_attachments.meta.original.height }};
}
</style>
<div class="ctr tweet-video-wrapper">
<video loop autoplay muted playsinline controls controlslist="nofullscreen" class="ctr tweet-media-img img-{{ $mediaMD5 }}{{ if $json.sensitive }} tweet-sens-blur{{ end }}" {{- if $json.sensitive }}onclick="this.classList.toggle('tweet-sens-blur-no')"{{- end }}>
<source src="{{ $media_attachments.url }}">
<p class="legal ctr">(Your browser doesn&rsquo;t support the <code>video</code> tag.)</p>
</video>
{{- if $json.sensitive -}}
<div class="blur-text">
Sensitive content<br />
(flagged&nbsp;at&nbsp;origin)
</div>
{{- end -}}
</div>
{{ end }}
{{ end }}
{{ end }}
{{ with $json.card }}
{{- $cardData := . -}}
{{- with $cardData.image -}}
<a href="{{ $cardData.url }}" rel="'noopener">
<div class="card">
<img src="{{ $cardData.image }}" alt="Card image from {{ $masIns }} toot {{ $id }}" loading="lazy" class="tweet-card-img" />
<p>
<span class="card-title">{{ $cardData.title }}</span><br />
{{ $cardData.description }}
</p>
</div>
</a>
{{- end -}}
{{ end }}
{{ with $json.poll }}
{{ $poll := . }}
{{ with $poll.options }}
{{ range $pollOptions := . }}
{{ $votesCount = add $votesCount $pollOptions.votes_count }}
{{ end }}
<div class="tweet-poll-wrapper">
{{ range $pollOptions := . }}
<div class="tweet-poll-count">
<strong>{{ (mul 100 (div $pollOptions.votes_count $votesCount)) | lang.FormatPercent 1 }}</strong>
</div>
<div class="tweet-poll-meter">
<meter id="vote-count" max="{{ $votesCount }}" value="{{ $pollOptions.votes_count }}"></meter>
</div>
<div class="tweet-poll-title">{{ $pollOptions.title }}</div>
{{ end }}
</div>
<p class="legal">{{ $votesCount }} votes</p>
{{ end }}
{{ end }}
<div class="tweet-footer">
<a href="https://{{ $masIns }}/@{{ $json.account.acct }}/{{ $json.id }}" class="tweet-date twitterExt" rel="noopener">{{ dateFormat "3:04 PM • January 2, 2006" $json.created_at }}</a>&nbsp;<span class="legal">(UTC)</span>
</div>
</blockquote>
{{ end }}