From a65a435b1d0ce2ebf9c5095b98cac56ba09283f5 Mon Sep 17 00:00:00 2001 From: BBaoVanC Date: Sat, 21 May 2022 23:20:22 -0500 Subject: [PATCH] Replace
  • in page lists with semantic HTML
    --- assets/css/bobastyle.css | 40 ++++++++++------- layouts/_default/summary/post.html | 34 +++++++-------- layouts/_default/summary/series.html | 44 +++++++++---------- layouts/_default/summary/series_post.html | 52 +++++++++++------------ layouts/authors/list.html | 10 ++--- layouts/partials/page-list.html | 10 ++--- layouts/partials/top.html | 10 +++-- layouts/series/list.html | 12 +++--- layouts/taxonomy/list.html | 26 ++++++------ 9 files changed, 122 insertions(+), 116 deletions(-) diff --git a/assets/css/bobastyle.css b/assets/css/bobastyle.css index 59814ca..8989e20 100644 --- a/assets/css/bobastyle.css +++ b/assets/css/bobastyle.css @@ -123,8 +123,8 @@ gap: 40px; } -.page-list ul, -.series-taxonomy ul { +.page-list, +.series-taxonomy-list { display: flex; flex-direction: column; list-style: none; @@ -132,12 +132,13 @@ gap: 40px; } -.series-taxonomy ul { +.series-taxonomy-list { gap: 80px; } -.page-list li, -.series-taxonomy li { +.page-list .post, +.series-taxonomy-list .series-taxonomy, +.series-taxonomy .post { padding-top: 8px; padding-left: 24px; padding-right: 24px; @@ -206,7 +207,7 @@ margin: 0; } -.taxonomy-list ul { +.taxonomy-list { list-style: none; padding: 0; display: flex; @@ -214,7 +215,7 @@ gap: 10px; } -.taxonomy-list li { +.taxonomy-list .taxonomy-term { background-color: var(--background-1); color: var(--text-1); padding: 8px 12px; @@ -230,7 +231,7 @@ } @media (max-width: 480px) { - .taxonomy-list li { + .taxonomy-list .taxonomy-term { flex-direction: column; gap: 4px; } @@ -244,7 +245,7 @@ /* Series list format */ -.series-pages ul { +.series-page-list { display: flex; gap: 10px; flex-flow: row wrap; @@ -255,7 +256,7 @@ border-radius: 16px; } -.series-pages li { +.series-page-list .post { flex: 1; min-width: 49%; } @@ -304,8 +305,13 @@ /* Header formatting (website title and article section headers) */ -h1.header { +.header { + margin: 16px 0; +} + +.header h1 { font-size: 1.5em; + font-weight: bold; } .header a, @@ -347,6 +353,7 @@ h1.header { } + /* Related posts */ .full-width-page-list { /* make left/right 0 margin so it takes up full width */ @@ -359,16 +366,16 @@ h1.header { margin-right: 20px; } -.full-width-page-list li { +.full-width-page-list .post { min-width: 300px; max-width: 300px; } -.full-width-page-list li:first-child { +.full-width-page-list .post:first-child { margin-left: 20px; } -.full-width-page-list li:last-child { +.full-width-page-list .post:last-child { margin-right: 20px; } @@ -393,7 +400,7 @@ h1.header { } } -.full-width-page-list .page-list ul { +.full-width-page-list .page-list { display: flex; flex-direction: row; gap: 20px; @@ -401,6 +408,7 @@ h1.header { } + /* Social media share buttons */ .share-buttons { background: var(--background-1); @@ -439,6 +447,7 @@ h1.header { */ + /* See also formating */ .see-also { background-color: var(--background-1); @@ -453,6 +462,7 @@ h1.header { } + /* Back to top */ #back-to-top { position: fixed; diff --git a/layouts/_default/summary/post.html b/layouts/_default/summary/post.html index ccc682c..492a31f 100644 --- a/layouts/_default/summary/post.html +++ b/layouts/_default/summary/post.html @@ -1,23 +1,21 @@ -
    -

    - {{ with .Parent.Params.icon }}{{ partial "icon.html" . }}{{ end }} - {{ .Title | markdownify }} - {{ if .Draft }}{{ partial "icon.html" "write" }}{{ end }} -

    +

    + {{ with .Parent.Params.icon }}{{ partial "icon.html" . }}{{ end }} + {{ .Title | markdownify }} + {{ if .Draft }}{{ partial "icon.html" "write" }}{{ end }} +

    - {{ partial "post-metadata/short.html" . }} +{{ partial "post-metadata/short.html" . }} - {{ with .Resources.GetMatch "feature" }} -
    - {{ partial "figure.html" (dict "src" .) }} -
    - {{ end }} - -
    - {{ partial "description-or-summary.html" . }} +{{ with .Resources.GetMatch "feature" }} +
    + {{ partial "figure.html" (dict "src" .) }}
    +{{ end }} -
    - {{ i18n "read_more" }} → -
    +
    + {{ partial "description-or-summary.html" . }} +
    + +
    + {{ i18n "read_more" }} →
    diff --git a/layouts/_default/summary/series.html b/layouts/_default/summary/series.html index 8be96ed..f5127ef 100644 --- a/layouts/_default/summary/series.html +++ b/layouts/_default/summary/series.html @@ -1,26 +1,24 @@ -
    -

    - {{ with .Parent.Params.icon }}{{ partial "icon.html" . }}{{ end }} - {{ .Title | markdownify }} - {{ if .Draft }}{{ partial "icon.html" "write" }}{{ end }} -

    +

    + {{ with .Parent.Params.icon }}{{ partial "icon.html" . }}{{ end }} + {{ .Title | markdownify }} + {{ if .Draft }}{{ partial "icon.html" "write" }}{{ end }} +

    - {{ partial "post-metadata/series.html" . }} +{{ partial "post-metadata/series.html" . }} -
    - {{ partial "description-or-summary.html" . }} -
    - -
    -
      - {{ $i := 0 }} - {{ $total := len .Data.Pages }} - {{ range .Data.Pages.Reverse }} - {{ $i = add 1 $i }} - {{ .Scratch.Set "series_position" $i }} - {{ .Scratch.Set "series_total" $total }} -
    • {{ .Render "summary/series_post" }}
      • - {{ end }} -
    -
    +
    + {{ partial "description-or-summary.html" . }} +
    + +
    + {{ $i := 0 }} + {{ $total := len .Data.Pages }} + {{ range .Data.Pages.Reverse }} + {{ $i = add 1 $i }} + {{ .Scratch.Set "series_position" $i }} + {{ .Scratch.Set "series_total" $total }} +
    + {{ .Render "summary/series_post" }} +
    + {{ end }}
    diff --git a/layouts/_default/summary/series_post.html b/layouts/_default/summary/series_post.html index 64c2aeb..6ef73b0 100644 --- a/layouts/_default/summary/series_post.html +++ b/layouts/_default/summary/series_post.html @@ -1,29 +1,27 @@ -
    -
    - {{ if .Scratch.Get "series_position" }} - ({{ .Scratch.Get "series_position" }}/{{ .Scratch.Get "series_total" }}) - {{ end }} -
    - -

    - {{ with .Parent.Params.icon }}{{ partial "icon.html" . }}{{ end }} - {{ .Title | markdownify }} - {{ if .Draft }}{{ partial "icon.html" "write" }}{{ end }} -

    - - {{ partial "post-metadata/short.html" . }} - - {{ with .Resources.GetMatch "feature" }} -
    - {{ partial "figure.html" (dict "src" .) }} -
    +
    + {{ if .Scratch.Get "series_position" }} + ({{ .Scratch.Get "series_position" }}/{{ .Scratch.Get "series_total" }}) {{ end }} - -
    - {{ partial "description-or-summary.html" . }} -
    - -
    - {{ i18n "read_more" }} → -
    +
    + +

    + {{ with .Parent.Params.icon }}{{ partial "icon.html" . }}{{ end }} + {{ .Title | markdownify }} + {{ if .Draft }}{{ partial "icon.html" "write" }}{{ end }} +

    + +{{ partial "post-metadata/short.html" . }} + +{{ with .Resources.GetMatch "feature" }} +
    + {{ partial "figure.html" (dict "src" .) }} +
    +{{ end }} + +
    + {{ partial "description-or-summary.html" . }} +
    + +
    + {{ i18n "read_more" }} →
    diff --git a/layouts/authors/list.html b/layouts/authors/list.html index 5e6833e..2a227b1 100644 --- a/layouts/authors/list.html +++ b/layouts/authors/list.html @@ -6,11 +6,11 @@
    {{ with .Paginator.Pages }} -
      - {{ range . }} -
    • {{ .Render "summary/author" }}
      • - {{ end }} -
    + {{ range . }} +
    + {{ .Render "summary/author" }} +
    + {{ end }} {{ else }}
    {{ i18n "no_posts" }} diff --git a/layouts/partials/page-list.html b/layouts/partials/page-list.html index c93ddf5..5058da0 100644 --- a/layouts/partials/page-list.html +++ b/layouts/partials/page-list.html @@ -1,10 +1,10 @@
    {{ with . }} -
      - {{ range . }} -
    • {{ .Render "summary/post" }}
      • - {{ end }} -
    + {{ range . }} +
    + {{ .Render "summary/post" }} +
    + {{ end }} {{ else }}
    {{ i18n "no_posts" }} diff --git a/layouts/partials/top.html b/layouts/partials/top.html index 999548a..44809b8 100644 --- a/layouts/partials/top.html +++ b/layouts/partials/top.html @@ -1,6 +1,10 @@ -

    - {{ .Site.Title | markdownify }} -

    +
    +

    + + {{ .Site.Title | markdownify }} + +

    +