accessibility tweaks

This commit is contained in:
bronku 2026-06-10 20:17:29 +02:00
parent 13b5e6d1a9
commit 9ec025b24c
10 changed files with 20 additions and 13 deletions

View file

@ -126,6 +126,7 @@
/* we don't want any gap between this element and the main contents of the site */
padding-bottom: 0;
padding-top: 4rem;
& + * {
padding-top: 0;

View file

@ -22,13 +22,21 @@
position: absolute;
bottom: 0;
background-image: linear-gradient(
to top,
var(--surface) 30%,
to right,
var(--surface),
transparent
);
width: 100%;
height: 100%;
z-index: 100;
@media (max-width: 768px) {
background-image: linear-gradient(
to top,
var(--surface) 30%,
transparent
);
}
}
}

View file

@ -1,7 +1,7 @@
package html
templ Album(images []string, activePage string, pages []string) {
@layout("album") {
<main>
<main tabindex="-1">
@albumHeader(activePage, pages)
<section>
<div id="album-grid">

View file

@ -2,7 +2,7 @@ package html
templ Index() {
@layout("index") {
<main id="index">
<main id="index" tabindex="-1">
<header>
<div>
<h1>Słodkości tworzone z <span>pasją</span></h1>

View file

@ -2,7 +2,7 @@ package html
templ Kawiarnia() {
@layout("kawiarnia") {
<main>
<main tabindex="-1">
<header id="kawiarnia-header">
<div>
<span>Miejsce spotkań</span>

View file

@ -18,7 +18,7 @@ templ layout(activePage string) {
<script defer src="/album.js"></script>
</head>
<body hx-boost="true" hx-ext="preload" preload="mouseover">
<a href="#main-content" class="sr-only">Przejdź do treści</a>
<a href="#" onclick="document.querySelector('main').focus();return false" class="sr-only">Przejdź do treści</a>
<nav aria-label="Główna nawigacja">
<div>
<a href="/">
@ -33,9 +33,7 @@ templ layout(activePage string) {
<a class="btn" href="#footer">Kontakt</a>
</div>
</nav>
<div id="main-content" tabindex="-1">
{ children... }
</div>
{ children... }
<footer id="footer">
<div>
<div>

View file

@ -17,7 +17,7 @@ templ card(product types.Product) {
templ Wyroby(products []types.Product, page string) {
@layout("wyroby") {
<main>
<main tabindex="-1">
@wyrobyHeader(page)
<div id="wyroby">
for _, product:= range products {

View file

@ -2,7 +2,7 @@ package html
templ WyrobyLody() {
@layout("wyroby") {
<main id="lody">
<main id="lody" tabindex="-1">
@wyrobyHeader("wyroby/lody")
<section>
<p>

View file

@ -2,7 +2,7 @@ package html
templ WyrobySlodkieStoly() {
@layout("wyroby") {
<main id="slodkie_stoly">
<main id="slodkie_stoly" tabindex="-1">
@wyrobyHeader("wyroby/slodkie_stoly")
<section id="cennik">
<p>

View file

@ -2,7 +2,7 @@ package html
templ WyrobyTorty() {
@layout("wyroby") {
<main id="wyroby-torty">
<main id="wyroby-torty" tabindex="-1">
@wyrobyHeader("wyroby/torty")
<section id="rodzaje-tortow">
<div class="card-low">