Update the layout

This commit is contained in:
foo-dogsquared 2020-05-11 23:59:06 +08:00
parent 2a978de093
commit 6baee9b923
13 changed files with 225 additions and 192 deletions

View File

@ -27,6 +27,9 @@ other = "Translations"
# General
[and]
other = "And"
[back_to_home]
other = "Back to home"

View File

@ -27,6 +27,9 @@ other = "Mga pagsasalin"
# General
[and]
other = "At"
[back_to_home]
other = "Balik sa homepage"

View File

@ -1,29 +1,49 @@
{{- /* This template was based from the Atom syndication format at IETF RFC #4287 (https://tools.ietf.org/html/rfc4287). */ -}}
{{ printf "<?xml version=\"1.0\" encoding=\"utf-8\" ?>" | safeHTML }}
<feed xmlns="http://www.w3.org/2005/Atom">
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>{{ with .Site.Params.Subtitle }}
<subtitle type="html">{{ . | safeHTML }}</subtitle>{{ end }}
<link rel="alternate" type="text/html" href="{{ .Site.BaseURL }}"/>
<link rel="self" type="application/atom+xml" href="{{ with .OutputFormats.Get "ATOM" }}{{ .Permalink }}{{ end }}"/>
<rights>{{ with .Site.Copyright }}{{ . }}{{ else }}© {{ now.Year }} {{ $.Site.Author.name }}{{ end }}</rights>
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
{{- range .AlternativeOutputFormats }}
{{- printf "<link rel=%q type=%q href=%q/>" .Rel .MediaType .Permalink | safeHTML }}
{{- end }}
<rights>{{ with .Site.Copyright }}{{ . }}{{ else }}© {{ now.Year }} {{ with .Site.Author.name }}{{ . }}{{ end }}{{ end }}</rights>
<generator>Hugo -- gohugo.io</generator>
<updated>{{ .Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}</updated>
{{ with .Site.Author }}
<author>
<name>{{ .Site.Author.name }}</name>{{ with .Site.Author.email }}
<email>{{ . }}</email>{{ end }}
<name>{{ .name }}</name>
{{ with .email }}<email>{{ . }}</email>{{ end }}
</author>
{{ end }}
<id>{{ .Permalink }}</id>
{{- /* Generate each valid regular pages (with as an individual entry in the feed. */ -}}
{{ $limit := cond (gt .Site.Params.feedLimit 0) .Site.Params.feedLimit 10 }}
{{ range first $limit (where .RegularPages "File.Dir" "!=" "/") }}
{{ range first $limit (where .Site.RegularPages ".Params.date" "!=" nil) }}
<entry>
<id>{{ .Permalink }}</id>
<title type="text">{{ .Title }}</title>
<link rel="alternate" href="{{ .Permalink }}" hreflang="{{ .Site.Language.Lang }}" title="{{ .Title | safeHTML }}"/>{{ with .Params.author }}
<author><name>{{ . }}<name></author>{{ end }}{{ range .Params.tags }}
<category term="{{ . }}"/>{{ end }}
<link rel="alternate" href="{{ .Permalink }}" hreflang="{{ .Site.Language.Lang }}" title="{{ .Title | safeHTML }}"/>
{{- range .Params.author }}
<author>
<name>{{ .name }}<name>{{ with .email }}
<email>{{ . }}</email>{{ end }}
</author>
{{- end }}
{{- range .Params.tags }}
<category term="{{ . }}"/>
{{- end }}
<published>{{ .Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}</published>
<updated>{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}</updated>{{ with .Params.license }}
<rights type="html">{{ . | safeHTML }}<rights>{{ end }}
<updated>{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}</updated>
{{ with .Params.copyright }}
<rights type="html">{{ . | safeHTML }}<rights>
{{ end }}
<content type="html">{{ .Content | html }}</content>
</entry>
{{ end }}
</feed>
</feed>

View File

@ -12,22 +12,22 @@
<date datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</date>
</article>
{{ end }}
<div class="pagination">
{{- if .Paginator.HasPrev }}
{{- if ne .Paginator.First .Paginator.Prev -}}
<a rel="first" href="{{ .Paginator.First.URL }}">{{ i18n "first_page" }}</a>
{{- end }}
{{ if .Paginator.HasPrev }}
{{ if ne .Paginator.First .Paginator.Prev }}
<a rel="first" href="{{ .Paginator.First.URL }}">{{ i18n "first_page" }}</a>
{{ end }}
<a rel="prev" href="{{ .Paginator.Prev.URL }}">{{ i18n "prev_page" }}</a>
{{- end }}
<a rel="prev" href="{{ .Paginator.Prev.URL }}">{{ i18n "prev_page" }}</a>
{{ end }}
{{- if .Paginator.HasNext -}}
<a rel="next" href="{{ .Paginator.Next.URL }}">{{ i18n "next_page" }}</a>
{{ if .Paginator.HasNext }}
<a rel="next" href="{{ .Paginator.Next.URL }}">{{ i18n "next_page" }}</a>
{{ if ne .Paginator.Last .Paginator.Next }}
<a rel="last" href="{{ .Paginator.Last.URL }}">{{ i18n "last_page" }}</a>
{{ end }}
{{ end }}
{{- if ne .Paginator.Last .Paginator.Next -}}
<a rel="last" href="{{ .Paginator.Last.URL }}">{{ i18n "last_page" }}</a>
{{- end }}
{{- end }}
</div>
{{ end }}

View File

@ -6,15 +6,20 @@
"description": "Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}",
"favicon": "{{ "assets/icon.png" | absURL }}",
"icon": "{{ "assets/icon.png" | absURL }}",
{{- with .Site.Author }}
"author": {
"name": "{{ with .Site.Author.name }}{{ . }}{{ end }}"
"name": "{{ .name }}"
{{- with .email }},
"url": "mailto:{{ . }}"
{{ end }}
},
{{- end }}
"items":
{{- $limit := cond (gt .Site.Params.feedLimit 0) .Site.Params.feedLimit 10 -}}
{{- $pages := first $limit (where .RegularPages "File.Dir" "!=" "/") -}}
{{- $pages := first $limit (where .Site.RegularPages "Params.date" "!=" nil) -}}
{{- $.Scratch.Add "index" slice -}}
{{- range $pages -}}
{{- $.Scratch.Add "index" (dict "id" .Permalink "url" .Permalink "title" .Title "summary" .Summary "content_html" .Content "tags" .Params.tags "date_published" (.Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML) "date_modified" ( .Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML ) ) -}}
{{- $.Scratch.Add "index" (dict "id" .Permalink "url" .Permalink "title" .Title "summary" .Summary "content_html" .Content "tags" .Params.tags "date_published" (.Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML) "date_modified" ( .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML ) ) -}}
{{- end -}}
{{- $.Scratch.Get "index" | jsonify -}}
}
}

View File

@ -1,30 +1,61 @@
{{- /*
The reference used to create this template is at https://cyber.harvard.edu/rss/rss.html.
The template does miss out on certain things which I put it on a list for those who are interested:
* Since there's no standard for multiple authors (with <author>) in the <item> element, I decided it would be best to leave it out for now.
* The name was left out for certain elements that requires an email address (like <managingEditor>, <webMaster>, or <author> in the <item>.
* <item:guid> is a permalink to the HTML post.
* No <item:enclosure>.
* <item:description> contains the whole post; if you want to change it to <item:content:encoded> and make <item:description> a summarized version, refer to https://www.rssboard.org/rss-profile and change the description tag with `.Summary | safeHTML`.
*/ -}}
{{ printf "<?xml version=\"1.0\" encoding=\"utf-8\" standalone=\"yes\" ?>" | safeHTML }}
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
<link>{{ .Permalink }}</link>
<description>Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}</description>
<generator>Hugo -- gohugo.io</generator>{{ with .Site.LanguageCode }}
<language>{{.}}</language>{{end}}{{ with .Site.Author.email }}
<managingEditor>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Author.email }}
<webMaster>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</webMaster>{{end}}
<copyright>{{ with .Site.Copyright }}{{ . }}{{ else }}© {{ now.Year }} {{ $.Site.Author.name }}{{ end }}</copyright>{{ if not .Date.IsZero }}
<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
<generator>Hugo -- gohugo.io</generator>
{{ with .Site.LanguageCode }}
<language>{{.}}</language>
{{end}}
{{ with .Site.Author.email }}
<managingEditor>{{.}}</managingEditor>
<webMaster>{{.}}</webMaster>
{{end}}
<copyright>{{ with .Site.Copyright }}{{ . }}{{ else }}© {{ now.Year }} to the author(s) behind {{ .Site.Title }}{{ end }}</copyright>
{{ if not .Date.IsZero }}
<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>
{{ end }}
<docs>https://cyber.harvard.edu/rss/rss.html</docs>
{{ with .OutputFormats.Get "RSS" }}
{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
{{ end }}
{{- /* Point the alternative output formats. */ -}}
{{ range .AlternativeOutputFormats }}
{{ printf "<atom:link href=%q rel=%q type=%q />" .Permalink .Rel .MediaType | safeHTML }}
{{ end }}
{{- /* Iterate each valid regular page. */ -}}
{{ $limit := cond (gt .Site.Params.feedLimit 0) .Site.Params.feedLimit 10 }}
{{ range first $limit (where .RegularPages "File.Dir" "!=" "/") }}
{{ range first $limit (where .Site.RegularPages ".Params.date" "!=" nil) }}
<item>
<title>{{ .Title }}</title>
<link>{{ .Permalink }}</link>{{ range .Params.tags }}
<category>{{ . }}</category>{{ end }}
<link>{{ .Permalink }}</link>
{{ range .Params.tags }}
<category>{{ . }}</category>
{{ end }}
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
<guid>{{ .Permalink }}</guid>
<description>{{ .Content | html }}</description>
</item>
{{ end }}
</channel>
</rss>
</rss>

View File

@ -6,11 +6,16 @@
<div class="post__meta">
<!-- List the author(s) of the article. -->
{{- with .Params.author }}
<p class="author">{{ i18n "published_by" }}: {{ range . }}{{ . }}; {{ end }}</p>
{{- $names := slice }}
{{- range . }}{{ $names = $names | append .name }}{{ end }}
<p class="author">{{ i18n "published_by" }}: {{ delimit $names ", " ", and " }}</p>
{{- end }}
<!-- Only show the creation date if the `date` field is valid. -->
{{- if ne (.Date.Format "2006") "0001" }}
<!-- Publication date. -->
<p class="created-date">{{ i18n "published_on" }}: <date datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</date></p>
{{- end }}
<!-- Modification date (will only appear if the publication date is less than the modified date.) -->
{{- if ne .Date .Lastmod }}
@ -21,8 +26,9 @@
{{- if .IsTranslated }}
<p>
{{- i18n "available_translations" }}:
|
{{ range .Translations }}
<a href="{{ .Permalink }}">{{ with .Language.LanguageName }}{{ . }}{{ else }}{{ .Lang }}{{ end }}</a>
<a href="{{ .Permalink }}">{{ with .Language.LanguageName }}{{ . }}{{ else }}{{ .Lang }}{{ end }}</a> |
{{- end }}
</p>
{{- end }}
@ -36,7 +42,6 @@
{{ .TableOfContents }}
{{ end }}
<!-- The article content. -->
<article>
{{ .Content }}
</article>

View File

@ -1,29 +0,0 @@
{{ printf "<?xml version=\"1.0\" encoding=\"utf-8\" ?>" | safeHTML }}
<feed xmlns="http://www.w3.org/2005/Atom">
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>{{ with .Site.Params.Subtitle }}
<subtitle type="html">{{ . | safeHTML }}</subtitle>{{ end }}
<link rel="alternate" type="text/html" href="{{ .Site.BaseURL }}"/>
<link rel="self" type="application/atom+xml" href="{{ with .OutputFormats.Get "ATOM" }}{{ .Permalink }}{{ end }}"/>
<rights>{{ with .Site.Copyright }}{{ . }}{{ else }}© {{ now.Year }} {{ $.Site.Author.name }}{{ end }}</rights>
<generator>Hugo -- gohugo.io</generator>
<updated>{{ .Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}</updated>
<author>
<name>{{ .Site.Author.name }}</name>{{ with .Site.Author.email }}
<email>{{ . }}</email>{{ end }}
</author>
<id>{{ .Permalink }}</id>
{{ $limit := cond (gt .Site.Params.feedLimit 0) .Site.Params.feedLimit 10 }}
{{ range first $limit (where .Site.RegularPages "File.Dir" "!=" "/") }}
<entry>
<id>{{ .Permalink }}</id>
<title type="text">{{ .Title }}</title>
<link rel="alternate" href="{{ .Permalink }}" hreflang="{{ .Site.Language.Lang }}" title="{{ .Title | safeHTML }}"/>{{ with .Params.author }}
<author><name>{{ . }}<name></author>{{ end }}{{ range .Params.tags }}
<category term="{{ . }}"/>{{ end }}
<published>{{ .Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}</published>
<updated>{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}</updated>{{ with .Params.license }}
<rights type="html">{{ . | safeHTML }}<rights>{{ end }}
<content type="html">{{ .Content | html }}</content>
</entry>
{{ end }}
</feed>

View File

@ -1,20 +0,0 @@
{
"version": "https://jsonfeed.org/version/1",
"title": "{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}",
"home_page_url": "{{ .Site.BaseURL }}",
"feed_url": "{{ with .OutputFormats.Get "json" }}{{ .Permalink }}{{ end }}",
"description": "Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}",
"favicon": "{{ "assets/icon.png" | absURL }}",
"icon": "{{ "assets/icon.png" | absURL }}",
"author": {
"name": "{{ with .Site.Author.name }}{{ . }}{{ end }}"
},
"items":
{{- $limit := cond (gt .Site.Params.feedLimit 0) .Site.Params.feedLimit 10 -}}
{{- $pages := first $limit (where .Site.RegularPages "File.Dir" "!=" "/") -}}
{{- $.Scratch.Add "index" slice -}}
{{- range $pages -}}
{{- $.Scratch.Add "index" (dict "id" .Permalink "url" .Permalink "title" .Title "summary" .Summary "content_html" .Content "tags" .Params.tags "date_published" (.Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML) "date_modified" ( .Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML ) ) -}}
{{- end -}}
{{- $.Scratch.Get "index" | jsonify -}}
}

View File

@ -1,30 +0,0 @@
{{ printf "<?xml version=\"1.0\" encoding=\"utf-8\" standalone=\"yes\" ?>" | safeHTML }}
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
<link>{{ .Permalink }}</link>
<description>Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}</description>
<generator>Hugo -- gohugo.io</generator>{{ with .Site.LanguageCode }}
<language>{{.}}</language>{{end}}{{ with .Site.Author.email }}
<managingEditor>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Author.email }}
<webMaster>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</webMaster>{{end}}
<copyright>{{ with .Site.Copyright }}{{ . }}{{ else }}© {{ now.Year }} {{ $.Site.Author.name }}{{ end }}</copyright>{{ if not .Date.IsZero }}
<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
<docs>https://cyber.harvard.edu/rss/rss.html</docs>
{{ with .OutputFormats.Get "RSS" }}
{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
{{ end }}
{{ $limit := cond (gt .Site.Params.feedLimit 0) .Site.Params.feedLimit 10 }}
{{ range first $limit (where .Site.RegularPages "File.Dir" "!=" "/") }}
<item>
<title>{{ .Title }}</title>
<link>{{ .Permalink }}</link>{{ range .Params.tags }}
<category>{{ . }}</category>{{ end }}
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
<guid>{{ .Permalink }}</guid>
<description>{{ .Content | html }}</description>
</item>
{{ end }}
</channel>
</rss>

View File

@ -7,11 +7,12 @@
<!-- Linking to other languages' homepage. -->
{{ if $.Site.IsMultiLingual }}
<p>{{ i18n "multilingual" }}:
|
{{ range $.Site.Languages }}
<a href="{{ . | relURL }}">{{ with .LanguageName }}{{ . }}{{ else }}{{ .Lang }}{{ end }}</a>
<a href="{{ . | relURL }}">{{ with .LanguageName }}{{ . }}{{ else }}{{ .Lang }}{{ end }}</a> |
{{ end }}
</p>
{{ end }}
<!-- Copyright info. -->
<p>{{ with $.Site.Copyright }}{{ . | markdownify }}{{ else }}© {{ now.Year }} {{ with $.Site.Author.name }}{{ . }}{{ else }}{{ $.Site.Title }}{{ end }}{{ end }}</p>
<p>{{ with $.Site.Copyright }}{{ . | markdownify }}{{ else }}© {{ now.Year }} {{ with $.Site.Author.name }}{{ . }}{{ else }}{{ $.Site.Title }}{{ end }}{{ end }}</p>

View File

@ -1,14 +1,26 @@
<title>{{ if .IsHome }}{{ $.Site.Title | safeHTML }}{{ else }}{{ .Title | safeHTML }}{{ end }}</title>
<link rel="stylesheet" href="{{ "css/main.css" | absURL }}" />
{{- /* Some sane <meta> tags default */ -}}
{{ hugo.Generator }}
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ if .IsHome }}{{ $.Site.Title }}{{ else }}{{ .Title }}{{ end }}</title>
<link rel="stylesheet" href="{{"css/main.css" | absURL }}" />
<meta name="author" content="{{ .Param "author.name" }}" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="referrer" content="no-referrer" />
<meta name="description" content="{{ if (and (eq .Kind "home") .IsHome) }}{{ .Site.Title }}{{ else }}{{ .Summary | safeHTML }}{{ end }}" />
{{- /* Linking all of the output formats for discovery. */ -}}
{{ range .OutputFormats }}
{{ printf "<link rel=%q type=%q href=%q />" .Rel .MediaType.Type .Permalink | safeHTML }}
{{ end }}
{{- /* Persistent theme.
It's a very small script so there's little effect on perceived performance. */ -}}
<script>
const theme = window.localStorage.getItem('theme');
if (theme) {
document.documentElement.dataset.theme = theme;
}
</script>
<!-- MathJax -->
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script id="MathJax-script" defer src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>

View File

@ -1,16 +1,24 @@
html:root {
--foreground: #000000;
--foreground-light: #363537;
:root {
/* The color palette. */
--background: #ffffff;
--background-light: #E6E6E6;
--foreground: #000000;
--foreground-light: #363537;
--grey: #454545;
--fontFamily: serif;
--fontSize: 1.7vw;
--verticalRhythm: 24px;
--contentWidth: 900px;
/* The fonts. */
--body-family: serif;
--header-family: sans-serif;
/* Spacing options. */
--font-size: 1.7vw;
--vertical-rhythm: 24px;
--content-width: 900px;
--border-style: var(--foreground) solid 1px;
}
html[data-theme="dark"]:root {
[data-theme="dark"]:root {
--foreground: #FFFFFF;
--foreground-light: #E6E6E6;
--background: #000000;
@ -18,7 +26,8 @@ html[data-theme="dark"]:root {
--grey: #919191;
}
html {
:root {
font-size: var(--font-size);
margin: 0;
padding: 0;
}
@ -28,31 +37,31 @@ html {
body {
background: var(--background);
color: var(--foreground);
font-family: var(--fontFamily);
font-size: var(--fontSize);
line-height: var(--verticalRhythm);
font-family: var(--body-family);
font-size: var(--font-size);
line-height: var(--vertical-rhythm);
margin: 0 auto;
max-width: var(--contentWidth);
max-width: var(--content-width);
padding: 1rem;
}
nav {
margin: var(--verticalRhythm) auto;
margin: 1rem auto;
}
article h2 {
margin-top: calc(var(--verticalRhythm) * 3);
margin-top: 3rem;
}
article h3 {
margin-top: calc(var(--verticalRhythm) * 2);
margin-top: 2rem;
}
/* Text formatting */
h1, h2, h3,
h4, h5, h6 {
font-family: sans-serif;
font-family: var(--header-family);
line-height: 1.25;
}
@ -69,19 +78,8 @@ dd, li, p, td {
}
dd, p {
margin-top: var(--verticalRhythm);
margin-bottom: var(--verticalRhythm);
}
table, thead, tbody {
border: var(--foreground) solid 1px;
margin: 0 auto;
border-collapse: collapse;
}
th, td {
border: var(--foreground) solid 1px;
padding: 1rem;
margin-top: 1rem;
margin-bottom: 1rem;
}
tr:nth-child(even) {
@ -91,10 +89,11 @@ tr:nth-child(even) {
pre {
background: var(--background-light);
border: var(--background) solid 1px;
font-size: 1rem;
line-height: 1.5;
margin-top: var(--verticalRhythm);
margin-bottom: var(--verticalRhythm);
padding: calc(var(--verticalRhythm) / 2);
margin-top: 1rem;
margin-bottom: 1rem;
padding: 0.5rem;
overflow: auto;
}
@ -103,40 +102,63 @@ aside {
color: var(--grey);
border: 1px solid var(--grey);
border-left: 3px solid var(--grey);
font-size: calc(var(--fontSize) * (1 - var(--vertical-rhythm-reduction)));
line-height: calc(var(--verticalRhythm) * (1 + var(--vertical-rhythm-reduction)));
margin: var(--verticalRhythm) 0;
padding: calc(var(--verticalRhythm) / 2);
font-size: calc(1rem * (1 - var(--vertical-rhythm-reduction)));
line-height: calc(1rem * (1 + var(--vertical-rhythm-reduction)));
margin: 1rem 0;
padding: 0.5rem;
width: 100%;
}
/* Multimedia blocks */
img, video, audio, iframe {
width: 100%;
display: block;
height: auto;
max-width: 100%;
margin: auto;
}
table {
border: var(--border-style);
border-collapse: collapse;
margin: auto;
}
thead, tbody {
margin: 0 auto;
}
th, td {
border: var(--border-style);
padding: 1rem;
}
ol, ul {
line-height: 1.5;
}
figure {
margin-bottom: calc(var(--verticalRhythm) * 2);
margin: 2rem auto;
}
figure > * {
margin: 1rem auto;
}
figcaption {
text-align: center;
font-size: 1rem;
}
svg {
--size: var(--fontSize);
--size: var(--font-size);
height: var(--size);
width: var(--size);
fill: currentColor;
}
footer {
display: flex;
justify-content: space-evenly;
align-items: center;
flex-flow: column nowrap;
}
blockquote {
width: 100%;
margin: 2rem 1rem;
}
blockquote footer {
@ -146,12 +168,21 @@ blockquote footer {
}
/* Semantic blocks */
footer {
display: flex;
justify-content: space-evenly;
align-items: center;
flex-flow: column wrap;
}
/* Layout styles. */
.site__title {
display: inline-block;
font-size: calc(var(--fontSize) * 2);
margin-bottom: var(--verticalRhythm);
margin-right: calc(var(--verticalRhythm) / 2);
font-size: calc(var(--font-size) * 2);
margin-bottom: 1rem;
margin-right: 0.5rem;
}
.site__links {
@ -163,7 +194,7 @@ blockquote footer {
border: var(--foreground) solid 1px;
color: var(--foreground);
cursor: pointer;
padding: calc(var(--verticalRhythm) / 2);
padding: 0.5rem;
position: absolute;
right: 0;
top: 0;
@ -174,14 +205,14 @@ blockquote footer {
display: flex;
justify-content: space-evenly;
padding: 0;
margin: var(--verticalRhythm);
margin: 1rem;
}
.post {
align-items: center;
display: flex;
justify-content: space-between;
margin-top: var(--verticalRhythm);
margin-top: 1rem;
}
.post h1 {
@ -189,7 +220,7 @@ blockquote footer {
}
.post__meta > * {
margin: calc(var(--verticalRhythm) / 2) auto;
margin: 0.5rem auto;
}
.icon {
@ -203,18 +234,19 @@ blockquote footer {
/* Mobile styles */
@media (max-width: 860px) {
html:root {
--fontSize: 18px;
--font-size: 18px;
}
.post {
align-items: unset;
flex-flow: column;
margin-bottom: var(--verticalRhythm);
margin-bottom: 1rem;
}
}
@media all and (min-width: 1000px) {
html:root {
--fontSize: 24px;
--font-size: 20px;
}
}
}