diff --git a/assets/sass/_theme/_utils.sass b/assets/sass/_theme/_utils.sass index 083b6dce34306d4c74f75b65bd18515160a41131..7d9b3d2a0d96b913d409e4fae338d0ac74958fc8 100644 --- a/assets/sass/_theme/_utils.sass +++ b/assets/sass/_theme/_utils.sass @@ -101,6 +101,7 @@ padding-right: $grid-gutter @mixin grid($cols: 12, $breakpoint: false, $gap-y: $grid-gutter, $gap-x: $grid-gutter) + word-break: break-word @if $breakpoint @include media-breakpoint-up($breakpoint) display: grid @@ -183,9 +184,9 @@ object-fit: cover h1 @include h3 - a - @include stretched-link - text-decoration: none + a + @include stretched-link + text-decoration: none p + time margin-top: $spacing0 diff --git a/assets/sass/_theme/blocks/posts.sass b/assets/sass/_theme/blocks/posts.sass index 24a460c6fc7ace078a033cf44278a8be401be947..a0488076e8fa15d79c07bb7af0e69fe1426cc3bc 100644 --- a/assets/sass/_theme/blocks/posts.sass +++ b/assets/sass/_theme/blocks/posts.sass @@ -113,7 +113,6 @@ margin-top: half($spacing3) border-top: 1px solid $color-border article - @include article border-bottom: 1px solid $color-border position: relative padding-bottom: half($spacing3) @@ -139,7 +138,10 @@ @include grid(8, desktop, 0, 0) h1 grid-column: 1 / 7 + .post-categories + grid-column: 1 / 7 time + grid-row: 1 grid-column: 7 / 9 text-align: right order: 2 diff --git a/assets/sass/_theme/sections/posts.sass b/assets/sass/_theme/sections/posts.sass index ced7fcd500c99dfa584e9212312bb5dd2b3ae023..a9daacc9bf0e91e7fcc37b9a1d3fe9d4fb52ee39 100644 --- a/assets/sass/_theme/sections/posts.sass +++ b/assets/sass/_theme/sections/posts.sass @@ -2,6 +2,20 @@ @include article($post-media-background) time color: $post-time-color + .post-categories + @include meta + margin-top: $spacing0 + margin-bottom: $spacing0 + position: relative + display: flex + flex-wrap: wrap + gap: 0 $spacing0 + z-index: 2 + a + @include link($color-accent) + li + margin: 0 + .posts__section, .authors__term, diff --git a/layouts/partials/blocks/templates/posts/highlight.html b/layouts/partials/blocks/templates/posts/highlight.html index 3123ca968d57489b68f0ef3bac8080c8671adc02..a7853ac3230f2986ae2df5733d22c50115833001 100644 --- a/layouts/partials/blocks/templates/posts/highlight.html +++ b/layouts/partials/blocks/templates/posts/highlight.html @@ -15,11 +15,14 @@ <div class="list"> {{ range after 1 . }} {{ with site.GetPage (printf "/posts/%s" .) }} - <article> + <article class="post"> {{- $title := partial "PrepareHTML" .Title -}} <h1 itemprop="headline"><a href="{{ .Permalink }}" title="{{ safeHTML (i18n "commons.more_aria" (dict "Title" $title)) }}">{{ $title }}</a></h1> + {{ if site.Params.posts.list.show_categories }} + {{- partial "posts/categories" . -}} + {{ end }} {{- if (partial "GetTextFromHTML" .Params.description_short) -}} - <p itemprop="articleBody">{{ partial "PrepareHTML" .Params.description_short }}</p> + <p itemprop="articleBody">{{ partial "PrepareHTML" .Params.description_short }}</p> {{- end -}} <time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02T15:04" }}">{{ .Date | time.Format ":date_long" }}</time> </article> diff --git a/layouts/partials/posts/post.html b/layouts/partials/posts/post.html index 6bc09496a78026eff127765dfccb9bbce82d9218..5dd5eaec0058a013500861d87f38c3a4c2a1320b 100644 --- a/layouts/partials/posts/post.html +++ b/layouts/partials/posts/post.html @@ -2,13 +2,14 @@ <div class="post-content"> {{- $title := partial "PrepareHTML" .Title -}} <h1 itemprop="headline"><a href="{{ .Permalink }}" title="{{ safeHTML (i18n "commons.more_aria" (dict "Title" $title)) }}">{{ $title }}</a></h1> + {{ if $.Site.Params.posts.list.show_categories }} + {{- partial "posts/categories" . -}} + {{ end }} {{- if (partial "GetTextFromHTML" .Params.description_short) -}} <p itemprop="articleBody">{{ partial "PrepareHTML" .Params.description_short }}</p> {{- end -}} + <time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02T15:04" }}">{{ .Date | time.Format ":date_long" }}</time> - {{ if $.Site.Params.posts.list.show_categories }} - {{- partial "posts/categories" . -}} - {{ end }} </div> <div class="media"> {{- if .Params.image -}}