From 3e63a7086d1470dda3c2a0117ff035d5c421ef60 Mon Sep 17 00:00:00 2001
From: ulsklyc <ulas@kalayci.cloud>
Date: Thu, 26 Mar 2026 12:30:29 +0100
Subject: [PATCH] a11y: add h1 headings to all pages (Redesign Phase B)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Every page now has exactly one <h1> per spec §2.3.
Six pages use sr-only <h1>; notes uses visible <h1> in toolbar.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 public/pages/budget.js    | 1 +
 public/pages/calendar.js  | 1 +
 public/pages/contacts.js  | 1 +
 public/pages/dashboard.js | 1 +
 public/pages/meals.js     | 1 +
 public/pages/notes.js     | 2 +-
 public/pages/shopping.js  | 1 +
 7 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/public/pages/budget.js b/public/pages/budget.js
index b63b8e1..8f6619c 100644
--- a/public/pages/budget.js
+++ b/public/pages/budget.js
@@ -83,6 +83,7 @@ export async function render(container, { user }) {
 
   container.innerHTML = `
     <div class="budget-page">
+      <h1 class="sr-only">Budget</h1>
       <div class="budget-nav">
         <button class="btn btn--icon" id="budget-prev" aria-label="Vorheriger Monat">
           <i data-lucide="chevron-left"></i>
diff --git a/public/pages/calendar.js b/public/pages/calendar.js
index 7147ade..c4594f2 100644
--- a/public/pages/calendar.js
+++ b/public/pages/calendar.js
@@ -184,6 +184,7 @@ function renderToolbar() {
   if (!bar) return;
 
   bar.innerHTML = `
+    <h1 class="sr-only">Kalender</h1>
     <div class="cal-toolbar__nav">
       <button class="btn btn--icon" id="cal-prev" aria-label="Zurück">
         <i data-lucide="chevron-left"></i>
diff --git a/public/pages/contacts.js b/public/pages/contacts.js
index 628e2cd..ccb74d5 100644
--- a/public/pages/contacts.js
+++ b/public/pages/contacts.js
@@ -43,6 +43,7 @@ export async function render(container, { user }) {
   _container = container;
   container.innerHTML = `
     <div class="contacts-page">
+      <h1 class="sr-only">Kontakte</h1>
       <div class="contacts-toolbar">
         <div class="contacts-toolbar__search">
           <i data-lucide="search" class="contacts-toolbar__search-icon"></i>
diff --git a/public/pages/dashboard.js b/public/pages/dashboard.js
index 3e1d1d5..c8e0977 100644
--- a/public/pages/dashboard.js
+++ b/public/pages/dashboard.js
@@ -438,6 +438,7 @@ export async function render(container, { user }) {
 
   container.innerHTML = `
     <div class="dashboard">
+      <h1 class="sr-only">Übersicht</h1>
       <div class="dashboard__grid">
         ${renderGreeting(user, stats)}
         ${renderWeatherWidget(weather)}
diff --git a/public/pages/meals.js b/public/pages/meals.js
index 15fc6b7..4fbbfc3 100644
--- a/public/pages/meals.js
+++ b/public/pages/meals.js
@@ -104,6 +104,7 @@ export async function render(container, { user }) {
   _container = container;
   container.innerHTML = `
     <div class="meals-page">
+      <h1 class="sr-only">Essensplan</h1>
       <div class="week-nav">
         <button class="btn btn--icon" id="week-prev" aria-label="Vorherige Woche">
           <i data-lucide="chevron-left"></i>
diff --git a/public/pages/notes.js b/public/pages/notes.js
index 109178f..695cc27 100644
--- a/public/pages/notes.js
+++ b/public/pages/notes.js
@@ -47,7 +47,7 @@ export async function render(container, { user }) {
   container.innerHTML = `
     <div class="notes-page">
       <div class="notes-toolbar">
-        <span class="notes-toolbar__title">Pinnwand</span>
+        <h1 class="notes-toolbar__title">Pinnwand</h1>
         <button class="btn btn--primary" id="notes-add-btn">
           <i data-lucide="plus" style="width:16px;height:16px;margin-right:4px;"></i>
           Neue Notiz
diff --git a/public/pages/shopping.js b/public/pages/shopping.js
index ae405ba..6fb7694 100644
--- a/public/pages/shopping.js
+++ b/public/pages/shopping.js
@@ -553,6 +553,7 @@ export async function render(container, { user }) {
 
   container.innerHTML = `
     <div class="shopping-page">
+      <h1 class="sr-only">Einkaufslisten</h1>
       <div class="list-tabs-bar" id="list-tabs-bar"></div>
       <div id="list-content" style="flex:1;display:flex;flex-direction:column;overflow:hidden"></div>
       <button class="page-fab" id="fab-new-item" aria-label="Artikel hinzufügen">