badmanners/badmanners.xyz
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

More websites, better licenses with TOML, more minute improvements

Browse source
This commit is contained in:
Bad Manners 2024-08-26 00:16:48 -03:00
parent 5559cea720
commit 92123a305d
26 changed files with 414 additions and 138 deletions
Download patch file Download diff file Expand all files Collapse all files

174
src/pages/index.astro
View file

@ -1,43 +1,44 @@
---
import BaseLayout from "../layouts/BaseLayout.astro";
import IconEnvelope from "../components/icons/IconEnvelope.astro";
import IconBriefcase from "../components/icons/IconBriefcase.astro";
import IconBluesky from "../components/icons/brands/IconBluesky.astro";
import IconCodeberg from "../components/icons/brands/IconCodeberg.astro";
import IconCohost from "../components/icons/brands/IconCohost.astro";
import IconDiscord from "../components/icons/brands/IconDiscord.astro";
import IconEkasPortal from "../components/icons/brands/IconEkasPortal.astro";
import IconFurAffinity from "../components/icons/brands/IconFurAffinity.astro";
import IconGitHub from "../components/icons/brands/IconGitHub.astro";
import IconGitLab from "../components/icons/brands/IconGitLab.astro";
import IconGoogle from "../components/icons/brands/IconGoogle.astro";
import IconInkbunny from "../components/icons/brands/IconInkbunny.astro";
import IconItaku from "../components/icons/brands/IconItaku.astro";
import IconItchIO from "../components/icons/brands/IconItchIO.astro";
import IconKeybase from "../components/icons/brands/IconKeybase.astro";
import IconKeyoxide from "../components/icons/brands/IconKeyoxide.astro";
import IconKofi from "../components/icons/brands/IconKofi.astro";
import IconMastodon from "../components/icons/brands/IconMastodon.astro";
import IconNeocities from "../components/icons/brands/IconNeocities.astro";
import IconPicarto from "../components/icons/brands/IconPicarto.astro";
import IconReddit from "../components/icons/brands/IconReddit.astro";
import IconSignal from "../components/icons/brands/IconSignal.astro";
import IconSoFurry from "../components/icons/brands/IconSoFurry.astro";
import IconSSH from "../components/icons/IconSSH.astro";
import IconSteam from "../components/icons/brands/IconSteam.astro";
import IconSubscribeStar from "../components/icons/brands/IconSubscribeStar.astro";
import IconTelegram from "../components/icons/brands/IconTelegram.astro";
import IconTwitch from "../components/icons/brands/IconTwitch.astro";
import IconWeasyl from "../components/icons/brands/IconWeasyl.astro";
import IconX from "../components/icons/brands/IconX.astro";
import IconYouTube from "../components/icons/brands/IconYouTube.astro";
import { IconEnvelope, IconBriefcase, IconLink, IconCommentDots, IconSSH } from "../components/icons";
import {
IconBluesky,
IconCodeberg,
IconCohost,
IconDiscord,
IconEkasPortal,
IconFurAffinity,
IconGithub,
IconGitlab,
IconGoogle,
IconInkbunny,
IconItaku,
IconItchIO,
IconKeybase,
IconKeyoxide,
IconKofi,
IconMastodon,
IconNeocities,
IconPicarto,
IconReddit,
IconSignal,
IconSoFurry,
IconSteam,
IconSubscribeStar,
IconTelegram,
IconTumblr,
IconTwitch,
IconWeasyl,
IconX,
IconYouTube,
} from "../components/icons/brands";
---
<BaseLayout>
<meta
slot="head-description"
property="og:description"
content="Safe vore enthusiast, mimic hybrid, and occasional writer."
content="Safe vore enthusiast, mimic hybrid furry, and occasional writer."
/>
<article class="h-card" aria-label="Homepage of Bad Manners">
<h1 id="title-home" class="pb-4 text-3xl tracking-tight sm:text-5xl">
@ -47,42 +48,35 @@ import IconYouTube from "../components/icons/brands/IconYouTube.astro";
<img
loading="eager"
src="/logo.webp"
alt="Logo for Bad Manners"
alt="A pixelated metal briefcase over a background with a green gradient."
class="u-logo mx-auto my-4 h-screen max-h-48 rounded-full transition-transform hover:scale-110 motion-reduce:transition-none motion-reduce:hover:scale-100 sm:max-h-72"
/>
<p class="p-note mt-6 sm:px-5 md:px-6">
I'm a safe vore enthusiast, a furry programmer, and occasionally a writer.
</p>
{
Astro.site ? (
<a id="website" href={Astro.site} class="u-url sr-only" aria-label="Permalink">
{Astro.site}
</a>
) : null
}
<p class="p-note mt-6 sm:px-5 md:px-6">I'm a safe vore enthusiast, a furry, and occasional writer.</p>
<ul
id="links"
class="grid grid-cols-3 gap-x-4 gap-y-5 px-4 pt-8 sm:grid-cols-4 sm:px-20 md:px-32"
aria-label="Links"
>
<li>
<a
id="e-mail"
class="u-email text-link group block w-full transition-colors motion-reduce:transition-none"
href="mailto:me@badmanners.xyz"
rel="me"
aria-label="me@badmanners.xyz"
data-clipboard="me@badmanners.xyz"
data-noun="E-mail address"
>
<IconEnvelope
height="1.75rem"
width="1.75rem"
class="inline transition-transform group-hover:scale-150 group-focus:scale-150 motion-reduce:transition-none motion-reduce:group-hover:scale-100 motion-reduce:group-focus:scale-100"
/>
<p class="sr-only">E-mail address</p>
</a>
</li>
{
Astro.site ? (
<li>
<a
id="permalink"
class="u-url text-link group block w-full transition-colors motion-reduce:transition-none"
href={Astro.site}
aria-label="Permalink"
data-clipboard={Astro.site}
data-noun="URL"
>
<IconLink
height="1.75rem"
width="1.75rem"
class="inline transition-transform group-hover:scale-150 group-focus:scale-150 motion-reduce:transition-none motion-reduce:group-hover:scale-100 motion-reduce:group-focus:scale-100"
/>
</a>
</li>
) : null
}
<li>
<a
id="gallery"
@ -99,6 +93,42 @@ import IconYouTube from "../components/icons/brands/IconYouTube.astro";
/>
</a>
</li>
<li>
<a
id="pronouns"
class="u-url text-link group block w-full transition-colors motion-reduce:transition-none"
href="https://pronouns.cc/@BadManners"
rel="me"
aria-label="Pronouns"
>
<IconCommentDots
height="1.75rem"
width="1.75rem"
class="inline transition-transform group-hover:scale-150 group-focus:scale-150 motion-reduce:transition-none motion-reduce:group-hover:scale-100 motion-reduce:group-focus:scale-100"
/>
<p class="p-nickname sr-only">@BadManners on pronouns.cc</p>
<p class="p-pronoun sr-only">he/him/his/his/himself</p>
<p class="p-pronoun sr-only">they/them/their/theirs/themself</p>
</a>
</li>
<li>
<a
id="e-mail"
class="u-email text-link group block w-full transition-colors motion-reduce:transition-none"
href="mailto:me@badmanners.xyz"
rel="me"
aria-label="E-mail"
data-clipboard="me@badmanners.xyz"
data-noun="E-mail address"
>
<IconEnvelope
height="1.75rem"
width="1.75rem"
class="inline transition-transform group-hover:scale-150 group-focus:scale-150 motion-reduce:transition-none motion-reduce:group-hover:scale-100 motion-reduce:group-focus:scale-100"
/>
<p class="sr-only">E-mail address</p>
</a>
</li>
<li>
<a
id="bluesky"
@ -204,7 +234,7 @@ import IconYouTube from "../components/icons/brands/IconYouTube.astro";
rel="me"
aria-label="GitHub"
>
<IconGitHub
<IconGithub
height="1.75rem"
width="1.75rem"
class="inline transition-transform group-hover:scale-150 group-focus:scale-150 motion-reduce:transition-none motion-reduce:group-hover:scale-100 motion-reduce:group-focus:scale-100"
@ -220,7 +250,7 @@ import IconYouTube from "../components/icons/brands/IconYouTube.astro";
rel="me"
aria-label="GitLab"
>
<IconGitLab
<IconGitlab
height="1.75rem"
width="1.75rem"
class="inline transition-transform group-hover:scale-150 group-focus:scale-150 motion-reduce:transition-none motion-reduce:group-hover:scale-100 motion-reduce:group-focus:scale-100"
@ -234,7 +264,7 @@ import IconYouTube from "../components/icons/brands/IconYouTube.astro";
class="u-email text-link group block w-full transition-colors motion-reduce:transition-none"
href="mailto:badmanners.vore@gmail.com"
rel="me"
aria-label="badmanners.vore@gmail.com"
aria-label="Gmail"
data-clipboard="badmanners.vore@gmail.com"
data-noun="Gmail address"
>
@ -502,6 +532,22 @@ import IconYouTube from "../components/icons/brands/IconYouTube.astro";
<p class="p-nickname sr-only">@bad_manners on Telegram</p>
</a>
</li>
<li>
<a
id="tumblr"
class="u-url text-link group block w-full transition-colors motion-reduce:transition-none"
href="https://www.tumblr.com/badmannersxyz"
rel="me"
aria-label="Tumblr"
>
<IconTumblr
height="1.75rem"
width="1.75rem"
class="inline transition-transform group-hover:scale-150 group-focus:scale-150 motion-reduce:transition-none motion-reduce:group-hover:scale-100 motion-reduce:group-focus:scale-100"
/>
<p class="p-nickname sr-only">badmannersxyz on Tumblr</p>
</a>
</li>
<li>
<a
id="twitch"