Retouch all pages and add 'Engaged in Reality'

This commit is contained in:
Bad Manners 2024-11-01 19:44:34 -03:00
parent 1dda4c9af8
commit b03aca87e7
No known key found for this signature in database
GPG key ID: 8C88292CCB075609
37 changed files with 1701 additions and 553 deletions

View file

@ -8,7 +8,6 @@ import {
IconBook,
IconBriefcase,
IconGamepad,
IconHome,
IconMagnifyingGlass,
IconMoon,
IconSun,
@ -41,60 +40,59 @@ const isCurrentRoute = (path: string) =>
class="grid grid-cols-1 flex-col bg-stone-200 text-stone-800 md:grid-cols-[18rem_1fr] md:flex-row dark:bg-stone-800 dark:text-stone-200 print:bg-none"
>
<nav
class="h-card flex shrink-0 flex-col items-center border-b-4 border-bm-400 bg-gradient-to-b from-bm-300 from-95% to-bm-400 pb-10 pr-3 pt-10 text-center text-stone-900 shadow-lg md:min-h-screen md:w-72 md:justify-self-stretch md:border-b-0 md:border-r-4 md:bg-gradient-to-r md:pt-20 dark:border-green-950 dark:from-green-900 dark:to-green-950 dark:text-stone-100 print:bg-none print:shadow-none"
class="h-card flex shrink-0 flex-col items-center border-b-4 border-bm-400 bg-gradient-to-b from-bm-300 from-[calc(100%-2rem)] to-bm-400 pb-10 pr-3 pt-10 text-center text-stone-900 shadow-lg md:min-h-screen md:w-72 md:justify-self-stretch md:border-b-0 md:border-r-4 md:bg-gradient-to-r md:pt-20 dark:border-green-950 dark:from-green-900 dark:to-green-950 dark:text-stone-100 print:bg-none print:shadow-none"
>
<img
loading="eager"
src={logo.src}
alt="A pixelated metal briefcase over a background with a green gradient."
class="u-logo my-4 w-full max-w-[192px] rounded-sm border-2 border-green-800 shadow-md dark:border-green-950"
width={192}
/>
<a
class="u-url"
href="https://badmanners.xyz"
x-data={JSON.stringify({ href: "https://badmanners.xyz", suffix: "?ageVerified=true" })}
x-bind:href="ageVerified ? href + suffix : href"
rel="me"
aria-label="Bad Manners's website"
>
<img
loading="eager"
src={logo.src}
alt="A pixelated metal briefcase over a background with a green gradient."
class="u-logo my-4 w-full max-w-[192px] rounded-sm border-2 border-green-800 shadow-md dark:border-green-950"
width={192}
/>
</a>
<span class="p-name mb-6 mt-4 text-3xl font-semibold">Bad Manners</span>
<ul class="flex w-[80%] max-w-sm flex-col gap-y-2 px-2 text-left">
<li>
<a class="u-url text-link group" href="https://badmanners.xyz/" data-age-restricted rel="me">
<IconHome width="1.25rem" height="1.25rem" class="order-1 inline align-text-top" />
<span class="order-3 group-hover:underline group-focus:underline">Main website</span>
</a>
</li>
<li>
<a class="u-url text-link group" href="/" aria-current={isCurrentRoute("/") ? "page" : undefined}>
<a class="text-link group" href="/" aria-current={isCurrentRoute("/") ? "page" : undefined}>
<IconBriefcase width="1.25rem" height="1.25rem" class="order-1 inline align-text-top" />
<span class="order-3 group-hover:underline group-focus:underline">Gallery</span>
</a>
</li>
<li>
<a
class="u-url text-link group"
href="/stories"
aria-current={isCurrentRoute("/stories") ? "page" : undefined}
>
<a class="text-link group" href="/stories" aria-current={isCurrentRoute("/stories") ? "page" : undefined}>
<IconBook width="1.25rem" height="1.25rem" class="order-1 inline align-text-top" />
<span class="order-3 group-hover:underline group-focus:underline">Stories</span>
</a>
</li>
<li>
<a class="u-url text-link group" href="/games" aria-current={isCurrentRoute("/games") ? "page" : undefined}>
<a class="text-link group" href="/games" aria-current={isCurrentRoute("/games") ? "page" : undefined}>
<IconGamepad width="1.25rem" height="1.25rem" class="order-1 inline align-text-top" />
<span class="order-3 group-hover:underline group-focus:underline">Games</span>
</a>
</li>
<li>
<a class="u-url text-link group" href="/blog" aria-current={isCurrentRoute("/blog") ? "page" : undefined}>
<a class="text-link group" href="/blog" aria-current={isCurrentRoute("/blog") ? "page" : undefined}>
<IconBlog width="1.25rem" height="1.25rem" class="order-1 inline align-text-top" />
<span class="order-3 group-hover:underline group-focus:underline">Blog</span>
</a>
</li>
<li>
<a class="u-url text-link group" href="/tags" aria-current={isCurrentRoute("/tags") ? "page" : undefined}>
<a class="text-link group" href="/tags" aria-current={isCurrentRoute("/tags") ? "page" : undefined}>
<IconTags width="1.25rem" height="1.25rem" class="order-1 inline align-text-top" />
<span class="order-3 group-hover:underline group-focus:underline">Tags</span>
</a>
</li>
<li>
<a
class="u-url text-link group"
class="text-link group"
href="/search"
rel="search"
aria-current={isCurrentRoute("/search") ? "page" : undefined}
@ -120,7 +118,7 @@ const isCurrentRoute = (path: string) =>
</button>
</li>
</ul>
<div class="py-6 text-center text-xs text-black dark:text-white">
<footer class="py-6 text-center text-xs text-black dark:text-white">
<span
>&copy; {
currentYear === "2024" ? (
@ -133,10 +131,10 @@ const isCurrentRoute = (path: string) =>
} |
</span>
<a class="text-link hover:underline focus:underline" href="/licenses.toml" rel="license">Licenses</a>
</div>
</footer>
</nav>
<main
class:list={[className, "ml-0 w-full max-w-6xl px-2 pb-28 pt-4 md:px-8 print:pb-0"]}
class:list={[className, "ml-0 w-full max-w-6xl px-2 pb-28 pt-4 md:pl-12 md:pr-8 print:pb-0"]}
data-pagefind-body={enablePagefind ? "" : undefined}
>
<slot />