guz013/keikos.work
1
0
Fork 0
Code Issues Pull Requests Activity

feat(a11y): add explicit aria label values

Browse Source
This commit is contained in:
Guz
2024-12-17 10:51:22 -03:00
parent 19134d370b
commit ffc803cd29
1 changed files with 20 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
handlers/pages/home.templ
View File

@@ -24,8 +24,13 @@ templ (p *Home) page() {
@layouts.Page(layouts.PageInfo{
BodyClasses: "scroll-smooth snap-normal snap-y snap-mandatory",
}) {
<header class="fixed w-100% h-screen md:flex justify-center items-center overflow-x-hidden">
<header
class="fixed w-100% h-screen md:flex justify-center items-center overflow-x-hidden"
id="header"
aria-labelledby="header-title"
>
<h1
id="header-title"
class={ "absolute z-3 top-0 left-0 text-stroke-1px text-stroke-white text-transparent text-9xl m-0 mt-4 vertical-lr",
"md:relative md:m-0 md:horizontal-tb md:w-fit" }
>
@@ -47,11 +52,16 @@ templ (p *Home) page() {
class="relative w-100% h-screen bg-gradient-to-t from-black to-transparent to-50% pointer-events-none snap-center"
aria-hidden="true"
></div>
<main class="relative bg-black w-full h-screen md:flex justify-center items-center overflow-x-hidden snap-center">
<main
class="relative bg-black w-full h-screen md:flex justify-center items-center overflow-x-hidden snap-center"
id="socials"
aria-labelledby="socials-title"
>
<div class="relative w-full h-full flex flex-col justify-between md:w-fit md:h-fit">
<h2
class={ "relative z-4 m-0 pt-4 text-9xl vertical-lr text-stroke-1px text-stroke-white text-transparent",
"md:horizontal-tb md:text-center" }
id="socials-title"
>
Socials
</h2>
@@ -141,11 +151,16 @@ templ (p *Home) page() {
aria-hidden="hidden"
></span>
</main>
<section class="relative py-20 bg-heropattern bg-black bg-top w-full h-screen flex justify-between overflow-x-hidden snap-center">
<section
class="relative py-20 bg-heropattern bg-black bg-top w-full h-screen flex justify-between overflow-x-hidden snap-center"
id="worldbuilding"
aria-labelledby="worldbuilding-title"
>
<div class="relative w-full h-full flex md:flex-col justify-between md:justify-center md:items-center md:w-fit md:h-fit">
<h2
class={ "relative z-4 m-0 pt-4 text-8xl vertical-lr text-stroke-1px text-stroke-white text-transparent max-h-80%",
"md:horizontal-tb md:text-center" }
id="worldbuilding-title"
>
Worldbuilding
</h2>
@@ -177,6 +192,8 @@ templ (p *Home) page() {
<footer
class={ "relative w-full h-screen bg-heropattern bg-black bg-top overflow-x-hidden snap-center",
"md:flex justify-center items-center" }
id="footer"
aria-label="contact"
>
<div class={ "relative z-3 md:flex flex-col items-end" }>
<div class="hidden md:block" aria-label="Signature">