63 lines
2 KiB
Text
63 lines
2 KiB
Text
|
---
|
||
|
|
layout: layouts/base.njk
|
||
|
|
permalink: "/archive/"
|
||
|
|
title: Archive
|
||
|
|
---
|
||
|
|
<h1 class="text-2xl font-bold mb-6">Archive</h1>
|
||
|
|
|
||
|
|
<div class="prose prose-lg dark:prose-invert max-w-none mb-8">
|
||
|
|
<p>A chronological archive of all posts, organized by year and month.</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{% set postsByYear = collections.posts | groupby("date.getFullYear()") %}
|
||
|
|
{% for year, posts in postsByYear %}
|
||
|
|
<section class="mb-8">
|
||
|
|
<h2 class="text-xl font-semibold mb-4 border-b border-gray-200 dark:border-gray-700 pb-2">{{ year }}</h2>
|
||
|
|
|
||
|
|
{% set postsByMonth = posts | groupby("date.getMonth()") %}
|
||
|
|
{% for month, monthPosts in postsByMonth %}
|
||
|
|
<div class="mb-6">
|
||
|
|
<h3 class="text-lg font-medium mb-3 text-gray-700 dark:text-gray-300">
|
||
|
|
{{ monthPosts[0].date | readableDate("MMMM") }}
|
||
|
|
</h3>
|
||
|
|
|
||
|
|
<div class="space-y-2">
|
||
|
|
{% for post in monthPosts %}
|
||
|
|
<article class="flex items-start gap-4 py-2">
|
||
|
|
<time class="text-sm text-gray-500 dark:text-gray-400 font-mono min-w-[4rem]">
|
||
|
|
{{ post.date | readableDate("MMM dd") }}
|
||
|
|
</time>
|
||
|
|
<div class="flex-1">
|
||
|
|
<h4 class="font-medium">
|
||
|
|
<a href="{{ post.url }}" class="hover:text-blue-600 dark:hover:text-blue-400">
|
||
|
|
{{ post.data.title }}
|
||
|
|
</a>
|
||
|
|
</h4>
|
||
|
|
{% if post.data.description %}
|
||
|
|
<p class="text-sm text-gray-600 dark:text-gray-400 mt-1">{{ post.data.description }}</p>
|
||
|
|
{% endif %}
|
||
|
|
{% if post.data.tags %}
|
||
|
|
<div class="flex flex-wrap gap-1 mt-2">
|
||
|
|
{% for tag in post.data.tags %}
|
||
|
|
<span class="inline-block px-2 py-1 text-xs rounded-full text-white"
|
||
|
|
style="background-color: {{ tag | tagColor }}">
|
||
|
|
{{ tag }}
|
||
|
|
</span>
|
||
|
|
{% endfor %}
|
||
|
|
</div>
|
||
|
|
{% endif %}
|
||
|
|
</div>
|
||
|
|
</article>
|
||
|
|
{% endfor %}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{% endfor %}
|
||
|
|
</section>
|
||
|
|
{% endfor %}
|
||
|
|
|
||
|
|
{% if collections.posts.length == 0 %}
|
||
|
|
<div class="text-center py-12">
|
||
|
|
<p class="text-gray-500 dark:text-gray-400">No posts found.</p>
|
||
|
|
</div>
|
||
|
|
{% endif %}
|