blog with tags and pagination

This commit is contained in:
madrilene 2024-01-30 18:38:25 +01:00
parent ef2aa9703b
commit 3f55c2173b

View file

@ -1,31 +1,67 @@
--- ---
layout: base layout: base
masonry: true
--- ---
<header class="section spot-color-secondary"> <article class="wrapper">
<div class="section__inner region"> <header class="full | section" style="--spot-color: var(--color-secondary)">
<div class="wrapper flow"> <div
<section class="prose text-center"> class="section__inner flow region"
<h1 class="fade-in">{{ title }}</h1> style="--region-space-top: var(--space-xl-2xl)"
</section> >
<h1 class="text-center text-base-light">{{ title }}</h1>
</div> </div>
</div> {% include 'svg/divider-edgy.svg' %}
</header>
{% include 'svg/divider-edgy.svg' %} <div class="region flow prose" style="--region-space-top: var(--space-xl-2xl)"> {{ content | safe }}</div>
</header>
<article class="wrapper region"> <ul
<ul class="grid mt-l-xl" role="list" data-rows="masonry" data-layout="50-50"> class="blogcards | grid"
{% set postslist = collections.posts %} {% for post in postslist %} role="list"
data-rows="masonry"
<li class="card flow overflow-hidden"> data-layout="50-50"
<h2> >
<a href="{{ post.url | url }}">{{ post.data.title }}</a> <!-- loop posts -->
</h2> {% set itemList = pagination.items %} {% for item in itemList %}
{% set definedDate = post.date %} {% include "partials/date.njk" %} <!-- activate tags -->
<p>{{ post.data.description }}</p> {% set activateTags = true %}
</li> <!-- set date context -->
{% set definedDate = item.date %}
{% endfor %} <!-- set heading context -->
{% set headingContext = "h2" %}
<!-- card -->
{% include 'components/card.njk' %} {% endfor %}
</ul> </ul>
{% if pagination.data.length > pagination.size %}
<section class="region">
<nav role="navigation" aria-labelledby="pagination_label">
<span id="pagination_label" hidden>{{ meta.blog.pagination }}</span>
<span id="prefix" hidden>{{ meta.blog.paginationPage }}</span>
<ol class="pagination | cluster" role="list">
<li>
{% if pagination.href.previous %}
<a href="{{ pagination.href.previous }}"> {{ meta.blog.paginationPrevious }} </a>
{% else %} {{ meta.blog.paginationPrevious }} {% endif %}
</li>
{%- for pageEntry in pagination.pages %}
<li>
<a href="{{ pagination.hrefs[ loop.index0 ] }}" id="link_{{ loop.index }}" aria-labelledby="prefix link_{{ loop.index }}" {% if page.url == pagination.hrefs[ loop.index0 ] %} aria-current="page" {% endif %}>
{{ loop.index }}</a>
</li>
{%- endfor %}
<li>
{% if pagination.href.next %}
<a href="{{ pagination.href.next }}">{{ meta.blog.paginationNext }}</a>
{% else %} {{ meta.blog.paginationNext }} {% endif %}
</li>
</ol>
</nav>
</section>
{% endif %}
</article> </article>