favoritter/web/templates/pages/import.html
Ole-Morten Duesund a9d84a4de8 a11y: fix WCAG 2.2 AA and Uutilsynet audit findings
Tag autocomplete combobox pattern (WCAG 2.1.1, 4.1.2, 4.1.3):
- Add role="combobox", aria-expanded, aria-haspopup to tag input
- Implement arrow key navigation (up/down) through suggestions
- Add Space key support alongside Enter for selecting tags
- Manage aria-activedescendant to track highlighted option
- Add Escape to close suggestions
- Add aria-live="polite" status region announcing suggestion count
- Add aria-selected state on options
- Tag suggestions now have stable IDs for activedescendant

Focus visibility (WCAG 2.4.7):
- Remove outline:none on tag suggestions, replace with visible
  2px solid outline on :focus-visible

Contrast (WCAG 1.4.3):
- Replace opacity:0.5 on disabled rows with muted text color
  and strikethrough on username (maintains 4.5:1 ratio)

Structure and semantics (WCAG 1.3.1):
- Fix heading hierarchy H1→H3 skip in import.html (now H2)
- Replace <nav> misuse for fave actions with div[role="group"]
- Add aria-label="Administrasjonsmeny" to admin dashboard nav
- Wrap admin users table in responsive scrollable region
- Remove redundant "Bilde for:" prefix from image alt text
- Make error page H1 descriptive: "Feil 404: Ikke funnet"
- Add .sr-only utility class for screen-reader-only content
- Add hreflang="en" to English-language external link

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-29 17:54:24 +02:00

32 lines
1,008 B
HTML

{{define "content"}}
<h1>Importer favoritter</h1>
<article>
<p>Last opp en JSON- eller CSV-fil med favoritter. Bilder støttes ikke ved import.</p>
<form method="POST" action="{{basePath}}/import" enctype="multipart/form-data">
<input type="hidden" name="csrf_token" value="{{.CSRFToken}}">
<label for="file">
Velg fil (JSON eller CSV)
<input type="file" id="file" name="file" required
accept=".json,.csv,application/json,text/csv">
</label>
<button type="submit">Importer</button>
</form>
<details>
<summary>Forventet format</summary>
<h2>JSON</h2>
<pre><code>[
{
"description": "Blade Runner 2049",
"url": "https://example.com",
"privacy": "public",
"tags": ["film", "sci-fi"]
}
]</code></pre>
<h2>CSV</h2>
<pre><code>description,url,privacy,tags
Blade Runner 2049,https://example.com,public,"film,sci-fi"</code></pre>
</details>
</article>
{{end}}