mirror of
https://github.com/svemagie/blog-eleventy-indiekit.git
synced 2026-04-02 08:44:56 +02:00
Eliminate monotonous blue by replacing ~290 primary- references in 60 files with semantically appropriate colors: - accent (teal): links, CTAs, buttons, tabs, focus rings, spinners - purple: Funkwhale/music, photos, Mastodon/fediverse - surface (neutral): GitHub, dates/metadata, info boxes - amber: bookmarks, blogroll categories - red: likes - green: reposts - sky: replies - orange: RSS/feeds, podcasts - #0085ff: Bluesky brand - #a730b8: Mastodon brand Also updates prose link colors in tailwind.config.js, pagefind UI primary color to teal, and client-side JS color references. Confab-Link: http://localhost:8080/sessions/bd3f7012-c703-47e9-bfe2-2ad04ce1842d
31 lines
1022 B
Plaintext
31 lines
1022 B
Plaintext
---
|
|
layout: layouts/base.njk
|
|
title: Categories
|
|
withSidebar: true
|
|
permalink: categories/
|
|
eleventyImport:
|
|
collections:
|
|
- categories
|
|
---
|
|
<div>
|
|
<h1 class="text-2xl sm:text-3xl font-bold text-surface-900 dark:text-surface-100 mb-2">Categories</h1>
|
|
<p class="text-surface-600 dark:text-surface-400 mb-6 sm:mb-8">
|
|
Browse posts by category.
|
|
<span class="text-sm">({{ collections.categories.length }} categories)</span>
|
|
</p>
|
|
|
|
{% if collections.categories.length > 0 %}
|
|
<ul class="flex flex-wrap gap-3">
|
|
{% for cat in collections.categories %}
|
|
<li>
|
|
<a href="/categories/{{ cat | slugify }}/" class="inline-block px-4 py-2 bg-surface-100 dark:bg-surface-800 text-surface-900 dark:text-surface-100 rounded-lg hover:bg-accent-100 dark:hover:bg-accent-900 hover:text-accent-700 dark:hover:text-accent-300 transition-colors">
|
|
{{ cat }}
|
|
</a>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% else %}
|
|
<p class="text-surface-600 dark:text-surface-400">No categories yet.</p>
|
|
{% endif %}
|
|
</div>
|