soapbox/soapbox/themes/green/templates/index.html
Ole-Morten Duesund ae3d6a4c0c UX, tilgjengelighet og design etter gjennomgang
WCAG:
- Mørk modus: --on-accent-token gir mørk tekst på lys aksent (knapper,
  badges, valgt fane, skip-lenke) – var 1.8:1, nå ~11:1.
- Editor-feltet har label og aria-describedby; forhåndsvisningen er
  ikke lenger aria-live (leste opp hele innlegget for hvert tastetrykk).
- Bilder settes inn med alt-plassholder markert for overskriving, som
  eget avsnitt etter gjeldende linje.
- Berøringsmål ≥ 44px (nav, verktøylinje, lenkeknapper, select).
- Faner: roving tabindex + piltaster. Knapper med tekst i stedet for
  emoji, aria-keyshortcuts på fet/kursiv. h1 på forsiden.
- code bryter lange stier (innstillinger rullet horisontalt på mobil).

UX:
- Ulagret-vakt dekker også tittelen, med synlig «Ulagrede endringer».
- 413 ved for stor fil gir lesbar melding; brukernavn beholdes ved
  feil innlogging; full publiserings-URL vises i editoren; historikk-
  lenke i meta-linjen; norsk datoformat i historikken; passord-hint.

Design:
- Header med favicon, større brødtekst/overskrifter, smalere måltekst,
  bedre avstander i innlegg og liste, footer som flex uten løse «·»,
  nøytral sekundærknapp, innrammet faresone, editor-textarea fyller
  panelet, valgt fane henger sammen med panelet.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01JcEy43fNYpwg6K6oTKakWR
2026-08-26 14:12:18 +02:00

15 lines
673 B
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{% extends "base.html" %}
{% block title %}{% if heading %}{{ heading }} {% endif %}{{ site.title }}{% endblock %}
{% block content %}
{% if heading %}<h1>{{ heading }}</h1>{% else %}<h1 class="visually-hidden">Siste innlegg</h1>{% endif %}
{% if not posts %}<p>Ingen innlegg ennå.</p>{% endif %}
{% for post in posts %}
<article class="summary">
<h2><a href="{{ rel(post.url_path) }}">{{ post.title }}</a></h2>
<p class="meta">
<time datetime="{{ post.date.isoformat() }}">{{ post.date|date }}</time>
{% if post.guest %} · <a href="{{ rel(post.guest ~ '/') }}">{{ post.author or post.guest }}</a>{% endif %}
</p>
</article>
{% endfor %}
{% endblock %}