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 */ /* we don't want any gap between this element and the main contents of the site */
padding-bottom: 0; padding-bottom: 0;
padding-top: 4rem;
& + * { & + * {
padding-top: 0; padding-top: 0;

View file

@ -22,13 +22,21 @@
position: absolute; position: absolute;
bottom: 0; bottom: 0;
background-image: linear-gradient( background-image: linear-gradient(
to top, to right,
var(--surface) 30%, var(--surface),
transparent transparent
); );
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: 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 package html
templ Album(images []string, activePage string, pages []string) { templ Album(images []string, activePage string, pages []string) {
@layout("album") { @layout("album") {
<main> <main tabindex="-1">
@albumHeader(activePage, pages) @albumHeader(activePage, pages)
<section> <section>
<div id="album-grid"> <div id="album-grid">

View file

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

View file

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

View file

@ -18,7 +18,7 @@ templ layout(activePage string) {
<script defer src="/album.js"></script> <script defer src="/album.js"></script>
</head> </head>
<body hx-boost="true" hx-ext="preload" preload="mouseover"> <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"> <nav aria-label="Główna nawigacja">
<div> <div>
<a href="/"> <a href="/">
@ -33,9 +33,7 @@ templ layout(activePage string) {
<a class="btn" href="#footer">Kontakt</a> <a class="btn" href="#footer">Kontakt</a>
</div> </div>
</nav> </nav>
<div id="main-content" tabindex="-1">
{ children... } { children... }
</div>
<footer id="footer"> <footer id="footer">
<div> <div>
<div> <div>

View file

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

View file

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

View file

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

View file

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