Complete basic post styling

This commit is contained in:
Yannik Rödel 2022-03-21 16:45:02 +01:00
parent 8293cfac75
commit 1b355c8696
2 changed files with 38 additions and 45 deletions

View file

@ -1,23 +1,10 @@
---
layout: layouts/base.njk
templateClass: tmpl-post
---
<h1>{{ title }}</h1>
<time datetime="{{ page.date | htmlDateString }}">{{ page.date | readableDate }}</time>
{%- for tag in tags | filterTagList -%}
{%- set tagUrl %}/tags/{{ tag | slug }}/{% endset -%}
<a href="{{ tagUrl | url }}" class="post-tag">{{ tag }}</a>
{%- endfor %}
<p class="post-metadata">
<time datetime="{{ page.date | htmlDateString }}">{{ page.date | readableDate }}</time>
</p>
{{ content | safe }}
{%- set nextPost = collections.posts | getNextCollectionItem(page) %}
{%- set previousPost = collections.posts | getPreviousCollectionItem(page) %}
{%- if nextPost or previousPost %}
<hr>
<ul>
{%- if nextPost %}<li>Next: <a href="{{ nextPost.url | url }}">{{ nextPost.data.title }}</a></li>{% endif %}
{%- if previousPost %}<li>Previous: <a href="{{ previousPost.url | url }}">{{ previousPost.data.title }}</a></li>{% endif %}
</ul>
{%- endif %}

View file

@ -167,7 +167,8 @@ ul.link-grid {
padding-left: layout.$normal-gap;
padding-right: layout.$normal-gap;
text-decoration: none;
transition: background-color motion.$subtle, color motion.$subtle, box-shadow motion.$subtle;
transition: background-color motion.$subtle, color motion.$subtle,
box-shadow motion.$subtle;
&:hover {
@include colors.card-shadow;
@ -192,3 +193,8 @@ ul.link-grid {
color: colors.$gray-600;
}
}
.post-metadata {
text-align: center;
color: colors.$blue-800;
}