Rename content slot to main, remove h1 from header for better
Some checks failed
Build And Deploy / build-and-deploy (push) Has been cancelled

accessibility, and unify SVG fill color to #fff

Update BaseLayout to use a header <p> for the website title, rename the
main slot/id to
"main", and update all pages to match. Add CSS rule svg { fill:
currentColor }
and size header > p the same as h1. Fix a minor comment typo.
This commit is contained in:
badblocks 2026-03-22 13:56:24 -07:00
parent 75a413621d
commit da4925753d
Signed by: badblocks
SSH key fingerprint: SHA256:hEcM6BP4hKm9F7WsomNuXSBpPn2BSDnFzPSl3y1NerQ
8 changed files with 22 additions and 21 deletions

View file

@ -18,8 +18,8 @@
</head>
<body>
<iframe hidden="" name="htmz" onload="window.htmz(this)"></iframe>
<header>
<h1>badblocks.dev</h1>
<header id="header">
<p>badblocks.dev</p>
<nav>
<ul>
<li><a href="/">Home</a></li>
@ -28,12 +28,12 @@
</ul>
</nav>
</header>
<main id="content">
<slot name="content" />
<main id="main">
<slot name="main" />
</main>
<footer>
<p>
<a href="https://opensource.org/license/mit" target="_blank">
<a href="/license">
<img src="/mit.svg" title="MIT Licensed" alt="MIT License Logo" width="24" height="24" role="img">
</a>
<br>

View file

@ -29,7 +29,7 @@ import Layout from "@layouts/BaseLayout.astro";
justify-self: center;
}
</style>
<Fragment slot="content">
<Fragment slot="main">
<h1>Lorem Ipsum</h1>
<p>
"Neque porro quisquam est qui dolorem ipsum quia dolor sit amet,

View file

@ -146,7 +146,7 @@ const msgValue = pickValue("msg");
}
</style>
</Fragment>
<Fragment slot="content">
<Fragment slot="main">
<h2>Contact</h2>
{
(nextAction != "complete" && (

View file

@ -4,7 +4,7 @@ import Layout from "@layouts/BaseLayout.astro";
<Layout>
<title slot="head">Home</title>
<Fragment slot="content">
<Fragment slot="main">
<article id="hero">
<h2>Under Construction</h2>
<p>Pardon the dust!</p>

View file

@ -130,7 +130,7 @@ import Layout from "@layouts/BaseLayout.astro";
}
}
</style>
<Fragment slot="content">
<Fragment slot="main">
<article id="hero" x-data="{ theme: 'winternight'}">
<div class="parallax-container" :class="'parallax-theme-' + theme">
<div class="layer layer-0"></div>

View file

@ -13,7 +13,7 @@ import Layout from "@layouts/BaseLayout.astro";
margin: 2rem auto 0;
}
</style>
<Fragment slot="content">
<Fragment slot="main">
<section class="tools" id="tools">
<h2>Tools</h2>
<div class="tools-grid">