ux improvements: contrast, readability, accessibility, keyboard nav

This commit is contained in:
bronku 2026-06-10 19:44:28 +02:00
parent cd3be4eba7
commit 13b5e6d1a9
6 changed files with 96 additions and 16 deletions

View file

@ -18,7 +18,8 @@ templ layout(activePage string) {
<script defer src="/album.js"></script>
</head>
<body hx-boost="true" hx-ext="preload" preload="mouseover">
<nav>
<a href="#main-content" class="sr-only">Przejdź do treści</a>
<nav aria-label="Główna nawigacja">
<div>
<a href="/">
<img src="/images/logo.svg" alt="logo"/>
@ -32,11 +33,13 @@ templ layout(activePage string) {
<a class="btn" href="#footer">Kontakt</a>
</div>
</nav>
{ children... }
<div id="main-content" tabindex="-1">
{ children... }
</div>
<footer id="footer">
<div>
<div>
<img src="/images/logo.svg" alt="logo" style="width: 14rem"/>
<img src="/images/logo.svg" alt="" style="width: 14rem"/>
<p>Pasja, natura i domowy smak w każdym kawałku ciasta.</p>
</div>
</div>
@ -186,6 +189,9 @@ templ Link(activePage, targetPage, title string) {
href={ fmt.Sprint("/", targetPage, "/") }
}
}
if activePage == targetPage {
aria-current="page"
}
>{ title }</a>
}
@ -198,6 +204,9 @@ templ GreenLink(activePage, targetPage, title string) {
href={ fmt.Sprint("/", targetPage, "/") }
}
}
if activePage == targetPage {
aria-current="page"
}
class="btn-green"
>{ title }</a>
}
@ -206,7 +215,7 @@ templ subnavHeader(title, description string) {
<header class="subnav">
<h1>{ title }</h1>
<p>{ description }</p>
<nav>
<nav aria-label="Kategorie">
{ children... }
</nav>
</header>