e236b4bf65
- Add skip-to-main-content link and main content ID target - Add prefers-reduced-motion media queries for all animations - Enhance visible focus indicators (2px offset, high-contrast ring) - Replace ~160 text-surface-500 instances with text-surface-600/dark:text-surface-400 for 4.5:1+ contrast ratio compliance - Add aria-hidden="true" to ~30+ decorative SVG icons across sidebars/widgets - Convert facepile containers from div to semantic ul/li with role="list" - Add aria-label to icon-only buttons (share, sort controls) - Add sr-only labels to form inputs (webmention, search) - Add aria-live="polite" to dynamically loaded webmentions - Add aria-label with relative+absolute date to time-difference component - Add keyboard handlers (Enter/Space) to custom interactive elements - Add aria-label to nav landmarks (table of contents) - Fix modal focus trap and dialog accessibility - Fix lightbox keyboard navigation and screen reader announcements Confab-Link: http://localhost:8080/sessions/edb1b7b0-da66-4486-bd9c-d1cfa7553b88
28 lines
1.5 KiB
Plaintext
28 lines
1.5 KiB
Plaintext
{# Empty collection placeholder — encourages creating content #}
|
|
{# Usage: {% include "components/empty-collection.njk" %} with postType set before include #}
|
|
{% set typeInfo = null %}
|
|
{% for pt in enabledPostTypes %}
|
|
{% if pt.type == postType %}{% set typeInfo = pt %}{% endif %}
|
|
{% endfor %}
|
|
|
|
<div class="text-center py-12 px-4">
|
|
<div class="inline-flex items-center justify-center w-16 h-16 rounded-full bg-surface-100 dark:bg-surface-800 mb-4">
|
|
<svg class="w-8 h-8 text-surface-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M12 20h9"/><path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"/>
|
|
</svg>
|
|
</div>
|
|
<h2 class="text-lg font-semibold text-surface-700 dark:text-surface-300 mb-2">No {{ title | lower }} yet</h2>
|
|
<p class="text-surface-600 dark:text-surface-400 mb-6 max-w-md mx-auto">
|
|
This is where your {{ title | lower }} will appear once you start creating content.
|
|
</p>
|
|
{% if typeInfo %}
|
|
<a href="{{ typeInfo.createUrl }}"
|
|
class="inline-flex items-center gap-2 px-4 py-2 rounded-lg bg-accent-600 text-white hover:bg-accent-700 transition-colors text-sm font-medium">
|
|
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="2" stroke-linecap="round">
|
|
<line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/>
|
|
</svg>
|
|
Create your first {{ postType }}
|
|
</a>
|
|
{% endif %}
|
|
</div>
|