svemagie.net/indiekit-server
1
0
Fork 0
Code Issues 1 Actions Packages Projects Releases Activity

feat: inline card template in /posts to show tags inside cards

Browse Source 
Non-garden tags shown as small chips in the card body (above footer).
The 'garden' tag shown in the card footer on the right side of the
publish-state badge, using margin-left:auto.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Sven
2026-03-15 12:14:32 +01:00
parent 65f94da71c
commit 4af7c49c6a
1 changed files with 50 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scripts/patch-endpoint-posts-search-tags.mjs
+50 -9
View File
@@ -153,15 +153,56 @@ const newView = `{% extends "document.njk" %}
<ol class="card-grid" role="list" style="--min-card-size: 16rem">
{%- for item in posts %}
<li class="card-grid__item">
{{ card(item) | indent(4) }}
{%- if item.tagLinks and item.tagLinks.length > 0 %}
<dl class="prose--caption" style="padding:0 1rem 0.75rem">
<dt class="-!-visually-hidden">Tags</dt>
{%- for tagLink in item.tagLinks %}
<dd class="tag"><a href="{{ tagLink.href }}">{{ tagLink.text }}</a></dd>
{%- endfor %}
</dl>
{%- endif %}
<article class="card">
{%- if item.photo %}
<div class="card__photo">
<img src="{{ item.photo.url | imageUrl(application, width=240, height=240) }}" alt="{{ item.photo.alt }}" width="240" height="240" decoding="async" loading="lazy" onerror="this.src='/assets/not-found.svg'">
</div>
{%- endif %}
<div class="card__body">
{%- if item.title %}
<h2 class="card__title">
{%- if item.url %}
<a href="{{ item.url }}" rel="bookmark">
{%- endif %}
{{- icon(item.icon) if item.icon -}}
{{- item.title | safe -}}
{%- if item.url %}
</a>
{%- endif %}
</h2>
{%- endif %}
{{ prose({ classes: "card__meta", text: item.description.text, html: item.description.html }) | indent(10) if item.description }}
{%- set hasNonGarden = false %}
{%- for tl in item.tagLinks %}
{%- if tl.text != "garden" %}{%- set hasNonGarden = true %}{%- endif %}
{%- endfor %}
{%- if hasNonGarden %}
<div style="padding:0.25rem 0 0.5rem;display:flex;flex-wrap:wrap;gap:0.25rem">
{%- for tl in item.tagLinks %}
{%- if tl.text != "garden" %}
<a href="{{ tl.href }}" class="tag" style="font-size:0.75em">{{ tl.text }}</a>
{%- endif %}
{%- endfor %}
</div>
{%- endif %}
{%- if item.published or item.badges %}
<footer class="card__footer" style="display:flex;align-items:center;gap:0.5rem">
{%- for badgeItem in item.badges %}
{{ badge(badgeItem) | indent(12) if badgeItem }}
{%- endfor %}
{%- for tl in item.tagLinks %}
{%- if tl.text == "garden" %}
<a href="{{ tl.href }}" class="tag" style="margin-left:auto;font-size:0.75em;flex-shrink:0">garden</a>
{%- endif %}
{%- endfor %}
<time datetime="{{ item.published }}">
{{ item.published | date("PPp", { locale: item.locale, timeZone: application.timeZone }) }}
</time>
</footer>
{%- endif %}
</div>
</article>
</li>
{%- endfor %}
</ol>