From f3419a37b1eac3c19fd2da733cf1d0c7fa07cb92 Mon Sep 17 00:00:00 2001 From: ItsDrike Date: Wed, 11 May 2022 14:04:08 +0200 Subject: [PATCH] Redesign list layout --- layouts/_default/list.html | 25 ++++++++---- layouts/partials/content-details.html | 6 --- layouts/partials/list_item.html | 27 ++++++++----- layouts/posts/list.html | 46 +++++++++++++-------- static/src/scss/style.scss | 58 +++++++++++++++++++++++++++ 5 files changed, 122 insertions(+), 40 deletions(-) diff --git a/layouts/_default/list.html b/layouts/_default/list.html index e2aa788..9f27127 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -1,13 +1,22 @@ {{ define "main" }} -
+
- {{ partial "content.html" . }} - {{ if .Content }} + {{ partial "content.html" . }} + {{ if .Content }}
- {{ end }} - {{ range .Pages.ByTitle }} - {{ partial "list_item.html" . }} - {{ end }} + {{ end }} + +
+
+
    + {{ range .Pages.ByTitle }} +
  • + {{ partial "list_item.html" . }} +
  • + {{ end }} +
+
+
-
+
{{ end }} diff --git a/layouts/partials/content-details.html b/layouts/partials/content-details.html index 3f6c407..1d23904 100644 --- a/layouts/partials/content-details.html +++ b/layouts/partials/content-details.html @@ -1,9 +1,3 @@ -{{ if not .Date.IsZero }} - - {{ .Date.Format "2006-01-02" }} - -{{ end }} - {{ if not .Parent.IsHome }} {{ if gt .ReadingTime 2 }} diff --git a/layouts/partials/list_item.html b/layouts/partials/list_item.html index e190a65..c7485ac 100644 --- a/layouts/partials/list_item.html +++ b/layouts/partials/list_item.html @@ -1,9 +1,18 @@ -
-
- -
{{ .Title }}
-
- {{ partial "content-details.html" . }} -

{{ partial "summary.html" . }}

-
-
+ +{{ if not (.Scratch.Get "dateformat") }} +{{ .Scratch.Set "dateformat" "Jan 02, 2006" }} +{{ end }} +{{ $dateformat := .Scratch.Get "dateformat" }} + +{{ .Scratch.Set "dateformat" nil }} + + + + {{ .Title }} + {{ if not .Date.IsZero }} + {{ .Date.Format $dateformat }} + {{ end }} + +{{ partial "content-details.html" . }} + +

{{ partial "summary.html" . }}

diff --git a/layouts/posts/list.html b/layouts/posts/list.html index 662b8de..c01899d 100644 --- a/layouts/posts/list.html +++ b/layouts/posts/list.html @@ -1,22 +1,34 @@ {{ define "main" }} -
+
- {{ partial "content.html" . }} + - - {{ range .Pages.GroupByDate "2006-01" }} - {{ $month := print .Key "-01"}} - {{ $display := dateFormat "2006-01" $month }} -

- - - -

- - {{ range (sort .Pages "Date" "desc") }} - {{ partial "list_item.html" . }} - {{ end }} - {{ end }} +
+ {{ partial "content.html" . }} + + {{ range .Data.Pages.GroupByDate "2006" }} + {{ $year := .Key }} + +
+ +

+ + + +

+ + +
    + {{ range .Pages }} +
  • + {{ .Scratch.Set "dateformat" "Jan 02" }} + {{ partial "list_item.html" . }} +
  • + {{ end }} +
+
+ {{ end }} +
-
+
{{ end }} diff --git a/static/src/scss/style.scss b/static/src/scss/style.scss index c606ee9..043e23b 100644 --- a/static/src/scss/style.scss +++ b/static/src/scss/style.scss @@ -195,3 +195,61 @@ img { width: 100%; height: 35vh; } + +.item-list { + width: 100%; + max-width: 1500px; + text-align: left; + padding: 20px; + margin: 20px auto; + + .item-list-group { + display: flex; + margin-bottom: 1.9em; + line-height: normal; + } + + .item-list-year { + padding-top: 6px; + margin-right: 1.8em; + font-size: 2em; + } + + .item-list-items { + flex-grow: 1; + margin: 0; + padding: 0; + list-style: none; + } + + .item-list-item { + border-bottom: 1px grey dashed; + + .item-link { + display: flex; + justify-content: space-between; + align-items: baseline; + text-decoration: none; + } + + .item-title { + font-size: 1.3rem; + margin: 5px 0 5px 0; + } + + .item-day { + flex-shrink: 0; + margin-left: 1em; + opacity: 0.8; + } + + .item-details { + font-size: 0.8rem; + text-indent: 2em; + } + + .item-summary { + font-size: 1rem; + } + } +}