Clean up CSS

- Add vim folds to make organized sections
- Rename a lot of classes from post- to page-
- Generalize series CSS classes better
- Clean up navbar div structure
- Remove langpicker and most of multilingual support
- many other minor tweaks
This commit is contained in:
2023-03-24 08:49:02 -05:00
parent d34b2a56d7
commit 7bc8a4cb57
33 changed files with 674 additions and 936 deletions

View File

@ -1,7 +1,7 @@
<div class="page-list">
{{ with . }}
{{ range . }}
<article class="post">
<article class="page">
{{ .Render "summary" }}
</article>
{{ end }}

View File

@ -1,16 +1,16 @@
<div class="author-metadata" aria-label="{{ i18n "aria_author_metadata" }}">
<div class="page-metadata" aria-label="{{ i18n "aria_author_metadata" }}">
{{/* Calculate the total word count */}}
{{ $total_words := 0 }}
{{ range .Data.Pages }}
{{ $total_words = add $total_words .WordCount }}
{{ end }}
<span class="author-meta-item" aria-label="{{ i18n "aria_author_post_count" }}">
<span class="page-metadata-item" aria-label="{{ i18n "aria_author_post_count" }}">
{{ partial "icon.html" "newspaper" }}
{{ i18n "post_count" (len .Data.Pages) }}
</span>
<span class="author-meta-item" aria-label="{{ i18n "aria_author_word_count" }}">
<span class="page-metadata-item" aria-label="{{ i18n "aria_author_word_count" }}">
{{ partial "icon.html" "align-left" }}
{{ i18n "wordcount" $total_words }}
</span>

View File

@ -1,5 +1,5 @@
{{ with .Params.authors }}
<span class="post-meta-item" aria-label="{{ i18n "aria_post_meta_authors" }}">
<span class="page-metadata-item" aria-label="{{ i18n "aria_post_meta_authors" }}">
{{ partial "icon.html" "user-circle" }}
{{ if index $.Site.Taxonomies "authors" }}

View File

@ -4,7 +4,7 @@
{{ $categories = $categories | append (printf `<a href="%s">%s</a>` .Permalink .LinkTitle) }}
{{ end }}
<div class="categories" aria-label="{{ i18n "aria_post_meta_categories" }}">
<div class="page-metadata-section categories" aria-label="{{ i18n "aria_post_meta_categories" }}">
{{ partial "icon.html" "folder" }}
{{ delimit $categories ", " }}
</div>

View File

@ -1,5 +1,5 @@
{{ if and .Site.Params.gitHistoryURL .File.Path }}
<span class="post-meta-item post-meta-edit-history" aria-label="{{ i18n "aria_post_meta_edit_history" }}">
<span class="page-metadata-item post-meta-edit-history" aria-label="{{ i18n "aria_post_meta_edit_history" }}">
{{ partial "icon.html" "history" }}
<a href="{{ printf "%s/content/%s" .Site.Params.gitHistoryURL .File.Path }}" target="_blank" rel="noopener">
{{- i18n "edit_history" -}}

View File

@ -1,5 +1,5 @@
{{ if ne .Site.Params.readingtime false }}
<span class="post-meta-item" aria-label="{{ i18n "aria_post_meta_reading_time" }}">
<span class="page-metadata-item" aria-label="{{ i18n "aria_post_meta_reading_time" }}">
{{ partial "icon.html" "clock" }}
{{ i18n "readingtime" .ReadingTime }}
</span>

View File

@ -4,7 +4,7 @@
{{ $series = $series | append (printf `<a href="%s">%s</a>` .Permalink .LinkTitle) }}
{{ end }}
<div class="series" aria-label="{{ i18n "aria_post_meta_series" }}">
<div class="page-metadata-section series" aria-label="{{ i18n "aria_post_meta_series" }}">
{{ partial "icon.html" "files" }}
{{ delimit $series ", " }}
</div>

View File

@ -4,7 +4,7 @@
{{ $tags = $tags | append (printf `<a href="%s">%s</a>` .Permalink .LinkTitle) }}
{{ end }}
<div class="tags" aria-label="{{ i18n "aria_post_meta_tags" }}">
<div class="page-metadata-section tags" aria-label="{{ i18n "aria_post_meta_tags" }}">
{{ partial "icon.html" "tag" }}
{{ delimit $tags ", " }}
</div>

View File

@ -1,7 +1,7 @@
{{ if or .Date .Params.authors .IsTranslated .Site.Params.readingtime .Site.Params.gitFileURL }}
<div class="post-metadata" aria-label="{{ i18n "aria_post_metadata" }}">
{{ if or .Date .Params.authors .Site.Params.readingtime .Site.Params.gitFileURL }}
<div class="page-metadata" aria-label="{{ i18n "aria_post_metadata" }}">
{{ if .Date }}
<span class="post-meta-item" aria-label="{{ i18n "aria_post_meta_date" }}">
<span class="page-metadata-item" aria-label="{{ i18n "aria_post_meta_date" }}">
{{ partial "icon.html" "calendar" }}
<time datetime="{{ .Date.Format "2006-01-02" }}" pubdate>
{{ i18n "long_date" (dict "Date" .Date "Data" .Site.Data) }}
@ -11,7 +11,7 @@
{{/* TODO: make this be a tooltip */}}
{{/* DISABLED
{{ if ne (time.Format "2006-01-02" .Lastmod) (time.Format "2006-01-02" .Date) }}
<span class="post-meta-item" aria-label="{{ i18n "aria_post_meta_modified_date" }}">
<span class="page-metadata-item" aria-label="{{ i18n "aria_post_meta_modified_date" }}">
{{ partial "icon.html" "pencil" }}
<time datetime="{{ .Lastmod.Format "2006-01-02" }}" pubdate>
{{ i18n "long_date" (dict "Date" .Lastmod "Data" .Site.Data) }}
@ -21,11 +21,10 @@
*/}}
{{ end }}
{{ partial "post-meta-item/authors.html" . }}
{{ partial "post-meta-item/translations.html" . }}
{{ partial "post-meta-item/readingtime.html" . }}
{{ partial "post-meta-item/edithistory.html" . }}
{{ partial "post-meta-item/categories.html" . }}
{{ partial "post-meta-item/tags.html" . }}
{{ partial "page-metadata/item/authors.html" . }}
{{ partial "page-metadata/item/readingtime.html" . }}
{{ partial "page-metadata/item/edithistory.html" . }}
{{ partial "page-metadata/item/categories.html" . }}
{{ partial "page-metadata/item/tags.html" . }}
</div>
{{ end }}

View File

@ -0,0 +1,18 @@
{{ if or .Date .Params.authors .Site.Params.readingtime }}
<div class="page-metadata" aria-label="{{ i18n "aria_post_metadata" }}">
{{ if .Date }}
<span class="page-metadata-item" aria-label="date">
{{ partial "icon.html" "calendar" }}
<time datetime="{{ .Date.Format "2006-01-02" }}" pubdate>
{{ i18n "long_date" (dict "Date" .Date "Data" .Site.Data) }}
</time>
</span>
{{ end }}
{{ partial "page-metadata/item/authors.html" . }}
{{ partial "page-metadata/item/readingtime.html" . }}
{{ partial "page-metadata/item/series.html" . }}
{{ partial "page-metadata/item/categories.html" . }}
{{ partial "page-metadata/item/tags.html" . }}
</div>
{{ end }}

View File

@ -1,11 +1,11 @@
<div class="post-metadata" aria-label="{{ i18n "aria_series_metadata" }}">
<span class="post-meta-item">
<div class="page-metadata" aria-label="{{ i18n "aria_series_metadata" }}">
<span class="page-metadata-item">
{{ partial "icon.html" "newspaper" }}
{{ i18n "post_count" (len .Data.Pages) }}
</span>
{{ if ne .Site.Params.readingtime false }}
<span class="post-meta-item">
<span class="page-metadata-item">
{{ partial "icon.html" "clock" }}
{{ $readingtime := 0 }}
{{ range .Data.Pages }}
@ -14,6 +14,4 @@
{{ i18n "readingtime" $readingtime }}
</span>
{{ end }}
{{ partial "post-meta-item/translations.html" . }}
</div>

View File

@ -1,8 +0,0 @@
{{ if .IsTranslated }}
<span class="post-meta-item" aria-label="{{ i18n "aria_post_meta_translations" }}">
{{ partial "icon.html" "world" }}
{{ range .Translations }}
<a href="{{ .Permalink }}">{{ .Language }}</a>
{{ end }}
</span>
{{ end }}

View File

@ -1,19 +0,0 @@
{{ if or .Date .Params.authors .IsTranslated .Site.Params.readingtime }}
<div class="post-metadata" aria-label="{{ i18n "aria_post_metadata" }}">
{{ if .Date }}
<span class="post-meta-item" aria-label="date">
{{ partial "icon.html" "calendar" }}
<time datetime="{{ .Date.Format "2006-01-02" }}" pubdate>
{{ i18n "long_date" (dict "Date" .Date "Data" .Site.Data) }}
</time>
</span>
{{ end }}
{{ partial "post-meta-item/authors.html" . }}
{{ partial "post-meta-item/translations.html" . }}
{{ partial "post-meta-item/readingtime.html" . }}
{{ partial "post-meta-item/series.html" . }}
{{ partial "post-meta-item/categories.html" . }}
{{ partial "post-meta-item/tags.html" . }}
</div>
{{ end }}

View File

@ -1,54 +1,21 @@
<header class="header">
<a href="{{ .Site.Home.Permalink | absLangURL }}">
<a class="heading-link" href="{{ .Site.Home.Permalink | absLangURL }}">
{{ .Site.Title | markdownify }}
</a>
</header>
<div class="topbar">
<nav class="navbar" aria-label="{{ i18n "aria_navbar" }}">
{{ with .Site.Home }}
<a class="navbar-item{{ if $.IsHome }} active{{ end }}" href="{{ .Permalink | absLangURL }}">{{ .Title | markdownify }}</a>
{{ end }}
{{ range .Site.Menus.main }}
{{ $isActive := false }}
{{ if or ($.HasMenuCurrent .Menu .) ($.IsMenuCurrent .Menu .) }}
{{ $isActive = true }}
{{ end }}
<a class="navbar-item{{ if $isActive }} active{{ end }}"
{{ if strings.HasPrefix .URL "http" }}target="_blank" rel="noopener"{{ end }}
href="{{ .URL }}">{{ .Name }}</a>
{{ end }}
</nav>
{{ if .Site.IsMultiLingual }}
<details class="langpicker" aria-label="{{ i18n "aria_langpicker" }}">
<summary>
{{- partial "icon.html" "world" -}}
</summary>
<ul class="languages" aria-label="{{ i18n "aria_langpicker_list" }}">
{{ range .AllTranslations }}
<li>
<a class="langpicker-item{{ if eq .Language $.Site.Language }} active{{ end }}" href="{{ .Permalink }}">{{ .Language.LanguageName }}</a>
</li>
{{ end }}
{{ $site_translations := slice }}
{{ range .Site.Languages }}
{{ $site_translations = $site_translations | append .LanguageName }}
{{ end }}
{{ $translation_codes := slice }}
{{ range .AllTranslations }}
{{ $translation_codes = $translation_codes | append .Language }}
{{ end }}
{{ range (.Site.Languages | complement $translation_codes) }}
<li>
<a class="langpicker-item unavailable" aria-disabled="true">{{ .LanguageName }}</a>
</li>
{{ end }}
</ul>
</details>
<nav class="navbar" aria-label="{{ i18n "aria_navbar" }}">
{{ with .Site.Home }}
<a class="navbar-item{{ if $.IsHome }} active{{ end }}" href="{{ .Permalink | absLangURL }}">{{ .Title | markdownify }}</a>
{{ end }}
</div>
{{ range .Site.Menus.main }}
{{ $isActive := false }}
{{ if or ($.HasMenuCurrent .Menu .) ($.IsMenuCurrent .Menu .) }}
{{ $isActive = true }}
{{ end }}
<a class="navbar-item{{ if $isActive }} active{{ end }}"
{{ if strings.HasPrefix .URL "http" }}target="_blank" rel="noopener"{{ end }}
href="{{ .URL }}">{{ .Name }}</a>
{{ end }}
</nav>