Consolidate socials on index and add View Transitions API support

This commit is contained in:
Bad Manners 2024-08-20 00:16:28 -03:00
parent 580cd2da26
commit 483f406037
23 changed files with 493 additions and 458 deletions

View file

@ -10,19 +10,21 @@ import ImageSamStickerJuicebox from "../assets/images/sam_sticker_juicebox.webp"
<article class="h-card" aria-labelledby="title-about-me">
<h1 id="title-about-me" class="text-2xl sm:text-3xl">About me</h1>
<section id="section-bad-manners">
<p class="mb-4 mt-5 sm:mb-3 sm:mt-6">
You can call me <b class="p-name">Bad Manners</b>, <b class="p-nickname">Manners</b>, <b class="p-nickname"
><abbr>BM</abbr></b
>, <b class="p-nickname">Bad</b>, <b class="p-nickname">Briefcase</b>... many choices to pick from! My pronouns
are "<span class="p-pronoun">he/him</span>". The term "<em>bad manners</em>" comes from gaming, where it's used
to refer to acting in a purposefully disrespectful and taunting manner towards other players, but I also chose
this moniker as it has plenty of personal meanings attached to it.
<p class="mb-4 mt-5 text-justify indent-6 sm:mb-3 sm:mt-6 sm:px-5 sm:indent-12">
You can call me <b class="p-name font-semibold">Bad Manners</b>, <b class="p-nickname font-semibold">Manners</b
>, <b class="p-nickname font-semibold"><abbr>BM</abbr></b>, <b class="p-nickname font-semibold">Bad</b>, <b
class="p-nickname font-semibold">Briefcase</b
>... many choices to pick from! My pronouns are <span class="p-pronoun font-medium">he/him</span>. The term "bad
manners" comes from gaming, where it's used to refer to acting in a purposefully disrespectful and taunting
manner towards other players, but I also chose this moniker as it has plenty of personal meanings attached to
it.
</p>
</section>
<section id="section-sam-brendan" class="h-card">
<p class="my-4 sm:mb-3 sm:mt-6">
You can also call me <b class="p-first-name">Sam</b>, which is my <span class="p-category">fursona</span>'s
name. He is a <span class="p-note">mimic and maned wolf hybrid</span>, and you can learn more about him by
<p class="my-4 text-justify indent-6 sm:mb-3 sm:px-5 sm:indent-12">
You can also call me <b class="p-first-name font-semibold">Sam</b>, which is my <span class="p-category"
>fursona</span
>'s name. He is a <span class="p-note">mimic and maned wolf hybrid</span>, and you can learn more about him by
clicking on him below!
</p>
<figure class="mt-4">
@ -42,11 +44,11 @@ import ImageSamStickerJuicebox from "../assets/images/sam_sticker_juicebox.webp"
<figcaption class="text-base">
A sticker of Sam by
<a
class="text-link transition-colors motion-reduce:transition-none"
class="h-card u-url text-link transition-colors motion-reduce:transition-none"
href="https://olivecow.carrd.co/"
target="_blank"
>
<span class="underline">OliveCow</span>
<span class="p-name underline">OliveCow</span>
<IconArrowUpRightFromSquare width="0.75rem" height="0.75rem" class="inline" />
</a>.
</figcaption>