format

pyrox.dev 8d130e34 6dc84862

verified
+4 -4
src/_components/about/technology_item.vto
···
<li>
-
<strong class="mr-1">{{ tech.type }}</strong> –
-
<a class="ml-1 text-ctp-blue underline" href="{{tech.link}}">
-
{{ tech.name }}
-
</a>
+
<strong class="mr-1">{{ tech.type }}</strong> –
+
<a class="ml-1 text-ctp-blue underline" href="{{tech.link}}">
+
{{ tech.name }}
+
</a>
</li>
+12 -6
src/_components/flag_text.vto
···
<!-- dprint-ignore-file -->
{{ if flag == "trans" }}
-
<span class="trans-flag">
-
<span class="text-trans-blue">t</span><span class="text-trans-pink">r</span><span class="text-white">a</span><span class="text-trans-pink">n</span><span class="text-trans-blue">s</span>
-
</span>
+
<span class="trans-flag">
+
<span class="text-trans-blue">t</span><span class="text-trans-pink">r</span><span
+
class="text-white"
+
>a</span><span class="text-trans-pink">n</span><span class="text-trans-blue">s</span>
+
</span>
{{ else if flag == "lesbian" }}
-
<span class="lesbian-flag inline">
-
<span class="text-lesbian-orange1">l</span><span class="text-lesbian-orange2">e</span><span class="text-lesbian-orange3">s</span><span class="text-white">b</span><span class="text-lesbian-pink1">i</span><span class="text-lesbian-pink2">a</span><span class="text-lesbian-pink3">n</span>
-
</span>
+
<span class="lesbian-flag inline">
+
<span class="text-lesbian-orange1">l</span><span class="text-lesbian-orange2">e</span><span
+
class="text-lesbian-orange3"
+
>s</span><span class="text-white">b</span><span class="text-lesbian-pink1">i</span><span
+
class="text-lesbian-pink2"
+
>a</span><span class="text-lesbian-pink3">n</span>
+
</span>
{{ /if }}
+34 -34
src/_components/footer.vto
···
<footer
-
class="bg-ctp-mantle min-h-24 inset-x-0 bottom-0 border-t-2 border-ctp-surface1 grid text-ctp-text grid-cols-3"
+
class="bg-ctp-mantle min-h-24 inset-x-0 bottom-0 border-t-2 border-ctp-surface1 grid text-ctp-text grid-cols-3"
>
-
{{ await comp.logo() }}
-
<div class="mt-2">
-
<p class="text-ctp-overlay2 text-lg">Social</p>
-
<ul
-
class="grid grid-cols-3 grid-rows-2 md:block list-none text-3xl lg:text-4xl text-ctp-subtext1 space-x-1 md:space-x-2 lg:space-x-3"
-
>
-
{{ for link of author.links }}
-
<li class="inline-block">
-
<a
-
href="{{link.link}}"
-
rel="me"
-
aria-label="{{author.name}}'s {{link.description}}"
-
>
-
<i class="u-url si si-{{link.service}} {{link.extra_classes}}"></i>
-
</a>
-
</li>
-
{{ /for }}
-
<li class="inline-block lg:text-[2rem] text-[1.75rem]">
-
<a href="/blog.rss" aria-label="Blog RSS Feed">
-
<i class="si si-rss"></i>
-
</a>
-
</li>
-
</ul>
-
</div>
-
<div class="mt-2">
-
<p class="text-ctp-overlay2 text-lg">Info</p>
-
<p class="text-lg text-ctp-overlay1">&copy; 2025 dish</p>
-
<a
-
href="https://git.pyrox.dev/pyrox/new-blog/commit/{{ commit }}"
-
target="_blank"
-
class="text-ctp-blue underline"
-
>version {{ commit |> substring(0, 8) }}</a>
-
</div>
+
{{ await comp.logo() }}
+
<div class="mt-2">
+
<p class="text-ctp-overlay2 text-lg">Social</p>
+
<ul
+
class="grid grid-cols-3 grid-rows-2 md:block list-none text-3xl lg:text-4xl text-ctp-subtext1 space-x-1 md:space-x-2 lg:space-x-3"
+
>
+
{{ for link of author.links }}
+
<li class="inline-block">
+
<a
+
href="{{link.link}}"
+
rel="me"
+
aria-label="{{author.name}}'s {{link.description}}"
+
>
+
<i class="u-url si si-{{link.service}} {{link.extra_classes}}"></i>
+
</a>
+
</li>
+
{{ /for }}
+
<li class="inline-block lg:text-[2rem] text-[1.75rem]">
+
<a href="/blog.rss" aria-label="Blog RSS Feed">
+
<i class="si si-rss"></i>
+
</a>
+
</li>
+
</ul>
+
</div>
+
<div class="mt-2">
+
<p class="text-ctp-overlay2 text-lg">Info</p>
+
<p class="text-lg text-ctp-overlay1">&copy; 2025 dish</p>
+
<a
+
href="https://git.pyrox.dev/pyrox/new-blog/commit/{{ commit }}"
+
target="_blank"
+
class="text-ctp-blue underline"
+
>version {{ commit |> substring(0, 8) }}</a>
+
</div>
</footer>
+6 -6
src/_components/footnotes.vto
···
<hr class="border-ctp-overlay1 mb-2">
<ul>
-
{{ for fn of footnotes }}
-
<li class="fn" id="{{ fn.id }}">
-
<span class="fn-label">{{ fn.rawId }}</span>: {{ fn.content }}
-
<a href="#{{ fn.refId }}" class="fn-backref" aria-label="Back to reference"></a>
-
</li>
-
{{ /for }}
+
{{ for fn of footnotes }}
+
<li class="fn" id="{{ fn.id }}">
+
<span class="fn-label">{{ fn.rawId }}</span>: {{ fn.content }}
+
<a href="#{{ fn.refId }}" class="fn-backref" aria-label="Back to reference"></a>
+
</li>
+
{{ /for }}
</ul>
+31 -28
src/_components/head.vto
···
<link rel="alternate" type="application/feed+json" href="/blog.json" />
<link rel="alternate" type="application/rss+xml" href="/blog.rss" />
{{# Stylesheets #}}
-
<link rel="stylesheet" href="/static/fonts.css" />
<link
-
rel="stylesheet"
-
href='/static/styles.css?v={{ new Date(Date.now()).toISOString() |> date("t") }}'
+
rel="stylesheet"
+
href='/static/styles.css?v={{ new Date(Date.now()).toISOString() |> date("t") }}'
/>
<link
-
rel="stylesheet"
-
href='/static/icons/bsi.min.css?v={{ new Date(Date.now()).toISOString() |> date("t") }}'
+
rel="stylesheet"
+
href='/styles.css?v={{ new Date(Date.now()).toISOString() |> date("t") }}'
/>
<link
-
rel="stylesheet"
-
href='/static/icons/si.min.css?v={{ new Date(Date.now()).toISOString() |> date("t") }}'
+
rel="stylesheet"
+
href='/static/icons/bsi.min.css?v={{ new Date(Date.now()).toISOString() |> date("t") }}'
+
/>
+
<link
+
rel="stylesheet"
+
href='/static/icons/si.min.css?v={{ new Date(Date.now()).toISOString() |> date("t") }}'
/>
{{# Page Metadata #}}
<link rel="canonical" href="{{ url |> url(true) }}" />
<title>{{ title }}</title>
{{ if !production }}
-
<script defer src="/static/scripts/open-in-editor.js"></script>
-
<script src="/static/scripts/highlight-accessibility.js"></script>
-
{{# Load Sa11y #}}
-
<link rel="preconnect" href="https://cdn.jsdelivr.net">
-
<link
-
rel="stylesheet"
-
href="https://cdn.jsdelivr.net/gh/ryersondmp/sa11y@latest/dist/css/sa11y.min.css"
-
/>
-
<script
-
src="https://cdn.jsdelivr.net/combine/gh/ryersondmp/sa11y@latest/dist/js/lang/en.umd.js,gh/ryersondmp/sa11y@latest/dist/js/sa11y.umd.min.js"
-
></script>
-
<script defer>
-
Sa11y.Lang.addI18n(Sa11yLangEn.strings);
-
const sa11y = new Sa11y.Sa11y({
-
checkRoot: "body",
-
readabilityRoot: "main",
-
developerChecksOnByDefault: true,
-
showGoodLinkButton: false,
-
showGoodImageButton: false,
-
});
-
</script>
+
<script defer src="/static/scripts/open-in-editor.js"></script>
+
<script src="/static/scripts/highlight-accessibility.js"></script>
+
{{# Load Sa11y #}}
+
<link rel="preconnect" href="https://cdn.jsdelivr.net">
+
<link
+
rel="stylesheet"
+
href="https://cdn.jsdelivr.net/gh/ryersondmp/sa11y@latest/dist/css/sa11y.min.css"
+
/>
+
<script
+
src="https://cdn.jsdelivr.net/combine/gh/ryersondmp/sa11y@latest/dist/js/lang/en.umd.js,gh/ryersondmp/sa11y@latest/dist/js/sa11y.umd.min.js"
+
></script>
+
<script defer>
+
Sa11y.Lang.addI18n(Sa11yLangEn.strings);
+
const sa11y = new Sa11y.Sa11y({
+
checkRoot: "body",
+
readabilityRoot: "main",
+
developerChecksOnByDefault: true,
+
showGoodLinkButton: false,
+
showGoodImageButton: false,
+
});
+
</script>
{{ /if }}
{{# Disable Dark Reader #}}
+4 -4
src/_components/logo.vto
···
<div class="flex flex-row justify-center gap-x-2 lg:gap-x-4 content-center">
-
<i
-
class="bi bi-exclamation-triangle text-ctp-yellow self-center justify-self-end text-2xl lg:text-4xl"
-
></i>
-
<p class="text-ctp-text font-mono text-lg lg:text-xl self-center">0x64697368</p>
+
<i
+
class="bi bi-exclamation-triangle text-ctp-yellow self-center justify-self-end text-2xl lg:text-4xl"
+
></i>
+
<p class="text-ctp-text font-mono text-lg lg:text-xl self-center">0x64697368</p>
</div>
+18 -18
src/_components/navbar.vto
···
<header class="bg-ctp-mantle min-h-20 flex flex-row justify-around mb-2">
-
<a class="flex flex-row justify-center gap-x-4 content-center" href="/">
-
{{ await comp.logo() }}
-
</a>
-
<nav
-
aria-label="Main"
-
class="flex flex-row text-xl lg:text-3xl text-ctp-mauve underline gap-x-4 lg:gap-x-16 justify-center"
-
>
-
{{ for link of nav.links }}
-
<a
-
class="underline self-center"
-
href="{{ link.link }}"
-
{{ if link.name == "About" }}
-
rel="author"{{ /if }}
-
>{{ link.name }}</a>
-
{{ /for }}
-
</nav>
-
<div></div>
-
<p class="hidden lg:block text-ctp-overlay1 self-center">search coming soon</p>
+
<a class="flex flex-row justify-center gap-x-4 content-center" href="/">
+
{{ await comp.logo() }}
+
</a>
+
<nav
+
aria-label="Main"
+
class="flex flex-row text-xl lg:text-3xl text-ctp-mauve underline gap-x-4 lg:gap-x-16 justify-center"
+
>
+
{{ for link of nav.links }}
+
<a
+
class="underline self-center"
+
href="{{ link.link }}"
+
{{ if link.name == "About" }}
+
rel="author"{{ /if }}
+
>{{ link.name }}</a>
+
{{ /for }}
+
</nav>
+
<div></div>
+
<p class="hidden lg:block text-ctp-overlay1 self-center">search coming soon</p>
</header>
+26 -26
src/_components/post_card.vto
···
{{ if compact }}
-
<li class="bg-ctp-surface0 rounded">
-
<a href="{{ post.url }}">
-
<div class="m-4 py-1">
-
<p class="text-ctp-subtext1 text-lg">{{ post.title }}</p>
-
<p class="inline italic text-ctp-subtext0">{{ post.summary }}</p>
-
<p class="float-right inline text-ctp-blue">
-
<time datetime="{{ post.published |> date('SHORT_DATE') }}">
-
{{ post.published |> date('DATE') }}
-
</time>
-
</p>
-
</div>
-
</a>
-
</li>
+
<li class="bg-ctp-surface0 rounded">
+
<a href="{{ post.url }}">
+
<div class="m-4 py-1">
+
<p class="text-ctp-subtext1 text-lg">{{ post.title }}</p>
+
<p class="inline italic text-ctp-subtext0">{{ post.summary }}</p>
+
<p class="float-right inline text-ctp-blue">
+
<time datetime="{{ post.published |> date('SHORT_DATE') }}">
+
{{ post.published |> date("DATE") }}
+
</time>
+
</p>
+
</div>
+
</a>
+
</li>
{{ else }}
-
<li class="bg-ctp-surface0 rounded-md w-3/4 lg:w-full">
-
<a href="{{ post.url }}">
-
<div class="m-6 py-2">
-
<h2 class="text-ctp-subtext1 font-serif text-2xl mb-2">{{ post.title }}</h2>
-
<h3 class="text-lg lg:inline italic text-ctp-subtext0">{{ post.summary }}</h3>
-
<p class="text-lg lg:float-right lg:inline text-ctp-blue">
-
<time datetime="{{ post.published |> date('SHORT_DATE') }}">
-
{{ post.published |> date('DATE') }}
-
</time>
-
</p>
-
</div>
-
</a>
-
</li>
+
<li class="bg-ctp-surface0 rounded-md w-3/4 lg:w-full">
+
<a href="{{ post.url }}">
+
<div class="m-6 py-2">
+
<h2 class="text-ctp-subtext1 font-serif text-2xl mb-2">{{ post.title }}</h2>
+
<h3 class="text-lg lg:inline italic text-ctp-subtext0">{{ post.summary }}</h3>
+
<p class="text-lg lg:float-right lg:inline text-ctp-blue">
+
<time datetime="{{ post.published |> date('SHORT_DATE') }}">
+
{{ post.published |> date("DATE") }}
+
</time>
+
</p>
+
</div>
+
</a>
+
</li>
{{ /if }}
+11 -11
src/_components/project_card.vto
···
<li class="bg-ctp-surface0 p-4 text-lg rounded-md">
-
<h2 class="text-2xl font-serif mb-2">{{ project.name }}</h2>
-
<h3 class="italic">{{ project.description }}</h3>
-
<p>Techs Used: {{ project.techs }}</p>
-
<p>
-
Developed Since:
-
<strong><time datetime="{{ project.start |> date('date') }}">
-
{{ project.start |> date('POST_DATE') }}
-
</time></strong>
-
</p>
-
<p>Status: {{ project.status }}</p>
-
<a class="underline text-ctp-blue" href="{{ project.link }}">{{ project.link }}</a>
+
<h2 class="text-2xl font-serif mb-2">{{ project.name }}</h2>
+
<h3 class="italic">{{ project.description }}</h3>
+
<p>Techs Used: {{ project.techs }}</p>
+
<p>
+
Developed Since:
+
<strong><time datetime="{{ project.start |> date('date') }}">
+
{{ project.start |> date("POST_DATE") }}
+
</time></strong>
+
</p>
+
<p>Status: {{ project.status }}</p>
+
<a class="underline text-ctp-blue" href="{{ project.link }}">{{ project.link }}</a>
</li>
+17 -17
src/_components/table_of_contents.vto
···
<nav class="toc" aria-labelledby="toc-header">
-
<h2 class="text-ctp-overlay1 mb-1" id="toc-header">Table of Contents</h2>
-
<ol class="toc-l1">
-
{{ for item of toc }}
-
<li>
-
<a href="#{{ item.slug }}">{{ item.text }}</a>
+
<h2 class="text-ctp-overlay1 mb-1" id="toc-header">Table of Contents</h2>
+
<ol class="toc-l1">
+
{{ for item of toc }}
+
<li>
+
<a href="#{{ item.slug }}">{{ item.text }}</a>
-
{{ if item.children.length }}
-
<ul>
-
{{ for child of item.children }}
-
<li class="toc-l2">
-
<a href="#{{ child.slug }}">{{ child.text }}</a>
-
</li>
-
{{ /for }}
-
</ul>
-
{{ /if }}
-
</li>
-
{{ /for }}
-
</ol>
+
{{ if item.children.length }}
+
<ul>
+
{{ for child of item.children }}
+
<li class="toc-l2">
+
<a href="#{{ child.slug }}">{{ child.text }}</a>
+
</li>
+
{{ /for }}
+
</ul>
+
{{ /if }}
+
</li>
+
{{ /for }}
+
</ol>
</nav>
+17 -17
src/_components/webring.vto
···
<li
-
class="mb-2 lg:mb-4 px-2 py-1 bg-ctp-surface0 text-center text-lg rounded-md w-full sm:w-1/2 xl:w-1/3"
+
class="mb-2 lg:mb-4 px-2 py-1 bg-ctp-surface0 text-center text-lg rounded-md w-full sm:w-1/2 xl:w-1/3"
>
-
<p><a href="{{ring.all}}" class="text-serif text-2xl text-ctp-mauve">{{ ring.name }}</a></p>
+
<p><a href="{{ring.all}}" class="text-serif text-2xl text-ctp-mauve">{{ ring.name }}</a></p>
+
<a
+
href="{{ring.previous}}"
+
class="text-ctp-green"
+
aria-label="Previous site in the {{ring.name}}"
+
>&lt; Previous</a> |
+
{{ if ring.random }}
<a
-
href="{{ring.previous}}"
-
class="text-ctp-green"
-
aria-label="Previous site in the {{ring.name}}"
-
>&lt; Previous</a> |
-
{{ if ring.random }}
-
<a
-
href="{{ring.random}}"
-
class="text-ctp-peach"
-
aria-label="Random site in the {{ring.name}}"
-
>Random</a> |
-
{{ /if }}
-
<a href="{{ring.all}}" class="text-ctp-sapphire" aria-label="Site list for the {{ring.name}}"
-
>All</a> |
-
<a href="{{ring.next}}" class="text-ctp-maroon" aria-label="Next site in the {{ring.name}}"
-
>Next &gt;</a>
+
href="{{ring.random}}"
+
class="text-ctp-peach"
+
aria-label="Random site in the {{ring.name}}"
+
>Random</a> |
+
{{ /if }}
+
<a href="{{ring.all}}" class="text-ctp-sapphire" aria-label="Site list for the {{ring.name}}"
+
>All</a> |
+
<a href="{{ring.next}}" class="text-ctp-maroon" aria-label="Next site in the {{ring.name}}"
+
>Next &gt;</a>
</li>
+41
src/_data/decap_cms.toml
···
+
media_folder = "src/static/media"
+
public_folder = "/static/media"
+
[backend]
+
name = "git-gateway"
+
branch = "main"
+
+
[[collections]]
+
name = "blog"
+
label = "Blog Posts"
+
label_singular = "Blog Post"
+
folder = "src/blog"
+
extension = "md"
+
format = "yaml-frontmatter"
+
+
# Metadata Fields
+
[[collections.fields]]
+
name = "title"
+
label = "Title"
+
widget = "string"
+
[[collections.fields]]
+
name = "summary"
+
label = "Summary"
+
widget = "text"
+
[[collections.fields]]
+
name = "draft"
+
label = "Draft Status"
+
widget = "boolean"
+
[[collections.fields]]
+
name = "published"
+
label = "Publish Date"
+
widget = "datetime"
+
date_format = "YYYY-MM-DD"
+
[[collections.fields]]
+
name = "templateEngines"
+
label = "Template Engines"
+
widget = "hidden"
+
default = ["vto", "md"]
+
[[collections.fields]]
+
name = "body"
+
label = "Post Content"
+
widget = "markdown"
+75
src/_data/volunteering.toml
···
+
[orgs]
+
+
[orgs.bb]
+
name = "Binary Breakers"
+
homepage = "https://binarybreakers.com"
+
+
[[orgs.bb.events]]
+
name = "The Breakout: Cozy Edition"
+
role = "Chat Moderation"
+
[[orgs.bb.events]]
+
name = "The Breakout: Spring BreakOUT"
+
role = "Chat Moderation"
+
[[orgs.bb.events]]
+
name = "The Breakout: Summer GAYmes"
+
role = "Chat Moderation"
+
+
+
[orgs.furs]
+
name = "Fastest Furs"
+
homepage = "https://fastestfurs.com"
+
+
[[orgs.furs.events]]
+
name = "Fastest Furs LIVE at FWA 2025"
+
role = "Chat Moderation"
+
+
+
[orgs.fatales]
+
name = "Frame Fatales"
+
homepage = "https://framefatales.com"
+
+
[[orgs.fatales.events]]
+
name = "Frost Fatales 2025"
+
role = "In-Studio Stream Tech, Cam Ops"
+
[[orgs.fatales.events]]
+
name = "Flame Fatales 2024"
+
role = "Chat Moderation"
+
[[orgs.fatales.events]]
+
name = "Frost Fatales 2024"
+
role = "Chat Moderation"
+
+
+
[orgs.gdq]
+
name = "Games Done Quick"
+
homepage = "https://gamesdonequick.com/"
+
+
[[orgs.gdq.events]]
+
name = "Summer Games Done Quick 2025"
+
role = "Chat Moderation"
+
[[orgs.gdq.events]]
+
name = "Awesome Games Done Quick 2025"
+
role = "Chat Moderation"
+
[[orgs.gdq.events]]
+
name = "Summer Games Done Quick 2024"
+
role = "Chat Moderation"
+
[[orgs.gdq.events]]
+
name = "Awesome Games Done Quick 2024"
+
role = "Chat Moderation"
+
+
+
[orgs.zt]
+
name = "Zeldathon"
+
homepage = "https://zeldathon.com"
+
+
[[orgs.zt.events]]
+
name = "Zeldathon Voyage"
+
role = "Chat Moderation"
+
+
+
[orgs.la]
+
name = "Lady Arcaders"
+
homepage = "https://ladyarcaders.com/"
+
+
[[orgs.la.events]]
+
name = "Out of Bounds 2ronto"
+
role = "Chat Moderation"
+41 -42
src/_includes/layouts/about.vto
···
{{ layout "layouts/base.vto" }}
-
<main class="ml-4 my-8 min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2 h-card">
-
<h1 class="text-5xl text-bold text-ctp-mauve">
-
About
-
<span class="p-name p-nickname inline">
-
dish
-
</span>
-
</h1>
-
<img
-
class="h-64 w-64 rounded-full my-4"
-
src="/static/images/author.png"
-
transform-images="avif webp 300@2"
-
alt="dish at Frost Fatales 2025. She has her head tilted 45 degrees to the left and is wearing a face mask with the trans flag on it."
-
/>
+
<main class="ml-4 my-8 min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2 h-card">
+
<h1 class="text-5xl text-bold text-ctp-mauve">
+
About
+
<span class="p-name p-nickname inline">
+
dish
+
</span>
+
</h1>
+
<img
+
class="h-64 w-64 rounded-full my-4"
+
src="/static/images/author.png"
+
transform-images="avif webp 300@2"
+
alt="dish at Frost Fatales 2025. She has her head tilted 45 degrees to the left and is wearing a face mask with the trans flag on it."
+
/>
-
<div class="text-lg h-entry">
-
{{ content }}
-
</div>
+
<div class="text-lg h-entry">
+
{{ content }}
+
</div>
-
<h2 class="mt-8 mb-1 text-ctp-mauve text-2xl">Webrings!</h2>
-
<p class="text-ctp-text text-lg mb-4">
-
We're a big fan of old-school web discovery. Here's the
-
<a href="https://en.wikipedia.org/wiki/Webring" class="text-ctp-blue underline"
-
>webrings</a>
-
we're part of:
-
</p>
-
<ul>
-
{{ for ring of webrings.rings }}
-
{{ await comp.webring({"ring": ring}) }}
-
{{ /for }}
-
</ul>
+
<h2 class="mt-8 mb-1 text-ctp-mauve text-2xl">Webrings!</h2>
+
<p class="text-ctp-text text-lg mb-4">
+
We're a big fan of old-school web discovery. Here's the
+
<a href="https://en.wikipedia.org/wiki/Webring" class="text-ctp-blue underline">webrings</a>
+
we're part of:
+
</p>
+
<ul>
+
{{ for ring of webrings.rings }}
+
{{ await comp.webring({ "ring": ring }) }}
+
{{ /for }}
+
</ul>
-
<h2 class="mt-8 text-ctp-mauve text-2xl">About This Site</h2>
-
<p class="text-ctp-text text-lg">I've used the following to build this site:</p>
-
<ul>
-
{{ for tech of about.techs }}
-
{{ await comp.about.technology_item({"tech": tech}) }}
-
{{ /for }}
-
</ul>
+
<h2 class="mt-8 text-ctp-mauve text-2xl">About This Site</h2>
+
<p class="text-ctp-text text-lg">I've used the following to build this site:</p>
+
<ul>
+
{{ for tech of about.techs }}
+
{{ await comp.about.technology_item({ "tech": tech }) }}
+
{{ /for }}
+
</ul>
-
<p class="mt-4 text-lg">
-
Profile picture by Richard Ngo. <a
-
class="text-ctp-blue underline"
-
href="https://photos.gamesdonequick.com/FrostFatales2025/i-B3c9P48/A"
-
>Original Source</a> from Games Done Quick, modified by dish.
-
</p>
-
</main>
+
<p class="mt-4 text-lg">
+
Profile picture by Richard Ngo. <a
+
class="text-ctp-blue underline"
+
href="https://photos.gamesdonequick.com/FrostFatales2025/i-B3c9P48/A"
+
>Original Source</a> from Games Done Quick, modified by dish.
+
</p>
+
</main>
{{ /layout }}
+8 -8
src/_includes/layouts/base.vto
···
<!DOCTYPE html>
<html lang="en-US">
-
<head>
-
{{ await comp.head({"url": url, "title": title}) }}
-
</head>
-
<body id="body" class="mocha bg-ctp-crust grid">
-
{{ await comp.navbar() }}
+
<head>
+
{{ await comp.head({ "url": url, "title": title }) }}
+
</head>
+
<body id="body" class="mocha bg-ctp-crust grid">
+
{{ await comp.navbar() }}
-
{{ content }}
+
{{ content }}
-
{{ await comp.footer() }}
-
</body>
+
{{ await comp.footer() }}
+
</body>
</html>
+15 -15
src/_includes/layouts/blog-list.vto
···
{{ layout "layouts/base.vto" }}
-
<main class="min-h-screen text-ctp-text justify-self-center px-4 lg:px-0 w-full lg:w-1/2">
-
<h1 class="text-5xl my-8">Blog</h1>
-
<a
-
class="lg:inline float-right -mt-20 lg:mr-1.5"
-
href="/blog.rss"
-
aria-label="Blog RSS Feed"
-
>
-
<i class="text-5xl si si-rss"></i>
-
</a>
-
<ul class="mt-8">
-
{{ for post of search.pages("category=blog", "published=desc") }}
-
{{ await comp.post_card({"post": post}) }}
-
{{ /for }}
-
</ul>
-
</main>
+
<main class="min-h-screen text-ctp-text justify-self-center px-4 lg:px-0 w-full lg:w-1/2">
+
<h1 class="text-5xl my-8">Blog</h1>
+
<a
+
class="lg:inline float-right -mt-20 lg:mr-1.5"
+
href="/blog.rss"
+
aria-label="Blog RSS Feed"
+
>
+
<i class="text-5xl si si-rss"></i>
+
</a>
+
<ul class="mt-8">
+
{{ for post of search.pages("category=blog", "published=desc") }}
+
{{ await comp.post_card({ "post": post }) }}
+
{{ /for }}
+
</ul>
+
</main>
{{ /layout }}
+34 -34
src/_includes/layouts/blog-post.vto
···
{{ layout "layouts/base.vto" }}
-
<main class="min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2">
-
<article class="h-entry">
-
<h1 class="text-5xl font-serif mt-8 p-name">{{ title }}</h1>
+
<main class="min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2">
+
<article class="h-entry">
+
<h1 class="text-5xl font-serif mt-8 p-name">{{ title }}</h1>
-
<h2 class="mt-4 text-ctp-subtext0">
-
Published on
-
<time class="dt-published" datetime="{{ published |> date }}">
-
{{ published |> date('POST_DATE') }}
-
</time>
-
</h2>
-
-
<h2 class="hidden text-ctp-overlay1">
-
By
-
<span class="inline p-author h-card">{{ author.name }}</span>
-
</h2>
+
<h2 class="mt-4 text-ctp-subtext0">
+
Published on
+
<time class="dt-published" datetime="{{ published |> date }}">
+
{{ published |> date("POST_DATE") }}
+
</time>
+
</h2>
-
<h2 class="text-ctp-overlay1">
-
{{ readingInfo.words }} words, about {{ readingInfo.minutes }}
-
minute{{ if readingInfo.minutes != 1 }}s{{ /if }}
-
</h2>
+
<h2 class="hidden text-ctp-overlay1">
+
By
+
<span class="inline p-author h-card">{{ author.name }}</span>
+
</h2>
-
{{ if enable_toc != false }}
-
{{ if toc.length }}
-
{{ await comp.table_of_contents({"toc": toc}) }}
-
{{ else }}
-
<div class="mb-8"></div>
-
{{ /if }}
-
{{ /if }}
+
<h2 class="text-ctp-overlay1">
+
{{ readingInfo.words }} words, about {{ readingInfo.minutes }}
+
minute{{ if readingInfo.minutes != 1 }}s{{ /if }}
+
</h2>
-
<div class="e-content text-lg">
-
{{ content }}
-
</div>
-
</article>
-
{{ if footnotes.length }}
-
<section aria-label="Footnotes">
-
{{ await comp.footnotes({"footnotes": footnotes }) }}
-
</section>
+
{{ if enable_toc != false }}
+
{{ if toc.length }}
+
{{ await comp.table_of_contents({ "toc": toc }) }}
+
{{ else }}
+
<div class="mb-8"></div>
{{ /if }}
-
</main>
+
{{ /if }}
+
+
<div class="e-content text-lg">
+
{{ content }}
+
</div>
+
</article>
+
{{ if footnotes.length }}
+
<section aria-label="Footnotes">
+
{{ await comp.footnotes({ "footnotes": footnotes }) }}
+
</section>
+
{{ /if }}
+
</main>
{{ /layout }}
+22 -23
src/_includes/layouts/home.vto
···
{{ layout "layouts/base.vto" }}
-
<main class="min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2 h-card">
-
<h1 class="mt-8 text-5xl text-bold text-ctp-mauve">
-
hi, I'm <span><a href="/about" rel="me" class="u-url u-uid p-name p-nickname"
-
>dish</a></span>
-
</h1>
-
<img
-
class="h-64 w-64 rounded-full mt-4"
-
src="/static/images/author.png"
-
transform-images="avif webp 300@2"
-
alt="dish at Frost Fatales 2025. She has her head tilted 45 degrees to the left and is wearing a face mask with the trans flag on it."
-
/>
-
<h2 class="text-2xl mt-4 p-note">Student, Sysadmin, and UX Crafter</h2>
-
<p class="text-lg mt-2">
-
Howdy! I play with computers, with an emphasis on accessible, secure, and enjoyable
-
experiences.
-
</p>
-
<h2 class="my-8 text-2xl">Recent blog posts:</h2>
-
<ul class="lg:w-3/4">
-
{{ for post of search.pages("category=blog", "published=desc", 5) }}
-
{{ await comp.post_card({"post": post, compact: true}) }}
-
{{ /for }}
-
</ul>
-
</main>
+
<main class="min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2 h-card">
+
<h1 class="mt-8 text-5xl text-bold text-ctp-mauve">
+
hi, I'm <span><a href="/about" rel="me" class="u-url u-uid p-name p-nickname">dish</a></span>
+
</h1>
+
<img
+
class="h-64 w-64 rounded-full mt-4"
+
src="/static/images/author.png"
+
transform-images="avif webp 300@2"
+
alt="dish at Frost Fatales 2025. She has her head tilted 45 degrees to the left and is wearing a face mask with the trans flag on it."
+
/>
+
<h2 class="text-2xl mt-4 p-note">Student, Sysadmin, and UX Crafter</h2>
+
<p class="text-lg mt-2">
+
Howdy! I play with computers, with an emphasis on accessible, secure, and enjoyable
+
experiences.
+
</p>
+
<h2 class="my-8 text-2xl">Recent blog posts:</h2>
+
<ul class="lg:w-3/4">
+
{{ for post of search.pages("category=blog", "published=desc", 5) }}
+
{{ await comp.post_card({ "post": post, compact: true }) }}
+
{{ /for }}
+
</ul>
+
</main>
{{ /layout }}
+8 -8
src/_includes/layouts/projects.vto
···
{{ layout "layouts/base.vto" }}
-
<main class="min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2">
-
<h1 class="my-8 text-5xl text-bold text-ctp-mauve">Projects</h1>
-
<ul class="space-y-4">
-
{{ for project of projects.projects }}
-
{{ await comp.project_card({"project": project}) }}
-
{{ /for }}
-
</ul>
-
</main>
+
<main class="min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2">
+
<h1 class="my-8 text-5xl text-bold text-ctp-mauve">Projects</h1>
+
<ul class="space-y-4">
+
{{ for project of projects.projects }}
+
{{ await comp.project_card({ "project": project }) }}
+
{{ /for }}
+
</ul>
+
</main>
{{ /layout }}
+23
src/_includes/layouts/volunteering.vto
···
+
{{ layout "layouts/base.vto" }}
+
<main class="ml-4 my-8 min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2 h-card">
+
<h1 class="text-5xl text-bold text-ctp-mauve">
+
dish's Volunteering
+
</h1>
+
+
<br>
+
+
<div class="text-xl">
+
{{ content }}
+
<br>
+
{{ for org of volunteering.orgs }}
+
<h2 class="text-3xl">{{ org.name }}</h2>
+
<ul>
+
{{ for ev of org.events }}
+
<li class="text-xl">{{ ev.name }} - {{ ev.role }}</li>
+
{{ /for }}
+
</ul>
+
<br>
+
{{ /for }}
+
</div>
+
</main>
+
{{ /layout }}
+3 -2
src/about.md
···
time advocating for trans rights in the spaces I'm in. I feel very strongly that trans rights are
human rights, and do my best to uplift all voices, though I am not perfect.
-
Find more about my projects on the [[projects]] page, or read my [[blog/index|blog]], as I've put a
-
lot of time into both.
+
Find more about my projects on the [[projects]] page, or read my [[blog/index.md|blog]], as I've put
+
a lot of time into both. Finally, I do a lot of [[volunteering]], especially for charity marathons!
+
Check out my work on that page.
+247
src/blog/consider-the-interface.md
···
+
---
+
title: Consider the Interface
+
summary: 'Why new technology kinda... sucks'
+
draft: true
+
published: 2025-03-02
+
templateEngine: [vto, md]
+
---
+
+
## Introduction
+
+
Technology always changes. That's something we take for granted, and it's something that will
+
continue for decades, centuries, and millennia to come. However, our technological prowess and
+
advancement always comes at a cost. There's always something sacrificed in the name of progress.
+
+
For the past few years, I've had a looming sense of dread about tech. This isn't a doomsday
+
premonition, a prophecy, or anything like that. I've just noticed things changing in ways that don't
+
make sense. Popular series disappearing, YouTube videos vanishing, and subscription prices
+
constantly increasing.
+
+
I think that this is something we're really going to have to reconcile, especially as we move into
+
this new age of generative AI, stolen and derivative works, and in general, as corporations seek to
+
take over our daily lives in ways they haven't tried before.
+
+
I was inspired to write this after watching a
+
[video by Drew Gooden](https://www.youtube.com/watch?v=P-TANCVoHlc) called _"Technology isn't fun
+
anymore"_, and one he referenced called
+
_[Why Young People Love Old Things](https://www.youtube.com/watch?v=0dEJiQnotR8)_, by the channel
+
Genuine Curiosity. These two videos helped me work out and describe the feeling I've felt about how
+
technology is going backwards while trying to seem like it's going forward.
+
+
As Drew mentions in his video, many companies seem to be making decisions that are against their
+
best interests, such as TV manufacturers enabling "Motion Smoothing" features by default, which can
+
then lead to major video artifacting, and in essence, degrades the viewing experience.
+
+
While I'm not going to explore the economic or market reasons behind these seemingly nonsensical
+
decisions, I do want to share my own experience with this sort of thing and try to examine why I do
+
the things that I do. Further, this is all from my own perspective, and while I do try to utilize
+
others' perspectives to elaborate on my own opinions, at the end of the day, this is how I see the
+
world. This is not intended to be an objective piece, just want to make that clear.
+
+
## Tactility
+
+
There's something special about using something tactile. Whether that's a temperature dial in a car,
+
a light switch, or using a mouse, it's a vastly different experience than the omnipresent
+
touchscreens and mousepads so many people use today. It feels like it better connects you to the
+
actual experience and action you're doing, giving you a better feeling of control and appreciation
+
for what you're doing. Touchscreens and mousepads have absolutely advanced in their capabilities,
+
with Apple's being leagues ahead of anyone else, capable of recognizing complex gestures,
+
distinguish from many fingers at once, and they give you control you might not otherwise have.
+
+
However, whenever I use one, it feels distinctly disconnected from the actual thing I'm doing. Yes,
+
it's better than the competitors, but it's still just sliding your fingers over a flat surface. On
+
the other hand, when I'm using my mouse, there's a distinct _click_ when I press down on the mouse
+
buttons, the scroll wheel has a slight whirring noise as it spins, my hand physically moves across
+
my desk. In essence, it's like I'm actually pointing at something, which is of course the original
+
purpose of a mouse, to be a "pointing device." Windows' Computer Management utility even calls the
+
section where you can find these the "Mice and other pointing devices" section.
+
+
This was a main point brought up in the Genuine Curiosity video, how that sense of tactility helps
+
us be better connected to what we're doing. This also connects to another article I've read, this
+
one about
+
[how to design physical car controls](https://www.theturnsignalblog.com/the-subtle-art-of-designing-physical-control-for-cars/).
+
This article brought up some very interesting ideas about how to make something digital feel analog,
+
such as with force feedback mechanisms. However, the article brings up one main point at the start
+
that I'd like to call your attention to:
+
+
> When you see any physical control, you automatically get certain expectations from its physical
+
> properties like size, shape, and weight.
+
+
This highlights something that we all intuitively understand, but in general, don't think about,
+
unless something goes wildly against this. How many times have you tried to pull on a door with a
+
handle, only to realize that it's marked "Push" instead? That design goes against this principle. We
+
intuitively know how things operate, and human-centered design takes that into account.
+
+
However, touchscreens are not human-centered. They do not give any sort of force feedback(aside from
+
your keyboard _maybe_ having some sort of haptic feedback), and they are by and large flat panes of
+
glass or plastic with no defining features. They don't have any sort of texture, no knobs or
+
switches or buttons, in fact, the ideal touchscreen is one that has no distinguishing features
+
whatsoever. This, I would argue, is not ideal. Touchscreens are designed for you to be constantly
+
looking at and engaged with them, and if you're not looking at them, your ability to use them is
+
severely hindered. On the other hand, in many cars, you can adjust the temperature or music volume
+
without ever taking your eyes off the road, because the controls were designed so that you need to
+
think as little as possible to understand how they work.
+
+
The issue comes when these two technologies combine. The lack of any sort of feedback, combined with
+
the fact that you're driving a 2000+ pound block of metal and plastic down a highway, creates a
+
deadly combo. There's no way to know what you're doing without taking your eyes off the road. And
+
that's incredibly dangerous when you're the driver of a car. It's why when I buy a car, I'm going to
+
be looking for one that has no touchscreen, preferably. I don't want to be a distracted driver, and
+
another point on a bar chart.
+
+
To be clear, I don't think any of these are novel revelations. Many folks have said this exact kind
+
of thing before, and it's constantly ignored. However, I think that we're at a critical turning
+
point in how we interface with computers. More and more, for better or for worse, is being done
+
through voice and chat-like interfaces. Not your typical desktop and web browser experience, but
+
asking questions and receiving answers(whether or not they're correct, I'm personally very against
+
generative AI) has become a core user experience in many places, even if it isn't the right UX for
+
the use.
+
+
### Mechanisms
+
+
Another point of tactility that isn't so obvious in its utility is the ability to see the mechanisms
+
of how things work. I built my own blog and know how it works. I know what happens and when to make
+
the webpage you're reading right now. I like biking, and I can see clearly how it works, it's simple
+
and elegant. With a car, this is getting harder and harder to do. More and more critical components
+
of your car are controlled by electronic black boxes that take inputs and give outputs, with no real
+
way to understand how they work.
+
+
If you're a programmer or maker or some sort of creative type, you hopefully understand what I mean.
+
Being able to make things and understand what went into them, find out how they work, show someone
+
how two paints blend together, that to me is the magic of making things. This could be its own
+
article on its own(and it may be in the future!), but this is something I strongly emphasize with.
+
If I want to, I can take apart the keyboard I'm typing this on. I can open up my desktop, recompile
+
my kernel, add another line to this document. I know exactly where to go in my blog to make changes
+
to my HTML validator, and I can show someone why I think I did something in an interesting way.
+
+
To me, this is the fundamental misunderstanding of modern technology. Many people(not saying even
+
close to a majority, but a substantial amount nonetheless) enjoy tinkering. They buy things just to
+
take them apart and learn how they work. They read through code and fix bugs. They work to create
+
something they find beautiful, in whatever way that is. This is why I fell in love with technology,
+
and why I don't like modern technology as much. The joy I feel from taking apart an old laptop to
+
replace the failing boot drive is the same I get from writing code to render nice tables in a Django
+
app.
+
+
## Simplicity
+
+
Before you say anything: Yes, I know that user interfaces have gotten way simpler in many ways, and
+
especially in positive ways too, such as improved focus on accessibility and ensuring that things
+
"just work". However, I also see a trend of there being fewer and fewer escape hatches to allow
+
power-users the ability to go beyond what the normal interface allows. To be clear, I think this is
+
a good idea from a business perspective, as power users are not a large market, and so products that
+
aim to have mass-market appeal don't have a necessity for this kind of feature.
+
+
However, the aspect I want to focus on here is the underlying technical complexity. In some ways,
+
complexity is needed. The world is a big place, there's a lot of people with a lot of needs. There
+
needs to be complexity somewhere, but it feels like the world is gravitating towards needless
+
complexity all the time. I see so many cases of basic static web apps being built with massive JS
+
frameworks, shipping megabytes of code for something that displays a list of items from a server.
+
Sure, you might need _some_ JS, but not millions of bytes on it. They're not free to use(in terms of
+
maintenance burden), and they're definitely not free for end-users(JS takes way longer to execute,
+
while CSS and HTML are much faster, since they're not full programming languages). Therefore,
+
technologies like CSS-in-JS[^CSS-in-JS] just feel like they overcomplicate things, instead of making
+
it easier. Now, I'd have to deal with increased JS bundle sizes, harder debugging, and an overall
+
worse developer and user experience.
+
+
Something you will hear me emphasize a lot is good user experience. It is one of the areas I most
+
heavily focus on, as this site hopefully demonstrates. I aim to keep page sizes small, everything
+
compressed, and reduce the amount of JavaScript needed at runtime. This makes my pages performant
+
and also accessible. I also try to keep the colors well-balanced, using a variety of accessibility
+
checkers, both automated and manual, to make my content as available as possible. And so, I would
+
argue, the ever-increasing complexity of modern front-end development simply goes against that, and
+
makes things less accessible. By reducing the amount of JavaScript needed for a webpage, you
+
increase the number of users you can have, because your site is then more accessible to those with
+
low-end devices. Ensuring that users with low-end devices have the ability to access a site, even if
+
they have to disable JS to do it, is important(barring situations such as payment processing or
+
anything else that absolutely **REQUIRES** JS).
+
+
## Ownership
+
+
Another thing I notice with new products, for better or for worse, is that you don't own them. It's
+
always a subscription service, or it's a cloud service with proprietary file formats, or a streaming
+
service that will delete content that barely doesn't hit popularity metrics this month. As someone
+
who enjoys coming back to things weeks, months, sometimes even years after I last interacted with
+
them, this is devastating. The fact that so much of the stuff I enjoy today could be gone tomorrow
+
is frankly a little bit terrifying. It's why I'm a chronic archivist and that person that tells you
+
to back up your stuff. Because this matters to me, and I wish it mattered to more folks.
+
+
### You don't own new things
+
+
This is the big issue in all of this. Companies like
+
[Steam](https://www.ign.com/articles/steam-now-warns-customers-theyre-buying-a-license-not-a-game-before-they-continue-to-payment),
+
[Amazon](https://blog.the-ebook-reader.com/2025/02/22/amazon-now-openly-discloses-youre-buying-a-license-to-view-kindle-ebooks/),
+
and more are reminding customers at checkout that when they buy something, **it's not theirs.** And
+
yet, many will still click the Buy button, because these companies make it hard to realize you're
+
just getting a license, and they can take that away at any time. Hell, even the US FTC
+
[has a page](https://consumer.ftc.gov/consumer-alerts/2024/04/do-you-really-own-digital-items-you-paid)
+
on the fact you don't really own digital items. As consumers, we should be advocating for permanent
+
access to content, whether that's through the DRM-free game downloads offered by GOG, DRM-free books
+
from SmashWords, or any other number of companies that respect you more as a consumer.
+
+
### Repairability
+
+
I am a massive advocate for consumer right-to-repair and easily accessible repair guides for
+
everyone. If you own a device, you should be able to open it up and repair it if you want to, or
+
send it to someone to do that for you. There shouldn't be anything in the way of you doing so, and
+
allowing customers to repair their own devices can build trust in a brand in a way that no other
+
form of consumer control can do. Allowing customers to peer behind the curtain and see how their
+
devices work, understand how everything fits together, is to me, more powerful a statement of
+
customer trust than anything else. It signals that you trust your users and you want them to use
+
your devices however they want. It gives the customer a feeling of control, which many companies are
+
seeking to take away.
+
+
## Algorithms
+
+
{{ await comp.lorem_ipsum() }}
+
+
## What I use
+
+
{{ await comp.lorem_ipsum() }}
+
+
### RSS Reader
+
+
{{ await comp.lorem_ipsum() }}
+
+
### Self-Hosted Music Server
+
+
{{ await comp.lorem_ipsum() }}
+
+
### Mechanical Keyboard / Mouse
+
+
As mentioned above, tactility is one of the key aspects of older devices that I love, and
+
specifically, keyboards. There's a reason so many folks love old IBM Model M keyboards, and that's
+
because IBM designed springs that were light enough to press down quickly but heavy enough to give
+
feedback on whether you pressed a key. While I don't have one of those, I do use a keyboard with
+
tactile keys(Gazzew U4T Boba 62g switches, for the keyboard nerds), which helps replicate that
+
feeling but in a more budget and space-friendly way(I use a 75% keyboard).
+
+
To me, this is the ideal typing device. It allows me to do proper 10-finger touch typing, is small
+
enough that I don't have to move my hands much to reach every single key, even the function keys to
+
change music or whatever, and feels like I'm actually typing. I love my Framework Laptop so much,
+
but its keyboard will never compare to my mechanical. The mechanical one feels built for typing, and
+
gives the right amount of feedback that I can just keep typing and typing without looking at the
+
keyboard, while with the laptop, I look down somewhat frequently. I'm used to touch-typing, so it's
+
not _too big_ of a deal, but it still ruins the flow when I have to.
+
+
The same goes for my mouse. I use a Logitech MX Master 3, and it's a really nice mouse. Using it
+
instead of a touchpad lets my arm and wrist do the work of moving the cursor where I want it to go.
+
I don't have to consciously think about how to do it, my mind just works. With touchpads, I'm
+
constantly readjusting my fingers to make sure I can move my mouse, they can get in the way when I'm
+
typing, and they feel less satisfying to click than a mouse does.
+
+
A lot of this is subjective, no doubt, but having these tools allows me to work more productively
+
than I could without them. They help me stay in the flow of typing, coding, gaming, or anything else
+
I'm doing, and they do genuinely make my life better. I would not have written so much in this blog
+
post if I wasn't doing it on my keyboard, laptop keyboards, even ones as well-made as the
+
Framework's, just don't compare to a proper mechanical switch that's designed for a good typing
+
experience.
+
+
## Conclusion
+
+
{{ await comp.lorem_ipsum() }}
+
+
[^CSS-in-JS]: To be honest, I've never quite understood the need for CSS-in-JS. It always felt to me
+
like it was more trouble than it's worth. Maybe someone can explain what the benefits are?
+
Because to me, I would just write CSS with composable classes, like I do for this site. I can
+
always grep to see what classes are unused, and even if I don't, PurgeCSS/LightningCSS remove
+
unused styles anyways.
+1
src/blog/example-blog-post-2.md
···
summary: "Testing how posts work in lume"
draft: true
published: 2025-02-14
+
templateEngine: [md]
---
## example blog post 2
+57
src/blog/frost-fatales-2025-not-really-behind-the-scenes.md
···
+
---
+
title: Frost Fatales 2025 (not really) Behind the Scenes
+
summary: "dish&apos;s experience at Frost Fatales 2025"
+
draft: true
+
published: 2025-03-15
+
templateEngine: [vto, md]
+
---
+
+
Recently, I got the opportunity to volunteer in-studio at the charity speedrunning event _Frost
+
Fatales 2025_, where we raised a total of **$150,675** for the
+
[National Women's Law Center](https://nwlc.org). This was an incredible opportunity for me
+
personally, so I was thrilled that I was able to volunteer. I've never done something like this
+
before, so I was both incredibly nervous but also super excited. I've been a member of the Frame
+
Fatales community for about a year now, and this was a position I hadn't expected getting. Here, I
+
just want to go over a few of my thoughts on the experience, and why I would highly encourage anyone
+
who feels femme or like a woman to join, even if they're not a gamer or speedrunner or may even feel
+
like they don't belong.
+
+
<!-- deno-fmt-ignore-start -->
+
> [!note]- One small note
+
> Please don't see this as me trying to force you to join, as much as I encourage it! Frame
+
> Fatales is a super inclusive and wonderful community, even for femme nonbinary folks, trans women,
+
> and of course cis women.
+
<!-- deno-fmt-ignore-end -->
+
+
## Frame Fatales
+
+
First, what is Frame Fatales?
+
+
To quote [its website](https://framefatales.com):
+
+
> Frame Fatales is a community of women and femmes who are interested in speedrunning, charity
+
> events, and gaming! It is a space for you if you identify as femme or a woman in any way that is
+
> meaningful to you. Cis, trans, nonbinary, and gender non-conforming individuals are all welcome to
+
> join the Fatales community!
+
+
And to put it more simply: If you see yourself as a woman or femme in any way that is meaningful to
+
you, you're welcome in the community. It's a space for anyone who feels they may belong. As a trans
+
woman, this space has been wonderful to help me explore my identity and find folks in the same place
+
as me. I was welcomed just as I am now even a year ago, when I identified as "fem-leaning
+
nonbinary", and you'll be welcomed the same.
+
+
## The Experience
+
+
<!-- deno-fmt-ignore-start -->
+
> [!info] Legal Stuff
+
> I am under an NDA for a lot of my experience. I'm trying to be as detailed as I can,
+
> but at the same time I am going to err on the side of caution when I need to.
+
> I can't show pictures of studio stuff, software interfaces, the address of the studio, or anything like that.
+
<!-- deno-fmt-ignore-end -->
+
+
With that out of the way, I will say that this has been a very good experience. The folks I worked
+
with were wonderful, and the atmosphere was very positive all around. GDQ has built a lot of nice
+
behind-the-scenes tooling that makes it really easy for beginners like me to do well and succeed,
+
and I genuinely think that its one of their strengths. I can do the same things that folks with 5+
+
years of experience can do, and in about the same amount of time, because the tooling has been
+
well-thought-out and is designed to make things intuitive and fast.
src/static/mocha.css src/_includes/mocha.css
+1 -1
src/static/styles.css
···
@import "tailwindcss";
-
@import "./mocha.css";
+
@import "mocha.css";
.mocha {
--callout-blend-mode: lighten;
+13
src/volunteering.md
···
+
---
+
title: dish's Volunteering
+
summary: "Who is dish? Find out here."
+
layout: "layouts/volunteering.vto"
+
templateEngine: [vto, md]
+
---
+
+
I'm a very active volunteer in a lot of communities. Find out what I've done below, and feel free to
+
contact me if you'd like a volunteer for your event!
+
+
> [!note]+ Notice of non-endorsement I am not an official spokesperson for these communities, nor
+
> should my involvement in their events be seen as an endorsement of me. This page is more for my
+
> own tracking.