<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xml:base="https://sainthood.xyz/" xmlns:atom="http://www.w3.org/2005/Atom">
  <channel>
    <title>Sainthood.xyz</title>
    <link>https://sainthood.xyz/</link>
    <atom:link href="https://sainthood.xyz/rss.xml" rel="self" type="application/rss+xml" />
    <description>Your guess is as good as mine.</description>
    <language>en</language>
    <item>
      <title>Tech Stuff That (Doesn&#39;t) Interest(s) Me</title>
      <link>https://sainthood.xyz/blog/posts/tech-stuff-that-doesn-t-interest-s-me.html</link>
      <description>&lt;!--date: 2026-03-01T???--&gt;
&lt;!--8:20pm--&gt;
&lt;p&gt;I&#39;m always looking for new blogs to follow via RSS and a good way to do that is to search through the various blog directories out there. Most directories are sorted by topic and I&#39;ve come to realize that I&#39;m a lot more picky than I thought!&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;I&#39;ve realized that I don&#39;t really enjoy reading a lot of tech-centered blogs and will gloss over most the technology-related categories in directories. This isn&#39;t to say that these blogs are bad or shouldn&#39;t exist, not everything someone makes has to cater to &lt;em&gt;me&lt;/em&gt; specifically. This post is more so just an exploration of how/why I feel this way.&lt;/p&gt;
&lt;p&gt;The whole situation makes me feel like a hypocrite, because I&#39;ve talked about technology on my blog before and I generally enjoy learning about it.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;I&#39;ve sat down and really thought about it. I made a list of tech-related topics that I like reading about and ones that I don&#39;t. There is nuance and overlap of course, and now I feel like even &lt;em&gt;more&lt;/em&gt; of a hypocrite because &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/2025-11-20-illusion-of-free-choice.md&quot;&gt;I&#39;ve written about AI before&lt;/a&gt;.&lt;/p&gt;
&lt;h2&gt;Stuff That Interests Me&lt;/h2&gt;
&lt;ul class=&quot;list-yes&quot;&gt;
&lt;li&gt;webweaving/hobbyist web development&lt;/li&gt;
&lt;li&gt;webdevlogs, video game devlogs, or similar&lt;/li&gt;
&lt;li&gt;homelabbing/homebrewing/hardware modding/refurbishing&lt;/li&gt;
&lt;li&gt;learning how stuff works&lt;/li&gt;
&lt;li&gt;computer history/retrospectives&lt;/li&gt;
&lt;li&gt;web accessibility&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;Stuff That &lt;em&gt;Doesn&#39;t&lt;/em&gt; Interest Me&lt;/h2&gt;
&lt;ul class=&quot;list-no&quot;&gt;
&lt;li&gt;&lt;strong&gt;AI&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;tech companies&lt;/li&gt;
&lt;li&gt;going to school to study tech&lt;/li&gt;
&lt;li&gt;shallow &quot;advice&quot; (For example: saying that everyone should switch to Linux without recommending a good beginner distro or alternatives to proprietary software.)&lt;/li&gt;
&lt;li&gt;telling me stuff I already know&lt;/li&gt;
&lt;li&gt;retreading the same few buzzwordy topics over and over again&lt;/li&gt;
&lt;/ul&gt;
&lt;hr&gt;
&lt;h2&gt;A Tangent&lt;/h2&gt;
&lt;p&gt;I think something that a lot of people forget about the &quot;old internet&quot; was that you didn&#39;t have to be a tech genius to use it. You&#39;d find websites made by people who weren&#39;t very tech-savvy or only dabbled in it as a hobby. There were website&#39;s run by teens and old people alike who only knew the bare minimum of HTML and CSS.&lt;/p&gt;
&lt;p&gt;Even as social media took over I still think there was some truth to this. I remember as a kid seeing people my age code custom DeviantArt journal skins, and later on, in the &quot;golden age&quot; of Tumblr, most community-made blog themes where made by hobbyists/novices who just wanted their blog to fit their [✨ aesthetic ✨]{ .fancy }.&lt;/p&gt;
&lt;p&gt;Sometimes I feel like I&#39;m in an awkward middle stage because I&#39;m a lot more tech-literate than most non-techie people, but I&#39;m not tech-literate &lt;em&gt;enough&lt;/em&gt; to really talk to most people who work or study tech. I&#39;m simultaneously the person my older relatives immediately go to when they need help with their smartphones, &lt;em&gt;and&lt;/em&gt; someone who&#39;s made fun of by my younger relatives with tech credentials for not knowing &quot;basic&quot; things about computers.&lt;/p&gt;
&lt;p&gt;Maybe I&#39;m just not looking hard enough, but I feel like most online spaces are aimed at either complete beginners or experienced professionals. I wish there were more spaces for intermediate hobbyists. I feel weirdly left out a lot of the time, but maybe that&#39;s just me.&lt;/p&gt;
</description>
      <pubDate>Sat, 28 Feb 2026 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/tech-stuff-that-doesn-t-interest-s-me.html</guid>
    </item>
    <item>
      <title>February 2026 Recap</title>
      <link>https://sainthood.xyz/blog/posts/february-2026-recap.html</link>
      <description>&lt;!--date: 2026-02-28T???--&gt;
&lt;!--8:45pm--&gt;
&lt;p&gt;I&#39;ll be honest, February wasn&#39;t nearly as productive as I would have liked it to be. My mind was mostly focused on just &quot;making it through the day/week/month&quot;. I had a whole list of things I was supposed to get done in my bullet journal (which I was too burnt out to use for most of the month) and I think I only crossed out two or three.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;Sometimes I almost forget that I&#39;m disabled, and then my symptoms will start showing up and reality hits me like a truck. But then again, I&#39;m not sure if I want to pathologize my experience. Maybe it&#39;s not even about being disabled/disordered, maybe it&#39;s just about being a human being with limits, like every human has. You can&#39;t expect anyone, not even the most able-bodied/neurotypical person in the world, to be at 100% all the time.&lt;/p&gt;
&lt;p&gt;I&#39;ve realized I&#39;ve been caught up in this cycle of feeling fine during the work week and then just crashing during the weekend. Long weekends and holiday breaks can be especially bad. I must keep my brain occupied at all times, lest I give it time to think about [DATA EXPUNGED]. It&#39;s ironic because even though I keep giving myself all these tasks to do, nothing actually gets done. Emails don&#39;t get read or responded to, the house is a mess, I&#39;m struggling with basic activities of daily living[^1]. If I wasn&#39;t living with family right now I&#39;d probably be living in squalor.&lt;/p&gt;
&lt;p&gt;I&#39;m so glad that I have this website. Websites are living documents. They&#39;re never 100% done and absolutely full of Sisyphean tasks. There&#39;s always something to do. Always more code to write and then rewrite. Always another blog post to publish. If I wasn&#39;t keeping myself busy with pointless stuff on this site, I might actually go crazy for real.&lt;/p&gt;
&lt;h2&gt;Working on my Website&lt;/h2&gt;
&lt;p&gt;I guess since I&#39;m already writing about my website I&#39;ll give you guys a little sneak peek of my site revamp, just to prove that I&#39;m actually doing something.&lt;/p&gt;
&lt;figure&gt;
	&lt;div class=&quot;flexcontainer&quot;&gt;
		&lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-28-gallery-preview1.jpeg&quot; alt=&quot;A screenshot of my new craft gallery, showing a grid of 12 thumbnails&quot;&gt;
		&lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-28-gallery-preview2.jpeg&quot; alt=&quot;A screenshot of an individual page in the gallery, it shows one of the images blown-up with it&#39;s image description, commentary, and metadata beneath it.&quot;&gt;
	&lt;/div&gt;
&lt;/figure&gt;
&lt;p&gt;I&#39;ve finally gotten my gallery generator to a point where I&#39;m happy with it! I have some ideas for things I might want to add down the road, but as far as baseline functionality goes it&#39;s going great! Now it&#39;s just a matter of collecting all the images and inputting all the info (writing alt text and image descriptions, metadata, etc). Right now my crafts gallery has ~40 completed pages!&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/2026-02-28-comments-preview.jpeg&quot; alt=&quot;A screenshot of a placeholder comment section, showing both the form and some dummy comments.&quot; class=&quot;center&quot;&gt;&lt;/p&gt;
&lt;p&gt;I&#39;ve also been messing around with adding a comment section. I debated if I should really do this, because I think there are a lot of pros and cons of having comments on your site, but eventually I was just like, sure, why not? I can always just shut it off later if I don&#39;t like it. I know I want to add comment sections on blog posts. I&#39;m still debating whether or not I want to add them to things like gallery pieces.&lt;/p&gt;
&lt;p&gt;This particular comment widget is &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://virtualobserver.moe/ayano/comment-widget&quot;&gt;Virtual Observer&#39;s JS comment widget&lt;/a&gt;. I&#39;m a little disappointed that I can&#39;t use a PHP widget, since my webhost supports that, but &#39;tis the way of the static site generator user. The widget is really customizable but for the life of me I can&#39;t figure out how to reformat the date. I&#39;ve dug through the code but it always comes out as month/day/year. Maybe it&#39;s a Google Docs thing?&lt;/p&gt;
&lt;p&gt;Aside from all of this I&#39;m redoing my link directory &lt;em&gt;again&lt;/em&gt;. I&#39;m also doing a lot of backend stuff that most people probably won&#39;t care about but matter to me.&lt;/p&gt;
&lt;h2&gt;Following Up On New Years Resolutions&lt;/h2&gt;
&lt;p&gt;Most of my new years resolutions have fallen by the wayside. I&#39;m drinking more coffee, I&#39;m sleeping like shit. The only one that&#39;s been going decently well is my goal of walking 7,000 steps a day. On days that I work I usually get around the 5,000-6,000ish range. Not amazing, but still much better than I was doing before. I&#39;ve also been trying to be less sedentary on days where I&#39;m not working.&lt;/p&gt;
&lt;p&gt;Kind of a tangent but I&#39;ve also been struggling to find a privacy respecting pedometer app for iOS. So many of them want to track your location or biometrics, which is a hard no from me. The most popular/reputable ones I can find only work on Android because you have to sideload them. The one I&#39;ve been using is also very buggy and sometimes just randomly resets itself. Oh, and of course it shows you ads. 🙄 I should probably just buy an analog pedometer at this point.&lt;/p&gt;
&lt;h2&gt;Going Out and Making Things&lt;/h2&gt;
&lt;p&gt;I&#39;ve been spending more time in my community. Not as much as I&#39;d like to be spending, but still more than I was before.&lt;/p&gt;
&lt;p&gt;I&#39;ve been trying to meet with friends more often. A couple weeks ago I met up with a friend at a coffee shop. We talked while I worked on a crochet project for my Grandma. I also brought &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/2026-02-27-peepy-photodump.md&quot;&gt;Icecreampy&lt;/a&gt; with me! My friend calls it the &quot;squeature&quot; because it&#39;s a creature that squeaks.&lt;/p&gt;
&lt;div class=&quot;flexcontainer&quot;&gt;
	&lt;img class=&quot;full&quot; src=&quot;https://sainthood.xyz/assets/images/IMG_2040(1).png&quot; alt=&quot;An indoor coffee shop table with a bunch of stuff on it. Contents include a large ball of brown yarn, scissors, a coffee cup, my crocheted sunflower bag, my open crocheted hook case, my friend&#39;s crocheted doll and my Icecreampy plush.&quot;&gt;
	&lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/IMG_2041(2).png&quot; alt=&quot;Icecreampy on a table outside.&quot;&gt;
	&lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/IMG_2044(2).png&quot; alt=&quot;An alternate angle of Icecreampy on a table outside.&quot;&gt;
&lt;/div&gt;
&lt;p&gt;The weekend after that our town hosted a cute little winter market. I&#39;ve been getting into scented candles recently, so I bought one of those. Inspired by &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/2026-02-19-conservatory.md&quot;&gt;my trip to the conservatory&lt;/a&gt; earlier this month, I also bought a houseplant. The guy at the booth said it was some kind of cactus, but I forgot exactly what kind. He said I don&#39;t have to water it super often, which is good, because if I&#39;m barely taking care of myself I can&#39;t imagine I&#39;d be able to care for a houseplant.&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/2026-02-28-cactus.jpg&quot; alt=&quot;My new mini cactus in a pot on my desk.&quot; class=&quot;center&quot;&gt;&lt;/p&gt;
&lt;p&gt;He doesn&#39;t have a name yet. Feel free to send me your suggestions!&lt;/p&gt;
&lt;p&gt;I&#39;ve also been trying to get back into making (digital) art. It&#39;s not perfect but hey, it&#39;s not the worst for someone who&#39;s been out of practice for so long.&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/art/2026-02-26-hare-wip.png&quot; alt=&quot;A digital bust drawing of a brown hare.&quot;&gt;&lt;/p&gt;
&lt;h2&gt;Tomodachi Life Direct&lt;/h2&gt;
&lt;p&gt;Okay, I know the Tomodachi Life direct happened at the very tail end of January, but I didn&#39;t catch the vod until February, so I&#39;m talking about it here. Tomodachi Life: Living the Dream looks so good!&lt;/p&gt;
&lt;p&gt;I like how they managed to add a lot of new customization options, while still having the miis look like miis. They also finally fulfilled their promise of letting you make &lt;strong class=&quot;text-gay&quot;&gt;gay miis&lt;/strong&gt;, and even &lt;strong class=&quot;text-nonbinary&quot;&gt;nonbinary miis&lt;/strong&gt;! I also love how unmarried miis can be roommates now, I feel like that could lead to a lot of entertaining moments.&lt;/p&gt;
&lt;p&gt;I&#39;m really glad the game&#39;s coming out for the original Switch and not the Switch 2. I&#39;ll &lt;em&gt;actually&lt;/em&gt; be able to play it because I don&#39;t own a Switch 2 and I don&#39;t plan on buying one any time soon. Rhythm Heaven Groove is coming out for the original Switch as well. The only games I care about are coming out on a console that &lt;s&gt;can be easily emulated&lt;/s&gt; I already own, lucky me!&lt;/p&gt;
&lt;p&gt;Random thought but does anyone else remember that one Tomodachi Life app game that was around for a little while? I played it when it came out but it was pretty boring, and of course it was full of microtransactions. Anyway, I&#39;m glad we&#39;re getting a &lt;em&gt;real&lt;/em&gt; mii game after all this time.&lt;/p&gt;
&lt;h2&gt;Media&lt;/h2&gt;
&lt;p&gt;Haven&#39;t been watching or listening to much, honestly. Been too burnt out to really enjoy or fully engage with a lot of things. I feel bad because so many bloggers I follow are able to give thought-provoking book reviews or political analysis or other smart important things on such a regular basis meanwhile I just link to YouTube Poops that I like. Anyway...&lt;/p&gt;
&lt;h3&gt;Watching&lt;/h3&gt;
&lt;h4&gt;The Fun Stuff&lt;/h4&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=1SwNVJ-DnjY&quot;&gt;Tomodachi Life: Orphan% in 19:14.420 (WR)&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=OjBerqq0mZc&quot;&gt;The Homer Revolving (PLAYABLE)&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=qNc56ig4gPQ&quot;&gt;Snowding Fries Are Done (Family Guy x Undertale)&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=aPy7t0eixBY&quot;&gt;momy is from space&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=256FF1yclB4&quot;&gt;Defunctland After Dark: The Capital One Bank Guy&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;h4&gt;The Serious Stuff&lt;/h4&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=m8yl7dwsixw&quot;&gt;ISHOWSPEED VS MR BEAST IN AFRICA: Two different stories&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=8BIcAZxFfrc&quot;&gt;Vaccines and Autism: A Measured Response&lt;/a&gt;[^2]&lt;/li&gt;
&lt;/ul&gt;
&lt;h3&gt;Listening To&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=lIxQe1R5hs0&quot;&gt;PinkPantheress - Stateside + Zara Larsson&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=t2cqbbXyHzg&quot;&gt;Magdalena Bay - Star Eyes&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=7KSL8bOggTI&quot;&gt;Charli xcx - Chains of Love&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=T0RvPYRRRbE&amp;list=LL&amp;index=9&quot;&gt;Passion Pit - Sleepyhead&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=B9dSYgd5Elk&quot;&gt;MGMT - Time to Pretend&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=fe4EK4HSPkI&amp;list=RDfe4EK4HSPkI&amp;start_radio=1&quot;&gt;MGMT - Kids&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Recently I&#39;ve been really nostalgic for, what do you even call this genre, 2000&#39;s white guy synth indie? Anyway, I truly believe that Time to Pretend is a 10/10 song with a 10/10 music video. Kids is also a 10/10 song.&lt;/p&gt;
&lt;h2&gt;What I&#39;m Looking Forward to in March&lt;/h2&gt;
&lt;p&gt;Uhhhhh, not much honestly. I kept telling myself I&#39;d get back on track by March, but clearly that didn&#39;t happen. Not really any big events I&#39;m looking forward to either. I&#39;ll figure something out though.&lt;/p&gt;
&lt;h2&gt;Overall&lt;/h2&gt;
&lt;p&gt;I work and I&#39;m exhausted. I do nothing and I&#39;m depressed. I leave the house and I feel like shit the second I get home. I try to enjoy my hobbies and half the time I feel nothing. At least you can&#39;t say I&#39;m not trying. ¯&#92;&lt;em&gt;(ツ)&lt;/em&gt;/¯&lt;/p&gt;
&lt;p&gt;[^1]: &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://en.wikipedia.org/wiki/Activities_of_daily_living&quot;&gt;https://en.wikipedia.org/wiki/Activities_of_daily_living&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;[^2]: Yes, I know this is a relatively old and already very popular video, but I rewatched it in February and I think it&#39;s an amazing video on the subject.&lt;/p&gt;
</description>
      <pubDate>Fri, 27 Feb 2026 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/february-2026-recap.html</guid>
    </item>
    <item>
      <title>A Belated Peepy and OuiOui Photodump</title>
      <link>https://sainthood.xyz/blog/posts/a-belated-peepy-and-ouioui-photodump.html</link>
      <description>&lt;!--date: 2026-02-27T????--&gt;
&lt;!--4:30pm--&gt;
&lt;p&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://itemlabel.com/&quot;&gt;ItemLabel&lt;/a&gt; is a company that makes, among other things, weird collectable art toys. In 2021 they became semi-viral for their YouTube ads, which features music from the company&#39;s CEO and CXO &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://emamouse.bandcamp.com/&quot;&gt;emamouse&lt;/a&gt;. Their flagship character is Peepy (pronounced like &quot;pee-pee&quot;), a furby-like creature who likes to commit crimes. They also make OuiOuis (pronounced like &quot;wee-wee&quot;), which are bipedal, baby versions of peepys, and a bunch of other characters.&lt;/p&gt;
&lt;!-- excerpt start --&gt;
&lt;p&gt;I started collecting itemLabel plushies last year. I wanted to include some recent photos of them in my next monthly recap post, but I realized that I had so many stashed away in my phone that I should probably share the old ones first. So This post will just be a dump of those, along with my assorted thoughts.&lt;/p&gt;
&lt;!-- excerpt end --&gt;
&lt;hr&gt;
&lt;p&gt;Last summer, after about a year of sharing itemLabel&#39;s videos with her, my sister gifted me my first Peepy, Ice Cream Peepy AKA &lt;strong class=&quot;white&quot;&gt;Icecreampy&lt;/strong&gt;!&lt;/p&gt;
&lt;figure&gt;
	&lt;div class=&quot;flexcontainer&quot;&gt;
		&lt;img class=&quot;full&quot; src=&quot;https://sainthood.xyz/assets/images/icecreampybench.jpg&quot; alt=&quot;Icecreampy on a bench outside.&quot;&gt;
		&lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/icecreampytree1.jpg&quot; alt=&quot;Icecreampy in a tree.&quot;&gt;
		&lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/icecreampytree2.jpg&quot; alt=&quot;An alternate angle of Icecreampy in a tree.&quot;&gt;
	&lt;/div&gt;
	&lt;figcaption&gt;
		&lt;p&gt;Some photos I took of Icecreampy in summer 2025.&lt;/p&gt;
	&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;I haven&#39;t given it a proper name yet. I&#39;ve jokingly referred to it as &quot;Sprimkles&quot; before, like &quot;Sprinkles&quot; but funnier, but I also have another plushie named Sprinkles so maybe I shouldn&#39;t do that, to avoid accidently mixing the two up.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;For a while it felt like my craving for wacky looking plushies had been satiated, but then I heard the news of itemLabels then-newest line of blind bags.&lt;/p&gt;
&lt;figure class=&quot;small right&quot;&gt;
	&lt;img src=&quot;https://sainthood.xyz/assets/images/allstars_back.png&quot; alt=&quot;A chart showing all the different plushi designs available in OuiOui Allstars.&quot;&gt;
&lt;/figure&gt;
&lt;p&gt;Typically, I&#39;m not a huge fan of blind bags. They&#39;re a real gamble, half of the time you end up getting something that you don&#39;t even want. ItemLabel&#39;s products aren&#39;t exactly the cheapest, so I really don&#39;t want to spend money on them unless I really like what I&#39;m getting. Not to mention these are &lt;em&gt;art&lt;/em&gt; toys that I&#39;m just going to display on my shelf anyway. I&#39;d need a &lt;em&gt;really&lt;/em&gt; good reason to actually purchase a blind bag.&lt;/p&gt;
&lt;p&gt;However, when Itemlabel announced OuiOui Allstars, every single one of the designs was an &lt;em&gt;absolute banger&lt;/em&gt;!&lt;/p&gt;
&lt;p&gt;The line features the best designs from older blind bag serries that they don&#39;t/rarely restock anymore, as voted by the fans in their discord server. Perfect for someone like me who only started collecting recently. They also come with cute little accessories! So I guess if you&#39;re a hardcore OuiOui collector that already has all of the originals, you can try to collect all of these to get all of the accessories instead.&lt;/p&gt;
&lt;p&gt;In November 2025 I ordered myself some OuiOuis and words can not describe how excited I was when I opened it.&lt;/p&gt;
&lt;div class=&quot;flexcontainer&quot;&gt;
	&lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/strawberrystinker1.jpg&quot; alt=&quot;A OuiOui wearing a strawberry shaped outfit that covers its whole body and a purple OuiOui wearing frilly underpants side by side.&quot;&gt;
	&lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/strawberrystinker2.jpg&quot; alt=&quot;Those same two OuiOuis next to Icecreampy.&quot;&gt;
&lt;/div&gt;
&lt;p&gt;I got &lt;strong class=&quot;pink&quot;&gt;Strawberry&lt;/strong&gt; and &lt;strong class=&quot;purple&quot;&gt;Stinker&lt;/strong&gt;! Like I said, I&#39;d be satisfied with getting any of the designs, but I do find the little strawberry outfit to be especially cute. I also like that one of them is smiling and the other isn&#39;t. I didn&#39;t bother giving these guys proper names either, so if you have any suggestions feel free to let me know!&lt;/p&gt;
&lt;p&gt;If I could made one small critique; the clothes are a little hard to get on and off the plushies. I kept worrying that I was accidentally going to damage them or my OuiOui, because you really need to force it on them. It took me several minutes just to get Stinkers pants on without them falling off. usually this wouldn&#39;t bother me, but since swapping the clothes between them is a highly advertised feature on itemLabel&#39;s website/social media, I thought it was worth mentioning.&lt;/p&gt;
&lt;hr&gt;
&lt;div class=&quot;flexcontainer&quot;&gt;
	&lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/strawberrywithcat.jpg&quot; alt=&quot;Strawberry OuiOui without its strawberry outfit on being held up in front of my computer monitor, which shows a cartoon pink and white cat.&quot;&gt;
	&lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/stinkerwithcat.jpg&quot; alt=&quot;Stinker OuiOui being held up in front of my computer monitor, which shows a cartoon solid purple cat.&quot;&gt;
&lt;/div&gt;
&lt;p&gt;Around the time my OuiOui&#39;s came in the mail, PawBorough Beta did another reset. For those curious you can check out &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/2025-11-03-pawborough.md&quot;&gt;my post about PawBorough&lt;/a&gt;, but basically it&#39;s a cat-focused virtual pet sim that was in closed beta at the time.&lt;/p&gt;
&lt;p&gt;Anyway, I decided to base this set of founder cats off of my OuiOuis, and even tried to give them matching names and personalities. Unfortunately, this particular clan didn&#39;t last very long and I wasn&#39;t able to breed any kittens, but here&#39;s a screenshot of my den for those who care.&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/ouiouicats.png&quot; alt=&quot;A screenshot of my five starting cats and their info.&quot;&gt;&lt;/p&gt;
&lt;details&gt;
	&lt;summary&gt;In-depth Info&lt;/summary&gt;
	&lt;strong&gt;Sweetberry&lt;/strong&gt;
	&lt;ul&gt;
		&lt;li&gt;&lt;strong&gt;Pronouns:&lt;/strong&gt; She/Her&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Role:&lt;/strong&gt; Explorer&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Sex:&lt;/strong&gt; Female&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Native Borough:&lt;/strong&gt; Luna&lt;/li&gt;
	&lt;/ul&gt;
	&lt;strong&gt;Skunkfur&lt;/strong&gt;
	&lt;ul&gt;
		&lt;li&gt;&lt;strong&gt;Pronouns:&lt;/strong&gt; They/It&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Role:&lt;/strong&gt; Forager&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Sex:&lt;/strong&gt; Female&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Native Borough:&lt;/strong&gt; Luna&lt;/li&gt;
	&lt;/ul&gt;
	&lt;strong&gt;Shadespots&lt;/strong&gt;
	&lt;ul&gt;
		&lt;li&gt;&lt;strong&gt;Pronouns:&lt;/strong&gt; He/They&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Role:&lt;/strong&gt; Miner&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Sex:&lt;/strong&gt; Male&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Native Borough:&lt;/strong&gt; Zenith&lt;/li&gt;
	&lt;/ul&gt;
	&lt;strong&gt;Skystripe&lt;/strong&gt;
	&lt;ul&gt;
		&lt;li&gt;&lt;strong&gt;Pronouns:&lt;/strong&gt; They/Them&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Role:&lt;/strong&gt; Fisherman&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Sex:&lt;/strong&gt; Female&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Native Borough:&lt;/strong&gt; The Metropolis&lt;/li&gt;
	&lt;/ul&gt;
	&lt;strong&gt;Leafblaze&lt;/strong&gt;
	&lt;ul&gt;
		&lt;li&gt;&lt;strong&gt;Pronouns:&lt;/strong&gt; He/Him&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Role:&lt;/strong&gt; Hunter&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Sex:&lt;/strong&gt; Male&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Native Borough:&lt;/strong&gt; Zenith&lt;/li&gt;
	&lt;/ul&gt;
	&lt;p&gt;I forgot which natures the different animal symbols mean. The wikia doesn&#39;t have a page for them yet and the actual site is currently down for maintenance.&lt;/p&gt;
&lt;/details&gt;
&lt;hr&gt;
&lt;p&gt;Anyway, back to the plushies...&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/itemlabelshelf.jpg&quot; alt=&quot;My itemLabel plushies on a shelf.&quot;&gt;&lt;/p&gt;
&lt;figure class=&quot;small right&quot;&gt;
	&lt;img src=&quot;https://sainthood.xyz/assets/images/icecreampycloseup.jpg&quot; alt=&quot;A very close up photo of Icecreampy.&quot;&gt;
	&lt;figcaption&gt;
		&lt;p&gt;Extreme close up!!! Woooooah!!!&lt;/p&gt;
	&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;My collection now has a home on my shelf, next to my (3)DS games and my gay frog. I didn&#39;t want them to get accidently damaged by keeping them with my childhood plushies.&lt;/p&gt;
&lt;p&gt;Having them on display also makes them a nice conversation piece. &quot;What the fuck is that?!&quot; someone might say. Great, now I&#39;ve broken the ice with them &lt;em&gt;and&lt;/em&gt; I get to ramble about my collection for a little bit! It&#39;s a win-win!&lt;/p&gt;
&lt;p&gt;Maybe once I get my whole shelf nicely organized I&#39;ll give you guys a full shelf tour.&lt;/p&gt;
</description>
      <pubDate>Thu, 26 Feb 2026 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/a-belated-peepy-and-ouioui-photodump.html</guid>
    </item>
    <item>
      <title>&quot;Recession Indicators&quot;</title>
      <link>https://sainthood.xyz/blog/posts/recession-indicators.html</link>
      <description>&lt;p&gt;Everything&#39;s supposedly a &amp;quot;recession indicator&amp;quot; nowadays. &amp;quot;recession indicator&amp;quot; this, &amp;quot;recession indicator&amp;quot; that, it&#39;s usually over pretty frivolous stuff too. I always take the phrase with a grain of salt.&lt;/p&gt;
&lt;p&gt;But the other day I got one of those &amp;quot;cash for gold&amp;quot; type ads before a YouTube video. I haven&#39;t even one of those since Obama was in office! A true, actual, genuine recession indicator if I&#39;ve ever seen one. We are so cooked!&lt;/p&gt;
</description>
      <pubDate>Tue, 24 Feb 2026 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/recession-indicators.html</guid>
    </item>
    <item>
      <title>Conservatory Photodump</title>
      <link>https://sainthood.xyz/blog/posts/conservatory-photodump.html</link>
      <description>&lt;!--7:20pm--&gt;
&lt;p&gt;I got to go on a surprise trip to the conservatory the other day! We met up with a family friend there. I took a bunch of photos while I was there too, so I thought I might as well share them here!&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;figure&gt;
    &lt;div class=&quot;flexcontainer&quot;&gt;
        &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-palm1.jpg&quot; alt=&quot;Palm tree leaves as seen from below.&quot;&gt;
        &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-palm2.jpg&quot; alt=&quot;An alternate angle of palm tree leaves.&quot;&gt;
        &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-ficus1.jpg&quot; alt=&quot;Ficus tree leaves as seen from below.&quot;&gt;
        &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-ficus2.jpg&quot; alt=&quot;An alternate angle of ficus tree leaves.&quot;&gt;
    &lt;/div&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            Palm and ficus trees.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;figure&gt;
    &lt;div class=&quot;flexcontainer&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-neoregelia.jpg&quot; alt=&quot;A dense patch of many neoregelia plants.&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-cattails.jpg&quot; alt=&quot;Red Hot Cat’s Tail tree.&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-canary-date-palm.jpg&quot; alt=&quot;Canary Date Palm tree as seen from below.&quot;&gt;
    &lt;/div&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            Neoregelia, Red Hot Cat&#39;s Tail (&lt;i&gt;Acalypha hispida&lt;/i&gt;), and Canary Date Palm (&lt;i&gt;Phoenix canariensis&lt;/i&gt;).
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;figure&gt;
    &lt;div class=&quot;flexcontainer&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-calabash-tree1.jpg&quot; alt=&quot;Calabash tree trunk.&quot;&gt;
        &lt;img class=&quot;twothird&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-calabash-tree2.jpg&quot; alt=&quot;Calabash tree branches as seen from below.&quot;&gt;
    &lt;/div&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            Calabash tree (&lt;i&gt;Crescentia cujete&lt;/i&gt;).
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;figure&gt;
    &lt;div class=&quot;flexcontainer&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-bunny-ears.jpg&quot; alt=&quot;A patch of bunny ears cacti.&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-small-cacti.jpg&quot; alt=&quot;A bunch of assorted, small succulents.&quot;&gt;
    &lt;/div&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            Bunny Ears (&lt;i&gt;Opuntia microdasys&lt;/i&gt;), Ivory Towers (&lt;i&gt;Crassula socialis&lt;/i&gt;), and Mammillaria.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;figure&gt;
    &lt;div class=&quot;flexcontainer&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-flowers1.jpg&quot; alt=&quot;A patch of assorted flowers.&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-flowers2.jpg&quot; alt=&quot;A raised bed of various flowers and shrubs.&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-flowers3.jpg&quot; alt=&quot;A patch of white, cream, and red stock flowers.&quot;&gt;
    &lt;/div&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            The flower room.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;div class=&quot;flexcontainer&quot;&gt;
    &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-not-blue-ginger1.jpg&quot; alt=&quot;A patch of two different purple flowers with a sign labeled &#39;Blue Ginger&#39;.&quot;&gt;
    &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-not-blue-ginger2.jpg&quot; alt=&quot;A close up of one of the purple flowers.&quot;&gt;
    &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-not-blue-ginger3.jpg&quot; alt=&quot;An alternate angle of the same purple flower.&quot;&gt;
&lt;/div&gt;
&lt;p&gt;I thought these were blue ginger (&lt;i&gt;Dichorisandra thyrsiflora&lt;/i&gt;) because that&#39;s what the little sign says. But when I search for images of them online it brings up photos that look more like those other flowers in the background. I&#39;m not sure what these flowers in the foreground are.&lt;/p&gt;
&lt;div class=&quot;flexcontainer&quot;&gt;
    &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-turtles2.jpg&quot; alt=&quot;Three turtles sitting on some rocks by a water feature.&quot;&gt;
    &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-fish1.jpg&quot; alt=&quot;Orange and yellow koi fish of various sizes in a small pond.&quot;&gt;
    &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-fish4.jpg&quot; alt=&quot;One of the ponds with koi fish and lots of greenery around it.&quot;&gt;
    &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-fish5.jpg&quot; alt=&quot;An alternate angle of one of the ponds that shows how tall some of the surrounding plants are.&quot;&gt;
    &lt;img class=&quot;full&quot; src=&quot;https://sainthood.xyz/assets/images/2026-02-16-koifish.gif&quot; alt=&quot;Animated GIF of the koi fish pond.&quot;&gt;
&lt;/div&gt;
&lt;p&gt;The water features were probably my favorite parts. They have real turtles and koi fish. It&#39;s so peaceful. I miss it already :(&lt;/p&gt;
</description>
      <pubDate>Wed, 18 Feb 2026 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/conservatory-photodump.html</guid>
    </item>
    <item>
      <title>Wizard-Style vs Witch-Style</title>
      <link>https://sainthood.xyz/blog/posts/wizard-style-vs-witch-style.html</link>
      <description>&lt;!--date: 2026-02-14T????--&gt;
&lt;!--4:04pm--&gt;
&lt;p&gt;In &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/2026-01-31-january-recap.md&quot;&gt;my January recap&lt;/a&gt;, I linked to a video I enjoyed called &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=YzIu-ZiA260&quot;&gt;&quot;Wizard Cooking vs Witch Cooking&quot;&lt;/a&gt;. The video talks about different methods of cooking in real life and how to apply them in a fictional/world building context. It uses wizards and witches as a metaphor for strictly following the (cook)book vs just eyeballing ingredients as you go along.&lt;/p&gt;
&lt;p&gt;While the video mostly sticks to talking about cooking there were some things that made me wonder how this kind of thinking could be applied to other activities as well.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;blockquote&gt;
&lt;p&gt;&quot;Since cookbooks for the home chef became popular, more and more people in the west feel obligated to measure everything from spices to meat as precisely as possible. This has always been weird to me, because I was raised on the idea that cookbooks are for inspiration, not for following to a T. &lt;mark&gt;Except for baking. Baking witch style is really really hard.&lt;/mark&gt; So is stuff like making pasta. The only people who can do these things reliably do it very often and all day long.&quot;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;So, cooking can be done either way, but baking is usually only done wizard-style. Not that it &lt;em&gt;can&#39;t&lt;/em&gt; be done witch-style, just that it&#39;s really difficult to do consistently.&lt;/p&gt;
&lt;p&gt;Are there any other activities that fall under this spectrum? Are there any activities that are strictly one or the other? That&#39;s what I&#39;ve been trying to figure out.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;Not long after I first saw this video I met up with my local fiber arts group. I&#39;ve started going there regularly and I&#39;m the youngest person there by at least a couple decades.&lt;/p&gt;
&lt;p&gt;After I watched the video I assumed that crochet would probably be a &quot;wizard activity&quot;. There&#39;s a decent bit of math involved. Depending on what you&#39;re making, having a single extra or missing stitch in an early row/round can cause a domino effect that messes up your whole project. Some patterns I&#39;ve seen start with something like &quot;start with a multiple of 3 plus 1 chains (3n+1)&quot; or something like that. Seems pretty technical and wizard-like to me!&lt;/p&gt;
&lt;p&gt;So, I show up to one of the meetups with that in the back of my head. About halfway through I&#39;m talking to one of the women there and she just casually mentions that she&#39;s never followed a crochet pattern in her entire life! Not even once! She says that she taught herself how to crochet when she was a child and that she found patterns &quot;too constricting&quot;. She more or less just makes it up as she goes along. She&#39;s crocheting witch-style!&lt;/p&gt;
&lt;p&gt;By coincidence, our conversation also ended up shifting to the Great British Baking Show. A lot of the contestants on that show bake witch-style, that&#39;s what makes it so impressive to most people I think.&lt;/p&gt;
&lt;p&gt;What other things can be done wizard-style or witch-style?&lt;/p&gt;
&lt;p&gt;The next thing that popped into my head was a classical artist who meticulously draws a bunch of guidelines and uses reference photos to make sure their anatomy is perfect vs a cartoonist who immediately puts pen to paper and makes whatever feels right in that moment. I&#39;m sure there&#39;s other examples but my brain just doesn&#39;t feel like cooperating today.&lt;/p&gt;
&lt;p&gt;I hope I&#39;m not giving the impression that doing things witch-style is lazy or easy. If anything I imagine it&#39;s more effort because it&#39;s more experimenting with things. You have to keep track of what does and doesn&#39;t work and fix things if they don&#39;t work out.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;Also happy Valentines Day! I totally forgot it even was Valentines Day until a friend of mine texted me lol.&lt;/p&gt;
</description>
      <pubDate>Fri, 13 Feb 2026 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/wizard-style-vs-witch-style.html</guid>
    </item>
    <item>
      <title>Autism and Literally Wearing a Mask</title>
      <link>https://sainthood.xyz/blog/posts/autism-and-literally-wearing-a-mask.html</link>
      <description>&lt;!--date: 2026-02-12T????--&gt;
&lt;!--9:42pm--&gt;
&lt;p&gt;When most people talk about autism and masking they mean it in a metaphorical sense, but lately I&#39;ve been thinking about it very literally.&lt;/p&gt;
&lt;!--excerpt--&gt;
&lt;p&gt;During the pandemic I wore a mask every single time I left the house. Nowadays it&#39;s not as often, but still a lot more than most other people I know. I typically wear one when I know I&#39;m going to be in a large crowd, like on public transportation, or if I&#39;m getting over a cold.&lt;/p&gt;
&lt;p&gt;About a month or so ago there was an outbreak of multiple diseases at my workplace and I decided to start wearing my facemask at work just to be safe. Today was the first day since then that I didn&#39;t wear it. I don&#39;t think I fully realized how much I needed it until I took it off. Not just for the obvious health reasons, but for social reasons too.&lt;/p&gt;
&lt;p&gt;Whenever I&#39;m not wearing it I&#39;m obsessing over how my face looks. Am I smiling too much? Not enough? Is my expression appropriate for whatever we&#39;re talking about? It&#39;s exhausting having to constantly scan your body like this every second of the day.&lt;/p&gt;
&lt;p&gt;But when I&#39;m wearing it, all people can see is my eyes. Eyes can still be very expressive, of course, but unless you&#39;ve really mastered your &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://en.wiktionary.org/wiki/smize&quot;&gt;smize&lt;/a&gt;, your face probably isn&#39;t going to be as readable with half of it covered. It gives me one less thing to worry about, which is always nice.&lt;/p&gt;
&lt;p&gt;No one&#39;s ever confronted me about it either. I don&#39;t think it&#39;s that weird, personally. I know a handful of people who never stopped wearing a mask because they&#39;re immunocompromised or something. I guess if someone &lt;em&gt;did&lt;/em&gt; say something I&#39;d just tell them I&#39;m getting over a cold. I can&#39;t imagine it&#39;d be a huge deal.&lt;/p&gt;
</description>
      <pubDate>Wed, 11 Feb 2026 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/autism-and-literally-wearing-a-mask.html</guid>
    </item>
    <item>
      <title>January 2026 Recap</title>
      <link>https://sainthood.xyz/blog/posts/january-2026-recap.html</link>
      <description>&lt;!--date: 2026-01-31T17:00:00--&gt;
&lt;p&gt;I&#39;ve been inspired by a bunch of other bloggers (mostly &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://leilukin.com/blog/posts/2026-01-18-weekly-recap/&quot;&gt;Leilukin&lt;/a&gt;) to start writing these little monthly recap posts. Work and &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/blogging-vs-brain-fog.html&quot;&gt;brainfog&lt;/a&gt; makes it hard to write long posts or write super often, and to be honest, I don&#39;t think I even &lt;em&gt;do&lt;/em&gt; enough to warrant a weekly recap, but a monthly one seems pretty manageable. It&#39;s a nice compromise between how frequently I&#39;m currently posting and a challenge like &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://100daystooffload.com/&quot;&gt;100 Days To Offload&lt;/a&gt;. So, you&#39;ll be getting at least 12 blog posts a year, plus my usual other blog posts about various topics, hopefully.&lt;/p&gt;
&lt;p&gt;Without any further ado, what&#39;ve I been up to in January?&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;h2&gt;New Years Resolutions&lt;/h2&gt;
&lt;p&gt;After I finished writing &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/40-questions-for-2025.html&quot;&gt;my last blog post&lt;/a&gt;, I started thinking about what I wanted my New Year&#39;s resolution for 2026 to be. Last year I really overcomplicated things, so this year I wanted to keep things simple.&lt;/p&gt;
&lt;p&gt;Most of my goals this year are health or disability-related. I can&#39;t really go into details. As far as the stuff I&#39;m comfortable talking about, I&#39;m trying to be less sedentary (7,000 or more steps per day) and have a better sleep schedule (start going to bed/waking up earlier, taking melatonin). Most of these have been going pretty well so far! I&#39;m not sticking to them perfectly but I definitely feel better most days than I did before.&lt;/p&gt;
&lt;p&gt;I&#39;ve also been trying to be less reliant on caffeine. Since 2020 I&#39;ve been drinking a mug and a half to two mugs worth nearly every morning[^1]. Lately, I&#39;ve been trying to limit it to only one, &lt;em&gt;maybe&lt;/em&gt; one and a half at &lt;em&gt;maximum&lt;/em&gt; and only if I &lt;em&gt;really&lt;/em&gt; need it, but that hasn&#39;t been going so well.&lt;/p&gt;
&lt;h3&gt;Misc Goals for This Year&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;Degoogle.&lt;/li&gt;
&lt;li&gt;Play around with Linux more. Maybe install Mint or Ubuntu on an old laptop I want to refurbish.&lt;/li&gt;
&lt;li&gt;Get more comfortable using Git.&lt;/li&gt;
&lt;li&gt;Buy ita bag for displaying pin collection.&lt;/li&gt;
&lt;li&gt;Make more art.&lt;/li&gt;
&lt;li&gt;Practice writing.&lt;/li&gt;
&lt;li&gt;Spend more time outside/with community.&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;Bullet Journaling&lt;/h2&gt;
&lt;p&gt;I took a bullet journaling class towards the beginning of the month. I&#39;ve been writing in it nearly everyday since, and so far I really love it!&lt;/p&gt;
&lt;p&gt;I&#39;ve been journaling on and off for years, but brainfog sometimes makes it hard for me to write in an expository manner. Bullet journaling lets me jump from topic to topic and write in short hand. It&#39;s not about writing &quot;properly&quot;, it&#39;s about jotting down what you need to remember and being able to find and read it later. It&#39;s about writing for yourself and only you! Bullet journaling also encourages the use of to-do lists and activity logs which is really helpful for a scatterbrained person like me. It helps me to actually, &lt;em&gt;visually&lt;/em&gt; see what I&#39;ve done so far and what I still need to do.&lt;/p&gt;
&lt;p&gt;I remember a long time ago I read a Tumblr post complaining about the &quot;gentrification&quot; of bullet journaling. Not sure if I agree with that wording, but I 100% agree with the sentiment. If you look online there&#39;s a lot of focus on color-coding everything, making it look presentable, or having it fit an &quot;aesthetic&quot;. I think a lot of that comes at the cost of it actually being functional. Of course, color-coding can actually serve a function in some cases, and there&#39;s nothing wrong with customizing or having fun with your journal. I don&#39;t even think there&#39;s anything wrong with making a purely-artistic &quot;journal&quot; that isn&#39;t meant to serve a practical function. I just think that it&#39;s important to let people know that you&#39;re not doing it &quot;wrong&quot; if your bullet journal &lt;em&gt;doesn&#39;t&lt;/em&gt; look like that.&lt;/p&gt;
&lt;p&gt;The more I think about it, I think I view journaling the same way I view making websites. Is there a word like &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://en.wikipedia.org/wiki/Progressive_enhancement&quot;&gt;progressive enhancement&lt;/a&gt; but for analog mediums? That&#39;s basically my philosophy on it, lol. For me, my bullet journal is a tool. I try to make it aesthetically pleasing when I can, but it is a tool first and foremost. My bullet journal is probably incomprehensible to anyone who isn&#39;t me, but so far it&#39;s gotten the job done!&lt;/p&gt;
&lt;h2&gt;CPR Certificate&lt;/h2&gt;
&lt;p&gt;I renewed my CPR license this month as part of my job. I already had one from my old job, but they only last two years and have to be renewed. Most of the training is online, but after that they make you come in and practice on one of those training dummies, to prove that you actually know how to do it. I think I did pretty well, I passed. I hope I&#39;m never actually &lt;em&gt;in&lt;/em&gt; an emergency situation like that, but it&#39;s reassuring to know what to do if it does happen.&lt;/p&gt;
&lt;h2&gt;Redoing My Website&lt;/h2&gt;
&lt;p&gt;I&#39;ve been working on redoing my website again!&lt;/p&gt;
&lt;p&gt;At first I was just making minor adjustments to my current site as I saw fit, but overtime I realized that there were so many issues, and a lot of them were very interconnected, it made more sense just to start over again from scratch.&lt;/p&gt;
&lt;p&gt;I feel conflicted about this. A lot of my current site works, it&#39;s accessible, it gets the job done. It&#39;s just not up to my personal standards I guess. One half of me is like &quot;if it ain&#39;t broke, don&#39;t fix it&quot; but the other half is worried about the upkeep and longevity of it. Like, yes, you &lt;em&gt;can&lt;/em&gt; watch a crappy TV with a coat hanger and paper clips attached to the antenna, but that&#39;s not a long term solution, is it? If you saw the backend of my site you&#39;d probably think it&#39;s the equivalent of that. Most of this site is held together by paperclips, duct tape, and a very poor understand of how nunjucks works. I want to fix that!&lt;/p&gt;
&lt;p&gt;I&#39;ll probably give more updates as I&#39;m closer to finishing it.&lt;/p&gt;
&lt;h2&gt;Media&lt;/h2&gt;
&lt;h3&gt;Watching&lt;/h3&gt;
&lt;p&gt;Me and my siblings have been watching the Sam Raimi Spiderman trilogy, which I have a post in the works about. Aside from that, I haven&#39;t been watching any movies or shows.&lt;/p&gt;
&lt;p&gt;Here&#39;s some YouTube videos I watched this month that I enjoyed:&lt;/p&gt;
&lt;h4&gt;The Fun Stuff&lt;/h4&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=ic_8M3OBPfs&quot;&gt;Todd in the Shadows Top Ten Best Hit Songs of 2025&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=pYeU0vE1f84&quot;&gt;People On Antiques Roadshow Cope With Disappointment In A Healthy Manner&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=Dbcr2uP9NvE&quot;&gt;How A Real Man Dances To Gourmet Race&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=M0qntG4d04k&quot;&gt;Chipmunk Raisins&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=zv-_eQTAUPU&quot;&gt;All of world one but every time a enemy dies it plays their obituary&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=hcFP42IYjaI&quot;&gt;The Worst and Weirdest of TableTop Simulator&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=9DnyzdkglEE&quot;&gt;Robotnik Sings Boulevard of Broken Dreams&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=Yfi65l0EmYU&quot;&gt;Cuphead vs Homer&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=B7av4-X1RD4&quot;&gt;A New Way to Worldbuild!!!! (Words to World)&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=YzIu-ZiA260&quot;&gt;Wizard Cooking vs Witch Cooking [culinary worldbuilding]&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;h4&gt;The Serious Stuff&lt;/h4&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=i5m-RHS1fU0&quot;&gt;This Is How You Get JARHEAD Sequels&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=Q5SFvOpolBU&quot;&gt;I Can&#39;t Forgive Aziz Ansari&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=kAyFd4GZC80&quot;&gt;These are NOT unprecedented times.&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=V3jGZq_ZnOQ&quot;&gt;Famine is a man-made problem&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;h3&gt;Listening to&lt;/h3&gt;
&lt;p&gt;I haven&#39;t been keeping up with or listening to too much new music either, to be honest, but here&#39;s some stuff I&#39;ve had on repeat lately:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=F7h3PTMioAU&quot;&gt;Danny Brown &amp;amp; underscores - Copycats&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=QgyW9qjgIf4&quot;&gt;Jane Remover - Dancing with your eyes closed&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=pYdRyFP_H-c&quot;&gt;Katy Perry - California Gurls (Dylan Brady remix)&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=3ctZ0MuCFuk&quot;&gt;Hayley Williams - Parachute&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.youtube.com/watch?v=WAo8X-rIt8k&quot;&gt;Charli xcx - claws&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;What I&#39;m Looking Forward to in February&lt;/h2&gt;
&lt;p&gt;Valentine&#39;s Day is coming up. I don&#39;t have any special plans for that day, I just think the way people decorate and dress up for it is cute. I like pink and hearts and stuff.&lt;/p&gt;
&lt;p&gt;The Super Bowl is a week from tomorrow. I&#39;m not really a sports person, but me and my family almost always watch the Super Bowl together. For the halftime show, if nothing else. Funnily enough, I don&#39;t think my dad will be able to watch it with us, and he&#39;s the only one of us who actually cares about football, lol.&lt;/p&gt;
&lt;p&gt;I&#39;m a pretty big Charli xcx fan and she&#39;s got her name attached to two movies coming out in February, The Moment and Wuthering Heights. She stars in the former while she&#39;s on the soundtrack for the latter. I thought The Moment was releasing in January, because that&#39;s what all the marketing said, but apparently it&#39;s only getting a limited release until February. At least, it&#39;s not playing at &lt;em&gt;my&lt;/em&gt; local theater until February. If my schedule and budget allows me I&#39;d love to see it in theaters! Likely won&#39;t be seeing Wuthering Heights in theaters, but I&#39;ve liked every single she&#39;s put out for the soundtrack so far. Looking forward to hearing the full thing.&lt;/p&gt;
&lt;h2&gt;Overall&lt;/h2&gt;
&lt;p&gt;Pretty productive month I guess. Could&#39;ve been better but I&#39;m trying not to be too hard on myself. Excited to see what February brings me!&lt;/p&gt;
&lt;p&gt;[^1]: I use &quot;mug&quot; instead of &quot;cup&quot; here very intentionally because, believe it or not, multiple people I talked to offline thought I meant &quot;exactly 8 fluid ounces of coffee&quot; when I said &quot;cup of coffee&quot;, when I actually mean &quot;one servings worth of coffee&quot;.&lt;/p&gt;
</description>
      <pubDate>Fri, 30 Jan 2026 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/january-2026-recap.html</guid>
    </item>
    <item>
      <title>Anti-ICE Resources</title>
      <link>https://sainthood.xyz/blog/posts/anti-ice-resources.html</link>
      <description>&lt;!--date: 2026-01-31T16:38:00--&gt;
&lt;p&gt;I considered adding these to my next post, but I think this is &lt;em&gt;really&lt;/em&gt; important and I don&#39;t want it to get buried underneath a bunch of unrelated stuff.&lt;/p&gt;
&lt;p&gt;These are some online resources I&#39;ve amassed over the last month or so related to protecting your community from ICE. Some are location specific while some aren&#39;t. Many of these are available in both English and Spanish, but some are available in other languages as well.&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://iceoutofny.org/&quot;&gt;ICE Out of New York&lt;/a&gt;- &quot;A coalition of immigrant rights organizations demanding an end to the brutal ICE operations in NY.&quot;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/drive.proton.me/urls/3BQTG29B88#46R7ocgiFwew&quot;&gt;MN Community Response Resources&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://monarcamn.org/&quot;&gt;MONARCA Rapid Response Line&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://iceout.org/en/&quot;&gt;People Over Papers&lt;/a&gt; - Tracks ICE activity&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.ilrc.org/redcards&quot;&gt;Red Cards&lt;/a&gt; - Printable cards that let you know your rights&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://drive.google.com/drive/folders/1zXBmpznTPPA1BiiWdvwE9w6R_lcA6zN9&quot;&gt;Resources for Whistle Warriors&lt;/a&gt; - Google Drive with resources on making, distributing, and using whistles. Also Includes zines and flyers that you can print out yourself!&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://tools.kyr.digital/en/&quot;&gt;tools.kyr.digital&lt;/a&gt; - Tools for immigration advocates
&lt;ul&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://salute.kyr.digital/en/&quot;&gt;SALUTE&lt;/a&gt; - Form for reporting ICE activity&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Not exclusive to ICE but still helpful:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.nlg.org/know-your-rights/&quot;&gt;National Lawyers Guild Know Your Risks&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.sanctuarycampus.org/&quot;&gt;Sanctuary Campus Network&lt;/a&gt; - &quot;A coalition of students, faculty, and staff organizing to protect and support those most vulnerable against state repression and violence under the current administration.&quot;&lt;/li&gt;
&lt;/ul&gt;
</description>
      <pubDate>Fri, 30 Jan 2026 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/anti-ice-resources.html</guid>
    </item>
    <item>
      <title>40 Questions for 2025</title>
      <link>https://sainthood.xyz/blog/posts/40-questions-for-2025.html</link>
      <description>&lt;p&gt;A little while ago I read Ava&#39;s &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://blog.avas.space/40-questions-2025/&quot;&gt;answering the 40 questions for 2025&lt;/a&gt;, where she answers Steph Ango&#39;s &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://stephango.com/40-questions&quot;&gt;40 questions to ask yourself every year&lt;/a&gt;. I thought it looked interesting, so this is my attempt at answering those same questions. Maybe this&#39;ll become a yearly tradition on my blog? Guess we&#39;ll just have to wait and see.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;h2&gt;1. What did you do this year that you’d never done before?&lt;/h2&gt;
&lt;p&gt;I visited my state&#39;s capital for the first time. I crocheted a whole, adult-sized cardigan! I also experienced a lot of &quot;firsts&quot; at my job this year, which I&#39;ll probably talk about more in the later questions.&lt;/p&gt;
&lt;h2&gt;2. Did you keep your new year’s resolutions?&lt;/h2&gt;
&lt;p&gt;No. I made the mistake of making a bunch of small resolutions instead of one big resolution, but I found having so many goals at once to be overwhelming. Next year I&#39;ll definitely try keeping things simple.&lt;/p&gt;
&lt;h2&gt;3. Did anyone close to you give birth?&lt;/h2&gt;
&lt;p&gt;No.&lt;/p&gt;
&lt;h2&gt;4. Did anyone close to you die?&lt;/h2&gt;
&lt;p&gt;Fortunately, no.&lt;/p&gt;
&lt;h2&gt;5. What cities/states/countries did you visit?&lt;/h2&gt;
&lt;p&gt;I visited some family out of state over the summer, and visited my state&#39;s capital earlier this year.&lt;/p&gt;
&lt;h2&gt;6. What would you like to have next year that you lacked this year?&lt;/h2&gt;
&lt;p&gt;I&#39;d like to get out more and generally have better social skills.&lt;/p&gt;
&lt;h2&gt;7. What date(s) from this year will remain etched upon your memory, and why?&lt;/h2&gt;
&lt;p&gt;I remember the exact date I started my new job, for some reason. Also, the date Charlie Kirk was shot, but that&#39;s just the day before 9/11, so I don&#39;t know if that really counts.&lt;/p&gt;
&lt;h2&gt;8. What was your biggest achievement of the year?&lt;/h2&gt;
&lt;p&gt;I got a new job! :)&lt;/p&gt;
&lt;h2&gt;9. What was your biggest failure?&lt;/h2&gt;
&lt;p&gt;I think there&#39;ve been times at work that I could&#39;ve done better, but I&#39;m choosing to view those as learning opportunities, since now I know what &lt;em&gt;not&lt;/em&gt; to do. Sometimes, you just have to learn from your mistakes.&lt;/p&gt;
&lt;h2&gt;10. What other hardships did you face?&lt;/h2&gt;
&lt;p&gt;I live in the US, so the political climate has been very stressful to deal with, to say the least. Me and my family have also been struggling with managing healthcare and insurance. Adjusting to my new job was also very difficult for me at first, I considered quitting after my first week, but I pulled through and that was 100% for the better.&lt;/p&gt;
&lt;h2&gt;11. Did you suffer illness or injury?&lt;/h2&gt;
&lt;p&gt;I had a few colds, but thankfully nothing serious and no major injuries.&lt;/p&gt;
&lt;h2&gt;12. What was the best thing you bought?&lt;/h2&gt;
&lt;p&gt;I&#39;m having trouble coming up with something practical, but as far as just &quot;things that made me stupidly happy&quot;; I bought a couple OuiOui plushies from itemLabel a while back. I put them on my shelf and every time I see them I can&#39;t help but smile the biggest goofiest smile.&lt;/p&gt;
&lt;h2&gt;13. Whose behavior merited celebration?&lt;/h2&gt;
&lt;p&gt;Considering how US politics are currently going, I&#39;m really proud of how my town has generally handled it. A lot of regular, everyday citizens have donated their time, money, and resources to protecting each other in a way I haven&#39;t really seen before. I feel very lucky to have the community that I do.&lt;/p&gt;
&lt;h2&gt;14. Whose behavior made you appalled?&lt;/h2&gt;
&lt;p&gt;The vast majority of US politicians. Also, some of my coworkers 😒.&lt;/p&gt;
&lt;h2&gt;15. Where did most of your money go?&lt;/h2&gt;
&lt;p&gt;A lot of it went into savings this year. Of the money I actually had access to, I was able to donate some money to charity, which I wasn&#39;t really able to do previously. As far as fun things go, I probably spent a more than I should&#39;ve on crafting supplies and fidget toys (I bought a mini nice cube just the other day).&lt;/p&gt;
&lt;h2&gt;16. What did you get really, really, really excited about?&lt;/h2&gt;
&lt;p&gt;To be honest, I had trouble feeling as excited as I should&#39;ve been about certain things. It&#39;s not like I wasn&#39;t excited, it was more like I just thought the words &quot;I&#39;m excited&quot; in my head without any of the bodily reactions (heartbeat racing, etc.). I&#39;m not really sure what to make of that.&lt;/p&gt;
&lt;p&gt;Here&#39;s a handful of things I told myself I was excited about, though:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Deltarune Chapters 3 and 4&lt;/li&gt;
&lt;li&gt;Rhythm Heaven in the Nintendo Direct&lt;/li&gt;
&lt;li&gt;The premiere of Pluribus &lt;span style=&quot;font-size:smaller;color:var(--color-translucent);&quot;&gt;(Rhea Seehorn my beloved &amp;lt;3)&lt;/span&gt;&lt;/li&gt;
&lt;li&gt;Wake Up Dead Man coming out&lt;/li&gt;
&lt;li&gt;My OuiOui blind bags coming in the mail&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;17. What song will always remind you of this year?&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;In terms of stuff that come out this year:&lt;/strong&gt; The Subway by Chappell Roan and anything of off Don&#39;t Tap the Glass by Tyler, the Creator.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;In terms of old stuff I listened to this year:&lt;/strong&gt; I guess you could consider You Lose! by Magdalena Bay and I Got My Tooth Removed by 100 Gecs my &quot;anthems&quot; for the year. They certainly bring me back to certain periods of my life, even if those periods were just a couple months ago.&lt;/p&gt;
&lt;h2&gt;18. Compared to this time last year, are you: happier or sadder? Richer or poorer? Healthier or unhealthier?&lt;/h2&gt;
&lt;p&gt;I&#39;m definitely happier and better off financially. I don&#39;t know if I&#39;m really &quot;healthier&quot; or not. I think in some ways I am and in some ways I&#39;m worse, so probably a lateral move overall.&lt;/p&gt;
&lt;h2&gt;19. What do you wish you’d done more of?&lt;/h2&gt;
&lt;p&gt;Engaging more in my hobbies (especially art), socializing more outside of work, being more active in my community, eating better, having better time management skills.&lt;/p&gt;
&lt;h2&gt;20. What do you wish you’d done less of?&lt;/h2&gt;
&lt;p&gt;Lurking social media (especially visiting pages that I &lt;em&gt;knew&lt;/em&gt; would just make me angry), constantly starting and restarting projects that I never actually finish, being so critical of myself.&lt;/p&gt;
&lt;h2&gt;21. How are you spending the holidays?&lt;/h2&gt;
&lt;p&gt;I spent Chrismukkah with my parents and siblings. My dad&#39;s family is Christian and my mom&#39;s family is Jewish, so we celebrate both Christmas and Hannukah. Both holidays went pretty well this year, I think. I helped my parents with some baking/cooking and I got everyone to play Jackbox on Christmas, which they seemed to enjoy.&lt;/p&gt;
&lt;p&gt;For New Year&#39;s, we&#39;re staying up till midnight, probably going to watch whatever countdown they have on TV, have some champagne. On New Year&#39;s Day we&#39;re planning on having brunch with some family friends.&lt;/p&gt;
&lt;h2&gt;22. Did you fall in love this year?&lt;/h2&gt;
&lt;p&gt;I become infatuated pretty easily, don&#39;t know if you&#39;d really call that &quot;love&quot;, though.&lt;/p&gt;
&lt;p&gt;In a more figurative sense, I&#39;ve realized I&#39;m more passionate about certain things than I thought I was. I&#39;d consider that a form of falling in love.&lt;/p&gt;
&lt;h2&gt;23. Do you hate anyone now that you didn’t hate this time last year?&lt;/h2&gt;
&lt;p&gt;I don&#39;t know, probably. It&#39;s hard to keep track nowadays.&lt;/p&gt;
&lt;h2&gt;24. What was your favorite show?&lt;/h2&gt;
&lt;p&gt;&lt;span style=&quot;font-size:smaller;&quot;&gt;(I&#39;m assuming the questions about media refer to stuff that came out/became popular in 2025.)&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;I don&#39;t keep up with TV/streaming. The only new show I watched this year was Pluribus, but I did thoroughly enjoy it, very much looking forward to season 2!&lt;/p&gt;
&lt;h2&gt;25. What was the best book you read?&lt;/h2&gt;
&lt;p&gt;I don&#39;t think I finished a single book this year. It&#39;s funny because I&#39;m pretty sure one of my mini-resolutions was to read more, lol.&lt;/p&gt;
&lt;h2&gt;26. What was your greatest musical discovery of the year?&lt;/h2&gt;
&lt;p&gt;I&#39;m not that adventurous when it comes to music. I&#39;m not really sure there&#39;s anyone I&#39;m consistently listening to this year who I wasn&#39;t listening to last year.&lt;/p&gt;
&lt;h2&gt;27. What was your favorite film?&lt;/h2&gt;
&lt;p&gt;I really enjoyed Wake Up Dead Man! Big fan of the Knives Out series in general.&lt;/p&gt;
&lt;h2&gt;28. What was your favorite meal?&lt;/h2&gt;
&lt;p&gt;I&#39;ve really been enjoying scrambled eggs, recently. You throw in a bunch of spinach and whatever other vegetables you have laying around, you got all the vitamins you need for your whole day right there.&lt;/p&gt;
&lt;p&gt;My mom&#39;s also been making a lot of pastries lately. She&#39;s got a sourdough starter and has been nice enough to share what she makes with the rest of us. She made these wonderful peanut butter cookies over the holidays.&lt;/p&gt;
&lt;h2&gt;29. What did you want and get?&lt;/h2&gt;
&lt;p&gt;A new job, more direction in my life, more offline connections.&lt;/p&gt;
&lt;h2&gt;30. What did you want and not get?&lt;/h2&gt;
&lt;p&gt;Better health insurance...&lt;/p&gt;
&lt;h2&gt;31. What did you do on your birthday?&lt;/h2&gt;
&lt;p&gt;Got lunch with some relatives, fed the ducks at a local pond (birdseed, not bread!), and got some very thoughtful gifts from my siblings.&lt;/p&gt;
&lt;h2&gt;32. What one thing would have made your year immeasurably more satisfying?&lt;/h2&gt;
&lt;p&gt;Being able to be more open with people, and having more things within walking distance/distance of public transportation.&lt;/p&gt;
&lt;h2&gt;33. How would you describe your personal fashion this year?&lt;/h2&gt;
&lt;p&gt;Most days I just wore my work clothes. When I&#39;m not working I&#39;m pretty casual, maybe with a couple low-key accessories to keep things fun.&lt;/p&gt;
&lt;h2&gt;34. What kept you sane?&lt;/h2&gt;
&lt;p&gt;Remembering that there are people worth fighting for, people worth protecting. If you can&#39;t do it for yourself, then at least try to do it for them.&lt;/p&gt;
&lt;h2&gt;35. Which celebrity/public figure did you admire the most?&lt;/h2&gt;
&lt;p&gt;I don&#39;t know if this is weird, or &quot;cringe&quot;, or a &quot;hot take&quot;, or whatever, but I genuinely admire Chappell Roan &lt;em&gt;so&lt;/em&gt; much.&lt;/p&gt;
&lt;p&gt;She&#39;s a great artist who seems like a decent person and has based politics. Every time I worry about being &quot;too dykey&quot; or too annoying I just think about Chappell Roan and all the misogynistic, homophobic weirdos on the internet who keep telling her to shut up and I&#39;m like &quot;you know what, I should be even &lt;em&gt;dykier&lt;/em&gt; and even &lt;em&gt;more annoying&lt;/em&gt;!&quot;. Why should I bother making myself more palatable to people who were never going to like me in the first place?&lt;/p&gt;
&lt;h2&gt;36. What political issue stirred you the most?&lt;/h2&gt;
&lt;p&gt;Oh god, there&#39;s a lot. The genocide in Gaza, ICE raids, and trans healthcare, especially for trans youth, have been at the top of mind for me lately.&lt;/p&gt;
&lt;h2&gt;37. Who did you miss?&lt;/h2&gt;
&lt;p&gt;My paternal grandmother. This was our second Christmas since she passed. She used to come to visit us every year for the holidays, it feels very empty without her around.&lt;/p&gt;
&lt;h2&gt;38. Who was the best new person you met?&lt;/h2&gt;
&lt;p&gt;One of my new friends/coworkers! I&#39;ve gotten along with my coworkers at previous jobs, but I was never really friends with any of them. It&#39;s nice to have someone who actually wants to talk to you outside of work, and about non-work/non-small-talk topics.&lt;/p&gt;
&lt;h2&gt;39. What valuable life lesson did you learn this year?&lt;/h2&gt;
&lt;p&gt;That I can trust my own judgement a lot more than I thought I could. To have more confidence in myself.&lt;/p&gt;
&lt;h2&gt;40. What is a quote that sums up your year?&lt;/h2&gt;
&lt;p&gt;The first two quotes that comes to mind are &lt;q&gt;Life&#39;s a bitch and you keep on living&lt;/q&gt; and &lt;q&gt;Be the person you needed when you were young&lt;/q&gt;&lt;/p&gt;
&lt;p&gt;I know the first one probably sounds negative to most people, but I don&#39;t really see it that way. I think of it being more about resiliency. Life&#39;s a bitch, but it won&#39;t kill you. If we all just gave up every time life was a bitch, the human species would have gone extinct by now. You have to find a reason to keep living in spite of it all.&lt;/p&gt;
&lt;p&gt;The second one is probably self explanatory. I interpret it as being for the benefit of both your current self &lt;em&gt;and&lt;/em&gt; other people, but most people I see mostly interpret it as being for the benefit of others.&lt;/p&gt;
</description>
      <pubDate>Mon, 29 Dec 2025 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/40-questions-for-2025.html</guid>
    </item>
    <item>
      <title>Ranking Latke Condiments</title>
      <link>https://sainthood.xyz/blog/posts/ranking-latke-condiments.html</link>
      <description>&lt;p&gt;Merry Chrismukkah! The other night was the last night of Hannukah, but my family didn&#39;t do much to celebrate. We made up for it a little today by making latkes for Christmas Eve. I thought it&#39;d be fun to rank/review some of the things you can put on your latkes, so without further ado here we go:&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;h2&gt;Ketchup&lt;/h2&gt;
&lt;p&gt;I guess this one makes sense in theory. You eat ketchup with other potato-based foods, why not latkes? Unfortunately, it&#39;s not very good in practice. The ketchup overpowers most of the flavor of the latke, so you just feel like you&#39;re eating ketchup with a little bit of extra texture.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Verdict&lt;/strong&gt;: 3/10&lt;/p&gt;
&lt;h2&gt;Nothing&lt;/h2&gt;
&lt;p&gt;Nothing wrong with eating your latke plain. Of course, that means your meal will only be as good as the latke itself. Latkes made from scratch are usually better than ones made from a box, and there&#39;re different recipes you can follow, so there&#39;s some variation there. Still, even if you&#39;re eating the best plain latke ever, I feel like I shouldn&#39;t rank literal nothingness that high.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Verdict&lt;/strong&gt;: 5/10&lt;/p&gt;
&lt;h2&gt;Hot Sauce&lt;/h2&gt;
&lt;p&gt;I didn&#39;t try this one. I&#39;m only bringing it up because my dad, who&#39;s not even Jewish, saw someone on Instagram putting hot sauce on their latkes and was just so appalled by it. I thought that was pretty funny. I don&#39;t mind spicy food, but I tend not to like hot sauce because I don&#39;t like vinegar, so I don&#39;t know if I&#39;d like it on latkes or not. Maybe I&#39;ll have to try it next year?&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Verdict&lt;/strong&gt;: honorable mention/10&lt;/p&gt;
&lt;h2&gt;Sour Cream&lt;/h2&gt;
&lt;p&gt;I generally like sour cream. I think it&#39;s alright on latkes. It&#39;s not my favorite thing to put on them, but I&#39;ll have some if it&#39;s there. I think sometimes it can overpower the flavor of the latke if you&#39;re not too careful about portions, but I don&#39;t mind it as much as I do with ketchup, because sour cream better matches the flavor profile of a latke.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Verdict&lt;/strong&gt;: 7/10&lt;/p&gt;
&lt;h2&gt;Apple Sauce&lt;/h2&gt;
&lt;p&gt;Latkes just feel so naked without apple sauce. The sweetness of the apple sauce balances with the sharp flavor of the onion and pepper from the latke. If you&#39;re eating them fresh out of the pan, then the coldness of the refrigerated apple sauce also helps cool it down.&lt;/p&gt;
&lt;p&gt;Maybe a hot take, but I think apple sauce goes well with other potato-based food, too. Sometimes I like to dip my potato wedges in them. But I guess society just isn&#39;t ready for that yet.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Verdict&lt;/strong&gt;: 9/10&lt;/p&gt;
</description>
      <pubDate>Tue, 23 Dec 2025 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/ranking-latke-condiments.html</guid>
    </item>
    <item>
      <title>Blogging vs Brain Fog</title>
      <link>https://sainthood.xyz/blog/posts/blogging-vs-brain-fog.html</link>
      <description>&lt;p&gt;Sometimes I&#39;ll mention struggling with brain fog to people and they&#39;ll respond something like &quot;ugh, I know right, I hate when that happens 🙄&quot; as if I told them someone cut in front of me at the grocery store. I don&#39;t know how to make them understand that this isn&#39;t a minor inconvenience to me, it&#39;s debilitating. There are certain days where it&#39;s so bad, that I straight up can&#39;t get anything done. Where doing basic tasks or holding a basic conversation is a challenge for me.&lt;/p&gt;
&lt;p&gt;It&#39;s come to a point recently where it&#39;s not just impacting stuff like chores or work, even just trying to engage in hobbies feels like too much sometimes. Blogging should be so easy for me. It&#39;s literally just typing into a box. It should be so. Damn. &lt;strong&gt;Easy&lt;/strong&gt;. And yet, every time I sit down to do it, I feel like I can&#39;t think clearly.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;&quot;Well if you streamlined your website workflow...&quot; My workflow isn&#39;t complicated. All my posts are written in Markdown, the only time I run into hiccups is if I have to use certain HTML elements. The issue for me isn&#39;t formatting the text, it&#39;s coming up with the right words, it&#39;s thinking clearly about any given topic for more than a minute.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;I recently learned about the &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://100daystooffload.com/&quot;&gt;100 Days To Offload Challenge&lt;/a&gt;, a challenge for personal bloggers to publish 100 posts in the span of a year. There are no strict start or end dates, that span of 365 days can start whenever you want it to.&lt;/p&gt;
&lt;p&gt;When I first read about it a little part of my brain said &quot;oh, I could totally do that!&quot; and started brainstorming ways I could make it work. I have over 100 unfinished drafts in Obsidian. The challenge could then just be a matter of finishing/polishing as many of them as possible. I also started thinking that it might be helpful to set up a consistent schedule for blogging.&lt;/p&gt;
&lt;p&gt;It was at this point that I realized I was considering turning my hobby into a job, which is not what I ever intended my little hobby site to be. Obviously I wouldn&#39;t be making money from it, but I mean more so in the sense of setting so many expectations for myself. Setting up deadlines and quotas. Not that any of that even matters, because I&#39;m not able to form a coherent thought most of the time, anyway.&lt;/p&gt;
&lt;p&gt;The more I thought about it, the more I started feeling really disappointed in myself. I couldn&#39;t help but compare myself to all the bloggers I know who put out long, well-written content on a near-daily basis&lt;/p&gt;
&lt;p&gt;I looked at my post archive and I felt disappointed with myself that I was only able to get 13 posts out all year. The toxic positivity part of my brain wants to spin it around. &quot;You managed to still get stuff out, even when you weren&#39;t feeling well, you should be proud of yourself!&quot; Another part of my brain just wants me to shut up, because it&#39;s not like any of this really matters anyway. &quot;It&#39;s not that serious, stop whining about it!&quot;.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;It&#39;s not just writing posts, it&#39;s reading other peoples blogs too. Sometimes I have trouble fully understanding what other people are talking about. For longer posts or posts that discuss more complicated topics, I usually use text-to-speech to read the post out loud to me. It can sometimes be easier for me to understand spoken language over text, but that doesn&#39;t guarantee full comprehension. It&#39;s a lot of listening to and replaying the same paragraph over and over again until I either fully understand or I give up.&lt;/p&gt;
&lt;p&gt;Sometimes I get the feeling that people in my personal life think I&#39;m stupid.  I don&#39;t think people fully understand how embarrassing it is to be an adult who can&#39;t do &quot;basic&quot; things some of the time. I don&#39;t think they understand how embarrassing it is to have to ask other grown adults for help so often, or having to constantly ask people to please be patient with you.&lt;/p&gt;
&lt;p&gt;If you think that&#39;s bad, imagine how it feels when I&#39;m trying to read &lt;em&gt;actual&lt;/em&gt; books. Imagine how it felt trying to read books for school, especially when I got to college. All the constant &quot;READING COMPREHENSION IS DEAD 🤪&quot; &quot;jokes&quot; on social media don&#39;t help either.&lt;/p&gt;
</description>
      <pubDate>Sat, 20 Dec 2025 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/blogging-vs-brain-fog.html</guid>
    </item>
    <item>
      <title>Generative AI and the Illusion of Free Choice</title>
      <link>https://sainthood.xyz/blog/posts/generative-ai-and-the-illusion-of-free-choice.html</link>
      <description>&lt;p&gt;I&#39;ve seen a few different people talk about the uprise of the &quot;zero-click internet&quot;. For those unfamiliar, in a nutshell the &quot;zero-click internet&quot; refers to how search engines now use AI summaries to answer questions, so users don&#39;t actually have to click on links or visit sites anymore.&lt;/p&gt;
&lt;p&gt;There are obviously a lot of problems with this. &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.reddit.com/r/atetherock/&quot;&gt;AI overviews are notoriously buggy&lt;/a&gt;. They often get stuff wrong and the sources for said info is often missing or misattributed, but you probably already knew that. Smarter people than me have already pointed all of this out and analyzed it in depth.&lt;/p&gt;
&lt;p&gt;Something I haven&#39;t seen as many talk about, however, is that even if you turn AI summaries off, the search results still suck.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;I have AI disabled on pretty much everything I own, including search engines. I don&#39;t like it and, like I said, half the time the info is wrong anyway, so there&#39;s no point in leaving it on.&lt;/p&gt;
&lt;p&gt;A situation I run into a lot is I&#39;ll have a question, so I&#39;ll search for it. For example, the other day I searched &quot;why do horses lick salt rocks?&quot;. Several websites came up, I clicked on a handful of them. One of them gave me a malware warning, the rest were full of (probably AI-generated) prose that didn&#39;t even answer my question. Each website takes an inordinate amount of time to load and when I inspect element there&#39;s a ton of scripts running in the background (likely some kind of analytics).&lt;/p&gt;
&lt;p&gt;Unfortunately, most modern sites misuse &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://en.wikipedia.org/wiki/Semantic_HTML&quot;&gt;semantic HTML&lt;/a&gt; in an attempt to raise their &lt;abbr title=&quot;search engine optimization&quot;&gt;SEO&lt;/abbr&gt;. For example, if you search for &quot;horse&quot;, google is more likely to show you pages that have &quot;horse&quot; in the page title or in one of the pages headings. In theory, this is a great idea. It places weight on keywords depending on their semantic role.  Sites about horses are more likely to have &quot;horse&quot; somewhere important like that. It prioritizes sites that are actually &lt;em&gt;focused&lt;/em&gt; on horses, rather than sites that just offhandedly mention the word somewhere in a random paragraph. In practice, however, many sites have abused this to get higher in search results.&lt;/p&gt;
&lt;p&gt;So, what you end up with are these massive pages with dozens of headings that sort of resemble FAQ pages at a glance, but once you actually start reading them you realized most of it is meaningless fluff, likely written by an &lt;abbr title=&quot;large language model&quot;&gt;LLM&lt;/abbr&gt;. They have &quot;why do horses lick salt rocks?&quot; as one of the headings, so it comes up in search results, but none of the text on the page actually answers the question. Someone (or more likely, some kind of bot) found the most common horse questions and formatted it into a website that they can place a bunch of ads onto.&lt;/p&gt;
&lt;p&gt;Eventually I just gave up and headed over to Wikipedia instead. I went to the article on horses, which links to the article on &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://en.wikipedia.org/wiki/Equine_nutrition&quot;&gt;equine nutrition&lt;/a&gt;. That article cites &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.extension.purdue.edu/extmedia/as/as-429.html&quot;&gt;Nutritional Management for Horses&lt;/a&gt; from Purdue University&#39;s Cooperative Extension Service. Here&#39;s an excerpt:&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;&quot;Salt (NaCl) aids the [horse&#39;s] body in fluid and temperature regulation. In hot weather, the temperature of the body is controlled by sweating. Water, salt, and other minerals are given off and need to be replenished. The salt intake of a horse is directly proportional to the water intake.&quot;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;Finally, an answer to my question!&lt;/p&gt;
&lt;p&gt;However, most people aren&#39;t going to be as diligent as I was. Sure, I only clicked three links, that might not seem like a lot, but most people want their answers &lt;em&gt;immediately&lt;/em&gt;, they don&#39;t even want to have to click &lt;em&gt;one&lt;/em&gt; link. I imagine a lot of people will just get frustrated and turn AI summaries back on, if they ever had them turned off in the first place.&lt;/p&gt;
&lt;p&gt;Some of the sources Wikipedia uses are only accessible via the &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://web.archive.org/&quot;&gt;Wayback Machine&lt;/a&gt;, so they wouldn&#39;t show up via normal search indexing anyway. The only reliable ways of finding them is through Wikipedia or the Internet Archive itself.&lt;/p&gt;
&lt;p&gt;The funny thing is, if you use the AI summary and check the source, it&#39;s almost always either Wikipedia, Reddit, or one of those &lt;abbr title=&quot;search engine optimization&quot;&gt;SEO&lt;/abbr&gt; spam sites. It&#39;s sites with AI-generated content, being skimmed and summarized by an AI. If you turn off the AI summaries, you still have to deal with the websites it would be sourcing from. No matter what you do, it&#39;s all AI.&lt;/p&gt;
&lt;figure&gt;
	&lt;img src=&quot;https://sainthood.xyz/assets/images/acjtnk.jpg&quot; alt=&quot;The illusion of free choice&quot;&gt;
	&lt;figcaption&gt;
		A drawing with the text &quot;The illusion of free choice&quot;. It shows a cow in front of a maze with two entrances. One entrance is labeled &quot;reading a shitty AI summary&quot; and the other is labeled &quot;reading a shitty AI-generated website&quot;. Both paths of the maze lead to the same place, which is labeled &quot;Reading Shitty AI&quot;.
	&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;The reason I write all of this is because I think some people have this misconception that if you don&#39;t like AI you can just choose not to engage with it. Just adjust the settings, just don&#39;t visit sites you don&#39;t like, etc, etc. I don&#39;t know how else to explain that I already tried that, they&#39;re literally &lt;em&gt;everywhere&lt;/em&gt;, no matter what you do, even the most basic of questions.&lt;/p&gt;
&lt;p&gt;I fucking hate it.&lt;/p&gt;
&lt;h2&gt;Addendum 2025-12-02&lt;/h2&gt;
&lt;p&gt;Apparently, &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://en.wikipedia.org/wiki/Wikipedia:Large_language_models&quot;&gt;Wikipedia has started allowing AI generated content in their articles&lt;/a&gt;. In fairness, they&#39;re a lot more nuanced about it than other sites are. They don&#39;t allow AI to write whole articles from scratch, but do allow it for things like copyediting. All AI-made edits still have to go through the same approval process as any human-made edits.&lt;/p&gt;
&lt;p&gt;I still have some concerns, though. If an &lt;abbr title=&quot;large language model&quot;&gt;LLM&lt;/abbr&gt; gets its data by scraping Wikipedia articles, and then people use that &lt;abbr title=&quot;large language model&quot;&gt;LLM&lt;/abbr&gt; to edit Wikipedia, is that not just an ouroboros of information? People usually talk about &quot;AI inbreeding&quot; with respect to generated photo or video, but does that not also apply to text? Not trying to be a smartass, I&#39;m genuinely asking.&lt;/p&gt;
</description>
      <pubDate>Wed, 19 Nov 2025 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/generative-ai-and-the-illusion-of-free-choice.html</guid>
    </item>
    <item>
      <title>The Beta PawBorough Experience</title>
      <link>https://sainthood.xyz/blog/posts/the-beta-pawborough-experience.html</link>
      <description>&lt;p&gt;In 2022, one of my friends told me about a Kickstarter for a then-upcoming, browser-based game called &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.pawborough.net&quot;&gt;PawBorough&lt;/a&gt;. The pitch was basically &quot;Flight Rising, but with cats&quot;, I was immediately hooked!&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;The gameplay centers around managing a clan of cats living in a fantastical setting. You can craft items, go on combat missions, dress up your cats, and breed your cats together to make even more cats! The art and game mechanics are heavily inspired by the Warrior Cats book series, with many of artists working on the game being former Warriors fanartists. I used to play Flight Rising (along with a handful of other animal-based browser games) quite a bit, and I had a huge Warrior Cat phase when I was a teen. This is really just a dream combination for me.&lt;/p&gt;
&lt;p&gt;Obviously, I supported the Kickstarter. One of my backer rewards was an access code that let me make an account while the site is still in closed beta testing. Technically, I was a little late to the party. I rarely ever check the email that my reward code was sent to, so by the time I made my account some users had already been there for months.&lt;/p&gt;
&lt;p&gt;I&#39;m also at a slight disadvantage because I&#39;m believe most of the beta testers are communicating through the official PawBorough Discord server. I completely refuse to use Discord unless I absolutely have to, but that&#39;s a rant for another day. My point is that the on-site forums and help center aren&#39;t as active as I&#39;d like them to be, because people are probably just using the Discord instead to get updates about the game and interact with other players.&lt;/p&gt;
&lt;h2 id=&quot;resets&quot;&gt;My First Clan and Account Resets&lt;/h2&gt;
&lt;p&gt;The game devs made it very clear from the beginning that there&#39;d be multiple stages of development and peoples accounts would more or less be reset before each of them, so beta testers shouldn&#39;t get too attached to their cats and items. In-game items given as backer rewards can be redeemed multiple times, once per each stage of development.&lt;/p&gt;
&lt;p&gt;I started playing the game in march of 2025, played the game for a couple months, then lost interest for another few months, only to randomly remember and log back into the game the other day. When I logged back in I saw that my account had been reset, but I honestly wasn&#39;t upset about it.&lt;/p&gt;
&lt;p&gt;When I first started playing the game for the first time I was more concerned with just messing around with all the features and figuring out how they work. I didn&#39;t become super attached to any of my cats or bother giving them much &quot;lore&quot;. I think a lot of the fun with these kinds of games is the roleplaying element, so I was honestly kind of relieved to be given a second chance.&lt;/p&gt;
&lt;p&gt;I think I still have a few screenshots of some of my old cats somewhere, but honestly I don&#39;t think people would be that interested.&lt;/p&gt;
&lt;h2 id=&quot;misfitclan&quot;&gt;Meet Misfitclan&lt;/h2&gt;
&lt;p&gt;Okay so, on to my new and improved clan, &lt;strong&gt;Misfitclan&lt;/strong&gt;!&lt;/p&gt;
&lt;figure&gt;
	&lt;img src=&quot;https://sainthood.xyz/assets/images/Pawborough-2025-10-30.png&quot; alt=&quot;Screenshot of my five starting cats and their info&quot;&gt;
	&lt;figcaption&gt;
		&lt;details&gt;
			&lt;summary&gt;In-depth Info&lt;/summary&gt;
			&lt;strong&gt;Tigerstripe&lt;/strong&gt;
			&lt;ul&gt;
				&lt;li&gt;&lt;strong&gt;Pronouns:&lt;/strong&gt; She/They/He&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Role:&lt;/strong&gt; Leader&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Sex:&lt;/strong&gt; Female&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Native Borough:&lt;/strong&gt; Abyssal&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Nature:&lt;/strong&gt; Jolly&lt;/li&gt;
			&lt;/ul&gt;
			&lt;strong&gt;Melonleaf&lt;/strong&gt;
			&lt;ul&gt;
				&lt;li&gt;&lt;strong&gt;Pronouns:&lt;/strong&gt; They/She/It&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Role:&lt;/strong&gt; Scholar&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Sex:&lt;/strong&gt; Female&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Native Borough:&lt;/strong&gt; Abyssal&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Nature:&lt;/strong&gt; Careful&lt;/li&gt;
			&lt;/ul&gt;
			&lt;strong&gt;Clouddrop&lt;/strong&gt;
			&lt;ul&gt;
				&lt;li&gt;&lt;strong&gt;Pronouns:&lt;/strong&gt; He/They/She&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Role:&lt;/strong&gt; Fisherman&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Sex:&lt;/strong&gt; Male&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Native Borough:&lt;/strong&gt; Luna&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Nature:&lt;/strong&gt; Jolly&lt;/li&gt;
			&lt;/ul&gt;
			&lt;strong&gt;Moleclaw&lt;/strong&gt;
			&lt;ul&gt;
				&lt;li&gt;&lt;strong&gt;Pronouns:&lt;/strong&gt; He/Him&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Role:&lt;/strong&gt; Hunter&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Sex:&lt;/strong&gt; Male&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Native Borough:&lt;/strong&gt; Abyssal&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Nature:&lt;/strong&gt; Heroic&lt;/li&gt;
			&lt;/ul&gt;
			&lt;strong&gt;Sweetwhisker&lt;/strong&gt;
			&lt;ul&gt;
				&lt;li&gt;&lt;strong&gt;Pronouns:&lt;/strong&gt; They/It&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Role:&lt;/strong&gt; Forager&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Sex:&lt;/strong&gt; Female&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Native Borough:&lt;/strong&gt; The Metropolis&lt;/li&gt;
				&lt;li&gt;&lt;strong&gt;Nature:&lt;/strong&gt; Lonely&lt;/li&gt;
			&lt;/ul&gt;
		&lt;/details&gt;
	&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;For this playthrough I chose Abyssal as my Borough. Boroughs are the different sections of the map with their own geography and cultures. Gameplay-wise, they don&#39;t do much, all they do is give your cat a certain eye color (cats from Abyssal always have pink and/or purple eyes), but they give you a great jumping off point for roleplaying! Since Abyssal cats are described as being sea-faring explorers, I&#39;ve been thinking of my clan as being kind of like a pirate crew. The details are still foggy though.&lt;/p&gt;
&lt;p&gt;When you start the game you have to create your “founders”, which are two cats that you get to customize! Except for the cats sex, for some reason. Since my first playthrough&#39;s founders were one male and one female, I assumed that founders would &lt;em&gt;always&lt;/em&gt; be a male and a female, to insure that the player has at least one pair for the games breeding mechanics. I guess I was wrong.&lt;/p&gt;
&lt;div class=&quot;flexcontainer&quot;&gt;
	&lt;div class=&quot;half&quot;&gt;
			&lt;img src=&quot;https://sainthood.xyz/assets/images/cat_143300_1761846386_webp.png&quot; alt=&quot;Tigerstripe&#39;s Portrait&quot;&gt;
	&lt;/div&gt;
	&lt;div class=&quot;half&quot;&gt;
			&lt;img src=&quot;https://sainthood.xyz/assets/images/cat_143301_1761846536_webp.png&quot; alt=&quot;Melonleaf&#39;s Portrait&quot;&gt;
	&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;That&#39;s still not gonna stop me from shipping my founders together, though! They&#39;re lesbian lovers in my mind. I guess the tomcats will just have to be sperm donors. Or maybe all of the cats are just in one big polycule. I guess we&#39;ll have to wait and see.&lt;/p&gt;
&lt;p&gt;Anyway, Tigerstripe (yes, I&#39;m sticking to Warrior Cat naming conventions) is a big, strong doofus! Like if a himbo was a butch lesbian and also a cat. She&#39;s the leader/captain of the clan and does most of the physical labor. She&#39;s very caring and means well, but can be very oblivious at times.&lt;/p&gt;
&lt;p&gt;Her girlfriend Melonleaf is very much the opposite, overly cautious and stuck in their own head. They&#39;re also the clans deputy/first mate. I don&#39;t know what the &quot;scholar&quot; role actually does in-game, but I feel like most leaders have some kind of consultant, and &quot;scholar&quot; sounded like it&#39;d be the closest thing to that.&lt;/p&gt;
&lt;div class=&quot;flexcontainer&quot;&gt;
	&lt;div class=&quot;third&quot;&gt;
		&lt;img src=&quot;https://sainthood.xyz/assets/images/cat_143302_1761846682_webp.png&quot; alt=&quot;Clouddrop&#39;s Portrait&quot;&gt;
	&lt;/div&gt;
	&lt;div class=&quot;third&quot;&gt;
		&lt;img src=&quot;https://sainthood.xyz/assets/images/cat_143303_1761846106_webp.png&quot; alt=&quot;Moleclaw&#39;s Portrait&quot;&gt;
	&lt;/div&gt;
	&lt;div class=&quot;third&quot;&gt;
		&lt;img src=&quot;https://sainthood.xyz/assets/images/cat_143304_1761847142_webp.png&quot; alt=&quot;Sweetwhisker&#39;s Portrait&quot;&gt;
	&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;The rest of your clan is randomly generated for you. You have the option to reroll for a set of different random cats, but you can&#39;t edit them, or go back to previous cats you generated. These are the cats that I eventually settled on.&lt;/p&gt;
&lt;p&gt;The story in my head so far is that all of my cats are outcasts in some way, and were lucky enough to find each other, hence the name &quot;Misfitclan&quot;. Since Clouddrop and Sweetwhisker are from different Boroughs, maybe they were exiled from their original clans and somehow ended up in Abyssal territory? A lot of story potential there.&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/pawboroughmorecats.png&quot; alt=&quot;Screenshot of the six random cats that I adopted&quot;&gt;&lt;/p&gt;
&lt;p&gt;Eventually, I adopted a bunch more cats from another player. I didn&#39;t really bother giving them lore or anything, but that may change in the future. Their main job is to help with territory ground duties. The more cats you have to help you out, the better!&lt;/p&gt;
&lt;h2 id=&quot;guild&quot;&gt;The Guild&lt;/h2&gt;
&lt;p&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/pawboroughcombat.png&quot; alt=&quot;Screenshot from my gameplay of one of the guild missions&quot;&gt;&lt;/p&gt;
&lt;p&gt;Right now, the main way of unlocking new items is via guild missions. Every cat has stats and completing more successful missions levels them up. Each mission has it&#39;s own difficulty. The more difficult missions you do, the rarer the items you get.&lt;/p&gt;
&lt;p&gt;You have the option to start your own guild or join another players. During my first playthrough, the game glitched whenever I tried to make my own guild and seemingly forced me to join another player&#39;s. This time it&#39;s doing the opposite.&lt;/p&gt;
&lt;p&gt;I like PawBorough&#39;s combat system a lot, a lot more than Flight Rising&#39;s at least! Flight Rising has a Pokémon-like type system, which can get very tedious after a while. Once you know which type is strongest against another, you just spam the same attack over and over. PawBorough seems to be going for a more Fire Emblem-style, strategy RPG type of combat.&lt;/p&gt;
&lt;p&gt;I also like how combat stats affect things outside of guild quests. For example, having a higher strength stat makes a cat better at getting certain items in other parts of the game. It makes everything feel more connected.&lt;/p&gt;
&lt;figure class=&quot;small right&quot;&gt;
	&lt;img src=&quot;https://sainthood.xyz/assets/images/pawboroughtrapped.png&quot; alt=&quot;Screenshot of one of my cats trapped in the corner by a bunch of rocks during a guild mission&quot;&gt;
	&lt;figcaption&gt;&lt;p&gt;This happened to me several times.&lt;/p&gt;&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;Recently, the dev have added objects to the guild mission maps: rocks that block your path, thorns that hurt you, and hay that gives you a stat boost.&lt;/p&gt;
&lt;p&gt;Since the game is still in beta, the game has a lot of glitches and oversights, but I imagine these will improve as development goes on. I&#39;m not sure if this is actually a glitch or if I just have really bad luck, but for about 1 of out 4 maps that generate for me my cat will just spawn inside a wall of rocks and be unable to move. All I can do is skip my turn several times, wait for the enemy to get close enough to me (enemies ignore all objects), and hope I can kill it by just spamming my attack over and over. I usually beat these fights, but they&#39;re still really annoying.&lt;/p&gt;
&lt;h2 id=&quot;genes&quot;&gt;Genetics and Breeding&lt;/h2&gt;
&lt;p&gt;A big draw of these animal games to me is the breeding mechanics. Put two weird looking animals together and see what they make! Right now it&#39;s not as exciting, because all of my cats are pretty basic, and a lot of the more fantastical features are still in development.&lt;/p&gt;
&lt;p&gt;Pelt colors work similarly to how they do in Flight Rising. Each cat has a set of color genes. When two cats are breed together, the game finds the shortest path between the parents genes on the color wheel, and the kittens can have any color in that section of the wheel.&lt;/p&gt;
&lt;p&gt;I don&#39;t fully understand how kittens inherit other traits, like pelt patterns or accents, yet. I think some traits might be rarer than others and given different probability weights, but I&#39;m not 100% sure. Even if I was, the devs could always change it, since it&#39;s so early in development. I think eye pattern and eye palette (not to be confused with eye &lt;em&gt;color&lt;/em&gt;, which is determined by the borough the cat is born into), might just be totally random.&lt;/p&gt;
&lt;figure&gt;
	&lt;div class=&quot;flexcontainer&quot;&gt;
		&lt;div class=&quot;third&quot;&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/melonleafblueflowers.png&quot; alt=&quot;Melonleaf with teal flowers on their back&quot;&gt;&lt;/div&gt;
		&lt;div class=&quot;third&quot;&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/melonleafpinkflowers.png&quot; alt=&quot;Melonleaf with pink and orange flowers on their back&quot;&gt;&lt;/div&gt;
	&lt;/div&gt;
	&lt;figcaption&gt;&lt;p&gt;Melonleaf with the overgrowth blossom accent. The first image uses their accent 1, while the second image uses their accent 2. Because their current accent 2 is skin, the second image also changes the color of their nose and ears.&lt;/p&gt;&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;Something cool about PawBorough is that cats have multiple accent colors and accent genes can be applied to either of them. It gives you more options for breeding and customization, which is always a plus! It also means that if you breed a kitten with an accent color you don&#39;t like, you can always try the other one instead.&lt;/p&gt;
&lt;h2 id=&quot;random&quot;&gt;Other Random Observations&lt;/h2&gt;
&lt;h3 id=&quot;farming&quot;&gt;Farming&lt;/h3&gt;
&lt;p&gt;The devs have added some highly anticipated features in the latest reset. You can now raise livestock and tend to crops, which leads to new items and recipes that were previously unobtainable and gives purpose to the farmer role.&lt;/p&gt;
&lt;h3 id=&quot;withering&quot;&gt;Withering&lt;/h3&gt;
&lt;figure class=&quot;small right&quot;&gt;
	&lt;img src=&quot;https://sainthood.xyz/assets/images/pawboroughwithering.png&quot; alt=&quot;A screenshot of some copper ore in my inventory. It says that 6 pieces will wither in 5 days and 15 pieces will wither in 6 days.&quot;&gt;
&lt;/figure&gt;
&lt;p&gt;Certain items can now wither away if unused for too long. I imagine that most people find this annoying, but I actually think this is a good addition. In a lot of browser games I&#39;ve played, richer players just hoard items, even common items, to exploit the game&#39;s economy. I also think it encourages players to actually &lt;em&gt;use&lt;/em&gt; their items and explore the different recipes and mechanics.&lt;/p&gt;
&lt;p&gt;Items that wither away become scraps or ash, which can be used for the farming and animal husbandry mechanics.&lt;/p&gt;
&lt;h3 id=&quot;activities&quot;&gt;Daily and Hourly Activities&lt;/h3&gt;
&lt;p&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/pawboroughactivities.png&quot; alt=&quot;PawBorough&#39;s daily activities and daily streak counter&quot;&gt;&lt;/p&gt;
&lt;p&gt;The game also now has a task system. There are both daily and hourly tasks and the game rewards you for keeping up a multi-day streak. I like this a lot! It keeps me from getting bored with the game and gives me a reason to check out features that I might have ignored otherwise. Not to mention the accompanying artwork is very cute!&lt;/p&gt;
&lt;h3 id=&quot;pronouns&quot;&gt;Gender and Pronoun Options&lt;/h3&gt;
&lt;p&gt;You can set custom pronouns for your cats! If your cat uses multiple pronoun sets, you can set how frequently each set is used.&lt;/p&gt;
&lt;p&gt;The cats sex is used &lt;em&gt;solely&lt;/em&gt; for the breeding mechanic. Cats of any sex can use any pronouns, wear any accessories, and take on any role. Male and female cats have different poses in their portraits by default, but you can freely switch between the two poses. This isn&#39;t a big deal right now, but upcoming breeds of cats show sexually dimorphic features in their poses. It&#39;ll be cool to see people make their cats trans or gender non-conforming.&lt;/p&gt;
&lt;p&gt;Some game and fan materials don&#39;t even refer to the cats as male or female. The &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://pawborough.wiki/wiki/Main_Page&quot;&gt;PawBorough Wiki&lt;/a&gt; refers to the different cats as &quot;mars cats&quot; and &quot;venus cats&quot;, referring to the symbols on their profiles.&lt;/p&gt;
&lt;h3 id=&quot;customization&quot;&gt;CSS Customization&lt;/h3&gt;
&lt;p&gt;For some reason all profile editing seems to be disabled for me now, but before it was disabled I played around with the custom CSS boxes you could put on your profile and you could do quite a lot with them.&lt;/p&gt;
&lt;p&gt;Basically everything you could do in normal CSS you could do in these. They even responded to media query, so you can set light and dark modes on them. The only things I struggled with were custom fonts and anchor links, but I kind of expected that. The site also allows for separate mobile and desktop widgets, so those who don&#39;t know how to make responsive layouts can still make decent, readable boxes.&lt;/p&gt;
&lt;h3 id=&quot;dens&quot;&gt;Dens&lt;/h3&gt;
&lt;p&gt;If I could make one small critique. Devs, please add a next/previous button to dens 🙏 It&#39;s really tedious having to click on a cat, do whatever you have to do, go back to it&#39;s den, scroll to find the next cat, rinse and repeat. Especially since so many things are done through the individual cat menus.&lt;/p&gt;
&lt;h2 id=&quot;buttons&quot;&gt;F2U 86x15 Buttons&lt;/h2&gt;
&lt;p&gt;Since you bothered reading this far, here&#39;s a little treat! I made and shared these buttons on the site&#39;s forums, but old forum posts seem to have been deleted during the last site reset. I&#39;ll probably make a separate page for all my free graphics eventually, but for now I&#39;ll just dump them here.&lt;/p&gt;
&lt;p&gt;They&#39;re inspired by similar buttons that people use on their forum signatures and profiles on Flight Rising. Colors were taken from templates on &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://idbuttons.neocities.org/&quot;&gt;idbuttons.neocities.org&lt;/a&gt;, but the pixel icons were hand-sprited by me!&lt;/p&gt;
&lt;p&gt;Credit/linking back is heavily appreciated, but I won&#39;t make a big fuss if you don&#39;t, just don&#39;t claim as your own. Also, &lt;strong&gt;no hotlinking, please!&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/abyssal-button.png&quot; alt=&quot;abyssal button (basic)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/abyssal-button-light.png&quot; alt=&quot;abyssal button (light)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/abyssal-button-dark.png&quot; alt=&quot;abyssal button (dark)&quot;&gt;&lt;br&gt;
&lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/cogwheel-button.png&quot; alt=&quot;cogwheel button (basic)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/cogwheel-button-light.png&quot; alt=&quot;cogwheel button (light)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/cogwheel-button-dark.png&quot; alt=&quot;cogwheel button (dark)&quot;&gt;&lt;br&gt;
&lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/harvest-button.png&quot; alt=&quot;harvest button (basic)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/harvest-button-light.png&quot; alt=&quot;harvest button (light)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/harvest-button-dark.png&quot; alt=&quot;harvest button (dark)&quot;&gt;&lt;br&gt;
&lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/luna-button.png&quot; alt=&quot;luna button (basic)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/luna-button-light.png&quot; alt=&quot;luna button (light)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/luna-button-dark.png&quot; alt=&quot;luna button (dark)&quot;&gt;&lt;br&gt;
&lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/sol-button.png&quot; alt=&quot;sol button (basic)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/sol-button-light.png&quot; alt=&quot;sol button (light)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/sol-button-dark.png&quot; alt=&quot;sol button (dark)&quot;&gt;&lt;br&gt;
&lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/the-metropolis-button.png&quot; alt=&quot;the metropolis button (basic)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/the-metropolis-button-light.png&quot; alt=&quot;the metropolis button (light)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/the-metropolis-button-dark.png&quot; alt=&quot;the metropolis button (dark)&quot;&gt;&lt;br&gt;
&lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/zenith-button.png&quot; alt=&quot;zenith button (basic)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/zenith-button-light.png&quot; alt=&quot;zenith button (light)&quot;&gt; &lt;img src=&quot;https://sainthood.xyz/assets/graphics/buttons/zenith-button-dark.png&quot; alt=&quot;zenith button (dark)&quot;&gt;&lt;/p&gt;
</description>
      <pubDate>Sun, 02 Nov 2025 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/the-beta-pawborough-experience.html</guid>
    </item>
    <item>
      <title>Man&#39;s Best Friend Album Review</title>
      <link>https://sainthood.xyz/blog/posts/mans-best-friend-album-review.html</link>
      <description>&lt;p&gt;This ones a little different. I like music, I&#39;m sure everybody does, but I&#39;m not a connoisseur. I don&#39;t know anything about music theory and I&#39;ve never written a full album review. Honestly, this is probably better described as &amp;quot;notes I took while listening to the album&amp;quot; than a proper review, so maybe don&#39;t hold your expectations too high.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;I&#39;m sure by the time I finish writing this, any buzz surrounding Man&#39;s Best Friend will probably be old news anyway. But I&#39;ve been trying to be less inhibited, and I thought with all the weird talk surrounding this album, my take might actually be useful for once.&lt;/p&gt;
&lt;div class=&quot;box&quot;&gt;
    &lt;p&gt;&lt;strong&gt;Edit 2025-11-03:&lt;/strong&gt; I&#39;m not gonna lie, I wasn&#39;t in a good mood when I wrote most of this review and it probably isn&#39;t very fun to read, or an accurate gauge of the albums quality. That&#39;s not to say my opinion of the album has necessarily changed, I just think that I could have done a better job explaining my thoughts. But also, I don&#39;t really care enough to go back and edit or rewrite it.&lt;/p&gt;
	&lt;p&gt;I&#39;ll be leaving this up for posterity. Just try to take everything written here with a grain of salt.&lt;/p&gt;
&lt;/div&gt;
&lt;hr&gt;
&lt;figure class=&quot;small right&quot;&gt;
	&lt;img src=&quot;https://sainthood.xyz/assets/images/bmf_cover.png&quot; alt=&quot;Sabrina Carpenter at a fancy dinner table with several men in suits&quot;&gt;
	&lt;figcaption&gt;
		&lt;p&gt;One of the alternative vinyl covers for Man&#39;s Best Friend.&lt;/p&gt;
	&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;There is a lot of discourse surrounding the rollout of Sabrina Carpenter&#39;s seventh studio album.&lt;/p&gt;
&lt;p&gt;I just want to state that, for the record, I have not read/watched any other reviews of this album, or any interviews with Sabrina covering it. I think that the album should speak for itself. I heard a few people give their takes on the lead single when it first came out, and I&#39;ve been forced to hear every shmuck with a keyboards thoughts on the cover art, but I&#39;ve gone out of my way to avoid anything relating to the album proper. All of these opinions are 100% my own, not taken from anyone else, not jumping on any bandwagons.&lt;/p&gt;
&lt;p&gt;I can&#39;t help but feel like a lot of people made up their mind about the project before ever hearing a single note. In an age were critical thinking is (supposedly) on the decline, I wanted to give this album a fair and unbiased review, as someone who isn&#39;t a stan or a hater, and just wants to hear some fun pop music!&lt;/p&gt;
&lt;p&gt;So, what&#39;s Man&#39;s Best Friend really like?&lt;/p&gt;
&lt;h2 id=&quot;songs&quot;&gt;Individual Songs&lt;/h2&gt;
&lt;h3 id=&quot;manchild&quot;&gt;Manchild&lt;/h3&gt;
&lt;p&gt;Manchild was everyone&#39;s first taste of the album and, without a shadow of a doubt, the best song on the album. It&#39;s the best produced, best performed, and has the best music video. It was the lead single for the album and any hype I had for the album came &lt;em&gt;solely&lt;/em&gt; from this song.&lt;/p&gt;
&lt;p&gt;If it wasn&#39;t obvious, I like this one a lot! I could go on all day picking out all the little bits that tickle my ears just right. There&#39;s a lot of fun little adlibs and clever lyrics. I like the way she sings &amp;quot;stupid&amp;quot; and &amp;quot;useless&amp;quot;. I love the harmonizing/vocal layering on the second half of the bridge. My favorite part is probably how it builds up to the final chorus. It feels so grand and epic. I don&#39;t know how to explain it, but I guess I&#39;m just really nostalgic for when pop songs sounded cinematic, but like &lt;em&gt;fun&lt;/em&gt; cinematic, not Halsey/Imagine Dragons serious trailer music cinematic.&lt;/p&gt;
&lt;figure class=&quot;small left&quot;&gt;
	&lt;img src=&quot;https://sainthood.xyz/assets/images/manchild_ytmrecap.jpg&quot; alt=&quot;cropped screenshot of my YouTube Music summer recap&quot;&gt;
	&lt;figcaption&gt;
		&lt;p&gt;Manchild was my top song of June-August on YouTube Music. Yes, I really do like this song &lt;em&gt;that&lt;/em&gt; much.&lt;/p&gt;
	&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;For what it&#39;s worth, I also thought the song was supposed to be somewhat self-deprecating. That&#39;s probably not the right word but I hope people will know what I mean. Like, there&#39;s the whole &amp;quot;amen, hey men&amp;quot; line. When she sings &amp;quot;I swear they chose me I&#39;m not choosing them&amp;quot;, it sounds like she&#39;s trying to convince herself more than anyone. I&#39;ve seen some people take those lines very literally, but I don&#39;t think they&#39;re supposed to be.&lt;/p&gt;
&lt;p&gt;Is Manchild the best song ever? No. It&#39;s still a &lt;em&gt;very&lt;/em&gt; good pop song though. It set my expectations very high for the album.&lt;/p&gt;
&lt;h3 id=&quot;tears&quot;&gt;Tears&lt;/h3&gt;
&lt;p&gt;Tears is basically Manchild Jr. It&#39;s the second song on the album and the second single. It covers the same topic as Manchild, though I guess this one has a slightly more sarcastic spin on it. I love the intro, with the piano and the &amp;quot;shikitah&amp;quot;, and finally the drums coming in a little after. I also liked the part with the whispering and the dance break. Very fun!&lt;/p&gt;
&lt;p&gt;The lyrics here aren&#39;t as good as Manchild&#39;s. I don&#39;t expect sophisticated, flowery writing from pop songs, but there&#39;s just not a lot going on here. Nothing catchy or quotable aside from maybe the chorus. Maybe she just used up all her good ideas on the previous song.&lt;/p&gt;
&lt;p&gt;I&#39;m not a huge fan of the stripper pole in the music video. What I like about Sabrina is she&#39;s good at wordplay and innuendos, her just straight up stripping is a bit too unsubtle for my taste. It feels like the visual version of &amp;quot;saying the quiet part out loud&amp;quot;, if that makes sense. I promise your audience is smart enough to know what this song is about, Sabrina, you don&#39;t have to spell it out for us.&lt;/p&gt;
&lt;p&gt;Overall, I do like the song, it&#39;s upbeat and catchy, but it feels like it&#39;s retreading a lot of old ground.&lt;/p&gt;
&lt;h3 id=&quot;tracks&quot;&gt;Tracks 3-6&lt;/h3&gt;
&lt;p&gt;The next handful of songs are My Man on Willpower, Sugar Talking, We Almost Broke Up Again Last Night, and Nobody&#39;s Son.&lt;/p&gt;
&lt;p&gt;When I first listened to the album all of these songs just went in one ear and out the other. For the life of me, I could not remember any of the lyrics or hum any of the melodies. After relistening they&#39;ve stuck with me a little more, but I&#39;m still not that impressed.&lt;/p&gt;
&lt;p&gt;It was at this point that I realized that this album wasn&#39;t going to be the fun summer pop album that the singles might have suggested. These next several songs are about her and her boyfriends relationship going south and then eventually breaking up. That&#39;s fine. Albums don&#39;t have to be about just one thing and there are a lot of great break up songs/albums out there. The issue I have is that this album feels like it&#39;s treading the same few ideas over and over again. I fell like some of these songs could&#39;ve been combined together. Probably better to have a couple whole-assed songs than several half-assed songs.&lt;/p&gt;
&lt;p&gt;These songs aren&#39;t very introspective. Typically, I wouldn&#39;t criticize that from a pop album, but the instrumentals here are so much slower and stripped back compared to the other songs, it really forces you to focus on the lyrics. I guess, technically, telling me &amp;quot;this guy sucks&amp;quot; over and over again &lt;em&gt;does&lt;/em&gt; say something about her feelings towards him, but not a lot. Then again, Sabrina Carpenter isn&#39;t a singer-songwriter, so maybe I&#39;m expecting too much.&lt;/p&gt;
&lt;p&gt;To be honest, if all these songs are about the same guy, I&#39;m kind of siding with him in this situation. Sabrina constantly refers to him as sensitive and, later in the album, &amp;quot;fruity&amp;quot;. His biggest sins are not wanting to have sex 24/7, buying real flowers, and using big words. If she&#39;s singing about a real person then we might have a very rare case of a sensitive, romantic guy getting with a woman who only wants him for his body. I&#39;d call it subversive if it wasn&#39;t so sad.&lt;/p&gt;
&lt;h3 id=&quot;laidworried&quot;&gt;Never Getting Laid and Don&#39;t Worry I&#39;ll Make You Worry&lt;/h3&gt;
&lt;p&gt;Never Getting Laid and Don&#39;t Worry I&#39;ll Make You Worry are the 7th and 10th tracks on the album respectively, but I&#39;m jumping around a little because these songs are very similar lyrics-wise. Like the previous handful of songs, the production takes a backseat while the performance and lyrics take center stage.&lt;/p&gt;
&lt;p&gt;I&#39;ll be blunt, Sabrina is really unlikable in these songs. I don&#39;t believe that music has to be pleasant or can&#39;t depict bad people doing bad things. God knows, there&#39;s a lot of songs I like were worse people say/do worse things. I guess I just don&#39;t understand why Sabrina feels the way that she does on these songs.&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;&amp;quot;I just hope you get agoraphobia some day&amp;quot;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;blockquote&gt;
&lt;p&gt;&amp;quot;Boy, I know where you live&amp;quot;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;blockquote&gt;
&lt;p&gt;&amp;quot;You think that I&#39;m gonna fuck with your head?&lt;br&gt;
Well, you&#39;re absolutely right&amp;quot;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;blockquote&gt;
&lt;p&gt;&amp;quot;That emotional lottery is all you&#39;ll ever get with me&amp;quot;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;blockquote&gt;
&lt;p&gt;&amp;quot;I&#39;ll make you worry like no other girl can&lt;br&gt;
So don&#39;t worry&lt;br&gt;
I&#39;ll leave you feeling like a shell of a man&amp;quot;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;It&#39;s just &amp;quot;Yep! I&#39;m being shitty to my (ex-)boyfriend!&amp;quot;. Okay, but why?&lt;/p&gt;
&lt;p&gt;Is this revenge? or a threat? Did he do something to you first? Neither of the songs mentions that. Is this a parody? There are a lot of great songs out there that play on the &amp;quot;crazy ex-girlfriend&amp;quot; trope, or subvert tropes of women being weak/submissive. I guess these songs technically do the latter, but they don&#39;t really feel pointed enough to be called parodies. It&#39;s not a character study. At no point is there any self reflection. It&#39;s not &amp;quot;I treat men like shit and here&#39;s why&amp;quot;. They don&#39;t even go far enough that you could call either of them a wacky farce. In the end, I&#39;m just left confused and uncomfortable.&lt;/p&gt;
&lt;h3 id=&quot;gethot&quot;&gt;When Did You Get Hot?&lt;/h3&gt;
&lt;p&gt;This one has a slightly different theme. It&#39;s about reuniting with someone you knew as a kid and finding them attractive as an adult. The concept is interesting, but the execution is underbaked.&lt;/p&gt;
&lt;p&gt;I like the melody and the vocal layering during the verses. I also found the &amp;quot;big riff&amp;quot; part pretty amusing when I first heard it, but the rest of the song is very forgettable. I refuse to believe that the same people who wrote Juno or Bed Chem couldn&#39;t come up with anything better than &amp;quot;take me to naked Twister back at your place&amp;quot;. That&#39;s something I&#39;d expect out of a mean-spirited, Bart Baker-style parody of Sabrina, not the real artist.&lt;/p&gt;
&lt;h3 id=&quot;gogojuice&quot;&gt;Go Go Juice&lt;/h3&gt;
&lt;p&gt;Go Go Juice is one of the more interesting songs on the album. It&#39;s definitely one of the more fully realized tracks. I feel kind of conflicted about this one. When I first heard it it just made me sad, but I had to relisten to it multiple times to write this review and in that time I think it&#39;s grown on me quite a bit.&lt;/p&gt;
&lt;p&gt;I find the way she sings &amp;quot;well fuck&amp;quot; especially satisfying. I like the melody on the chorus and how the instrumental cuts out halfway through the second chorus (when she sings &amp;quot;girl who&#39;s been dumped&amp;quot;). I also like the little triangle at the start of the second verse after she says &amp;quot;ring ring ring&amp;quot;. Compared to all the half-assed songs on this album, this one sounds not only finished, but polished! It&#39;s also a topic that she hasn&#39;t covered before to my knowledge.&lt;/p&gt;
&lt;p&gt;Sabrina gives a very good vocal performance. She&#39;s not belting or anything, but she&#39;s a very good &amp;quot;vocal actress&amp;quot; if that makes sense. She plays her &amp;quot;character&amp;quot; and delivers her &amp;quot;lines&amp;quot; very well. It&#39;s like hearing a characters song in a musical.&lt;/p&gt;
&lt;p&gt;As for the negatives, I&#39;m not sure how serious this song is. I guess that&#39;s more of a me problem than the songs problem, though. Is this supposed to be self-deprecating, or am I just stupid? Is Sabrina&#39;s drinking problem supposed to be sad? Cute? Funny? Sexy? All of these? None of these?&lt;/p&gt;
&lt;p&gt;I&#39;m also not a huge fan of the subtle homophobia.&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;&amp;quot;Got a soft spot for a bev&#39; and a boy that&#39;s fruity&amp;quot;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;I know that &amp;quot;fruity&amp;quot; has been somewhat reclaimed in recent years and some younger people reading this might think that I&#39;m being too sensitive, but I&#39;m sorry, a cishet woman straight up calling her ex-boyfriend a fruit really rubs me the wrong way. Especially after all the songs where she&#39;s whining about how &amp;quot;sensitive&amp;quot; he is. Just call him a real slur at this point.&lt;/p&gt;
&lt;p&gt;I could see this song getting play on country radio if it was released as a single. Morgan Wallen drops like five whiskey-themed country singles a year and this is basically the female version of that.&lt;/p&gt;
&lt;h3 id=&quot;housetour&quot;&gt;House Tour&lt;/h3&gt;
&lt;p&gt;At this point the album felt like it&#39;d been going on forever. When I heard upbeat synths I got very excited. A happy song after like ten sad/angry ones was like an oasis in a desert!&lt;/p&gt;
&lt;p&gt;This one&#39;s okay I guess. Like I said, I like the synths. The little &amp;quot;take your shoes off&amp;quot; in the intro is also pretty cute. I feel like it could&#39;ve been a lot better. They don&#39;t really go all the way with the concept, it feels kind of half-assed.&lt;/p&gt;
&lt;p&gt;I hate to say it but... Ninja Sex Party did it better:&lt;/p&gt;
&lt;div style=&quot;position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%; margin-bottom: 1rem;&quot;&gt;
  &lt;iframe width=&quot;560&quot; height=&quot;315&quot; src=&quot;https://www.youtube.com/embed/eu196vZSe_I&quot; frameborder=&quot;0&quot; allow=&quot;accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture&quot; style=&quot;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;&quot; allowfullscreen=&quot;&quot;&gt;&lt;/iframe&gt;
&lt;/div&gt;
&lt;h3 id=&quot;goodbye&quot;&gt;Goodbye&lt;/h3&gt;
&lt;p&gt;At long last, we&#39;ve made it to the final track, Goodbye. I have mixed feelings on this one. I like the little piano strikes and the &amp;quot;ah-ha&#39;s&amp;quot;, reminds me of ABBA. Considering how many slower songs are on this album I&#39;m just glad it&#39;s somewhat upbeat.&lt;/p&gt;
&lt;p&gt;The lyrics kind of annoy me. Oh no, God forbid someone wants to break up amicably and still be friends! 🙄 Compare it to the closing track on Short n&#39; Sweet, Don&#39;t Smile, and I don&#39;t know, it just doesn&#39;t hit the same.&lt;/p&gt;
&lt;h3 id=&quot;funnyway&quot;&gt;Such A Funny Way&lt;/h3&gt;
&lt;p&gt;But wait, the albums not over yet, we have a bonus track!&lt;/p&gt;
&lt;p&gt;To be honest, I think I like this one more than some of the actual songs on the album. She actually describes some of the bullshit her ex did to her, not just petty stuff but &lt;em&gt;real&lt;/em&gt; bullshit, it makes Sabrina seem a lot more sympathetic.&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;&amp;quot;Keep me far from friends and family, baby, that&#39;s just one of your quirks&amp;quot;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;Not an amazing song, but not bad either.&lt;/p&gt;
&lt;h2 id=&quot;overall&quot;&gt;Overall Thoughts&lt;/h2&gt;
&lt;p&gt;If I had to describe this album in one word it would be &amp;quot;rushed&amp;quot;. A lot of the songs feel like first drafts. The album is &lt;em&gt;very&lt;/em&gt; frontloaded. Sure, there are some highlights after the first two songs, but most of it is a huge slog.&lt;/p&gt;
&lt;p&gt;I don&#39;t really like giving number scores, but if I had to, I&#39;d probably give this one &lt;strong&gt;4/10&lt;/strong&gt;, below average.&lt;/p&gt;
&lt;p&gt;For the record, I&#39;d probably give Sabrina&#39;s previous album, Short n&#39; Sweet, 7.5/10, above average, thoroughly enjoyable, but not amazing. Honestly, listening to Man&#39;s Best Friend makes me want to rate Short n&#39; Sweet even higher. So many little things that I took for granted in that album. You truly don&#39;t know how good you have it until it&#39;s gone.&lt;/p&gt;
&lt;p&gt;Is Man&#39;s Best Friend the worst album ever? Definitely not! But it&#39;s pretty underwhelming and I don&#39;t see myself returning to most of it. By contrast, I have many songs, even non-singles, from Short n&#39; Sweet on heavy rotation.&lt;/p&gt;
&lt;h2 id=&quot;misc&quot;&gt;Misc Notes&lt;/h2&gt;
&lt;p&gt;I don&#39;t really know where else to put this, but here&#39;s some more random/miscellaneous thoughts I have related to the album.&lt;/p&gt;
&lt;hr&gt;
&lt;figure class=&quot;small right&quot;&gt;
	&lt;div style=&quot;position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%; margin-bottom: 1rem;&quot;&gt;
  &lt;iframe width=&quot;560&quot; height=&quot;315&quot; src=&quot;https://www.youtube.com/embed/ekxNdBZizNQ&quot; frameborder=&quot;0&quot; allow=&quot;accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture&quot; style=&quot;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;&quot; allowfullscreen=&quot;&quot;&gt;&lt;/iframe&gt;
&lt;/div&gt;
	&lt;figcaption&gt;
		&lt;p&gt;Man&#39;s Best Friend if it was good.&lt;/p&gt;
	&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;I literally just realized as I was sitting down to write this that the album does absolutely nothing with the &amp;quot;Man&#39;s Best Friend&amp;quot; title. Like, yes. Sabrina is a straight woman talking about her relationships with men, but so are most female artists. I know some promo pics show her holding puppies and the album art has her on her hands and knees like a dog, but that&#39;s all marketing.&lt;/p&gt;
&lt;p&gt;What does she actually do with it artistically? Absolutely fucking nothing. She never calls herself a bitch. Never alludes to her (ex-)boyfriend being controlling by calling him her &amp;quot;owner&amp;quot; or &amp;quot;master&amp;quot;. She can&#39;t even take the oh-so low hanging fruit of calling a dick a bone. Like, come on! It&#39;s right there! I can think of like five innuendos off the top of my head for that one!&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;I&#39;m going to make an educated guess that since pop is a singles-oriented genre, maybe Sabrina&#39;s team just assumed no one would care about the non-singles. Why bother making all of the songs good when only some will get airplay anyway? Maybe they put all of their eggs in a few baskets with Manchild, Tears, and whatever else they plan on making the next single?&lt;/p&gt;
&lt;p&gt;For the next single, I&#39;m predicting Go Go Juice or &lt;em&gt;maybe&lt;/em&gt; House Tour? Go Go Juice is a no-brainer. It&#39;s one of the more finished songs on the album, it&#39;d be a waste &lt;em&gt;not&lt;/em&gt; to release it. Barring that, House Tour is pretty upbeat, I could imagine them making a wacky, campy music video for it too. Fall is right around the corner, so maybe one of those slow songs I glazed over, but I hope not.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;I remember a while back, I heard a rumor that the reason this album was coming out so soon (almost exactly a year to the date after the last one), was because someone was leaking (or threatening to leak) some of Sabrina&#39;s music, and her label wanted to get it out officially before it could be leaked. I have no idea if that&#39;s true, but after hearing all these songs I&#39;m honestly inclined to believe it.&lt;/p&gt;
&lt;p&gt;Of course, there are other reasons they might have rushed it out. Sabrina had a huge summer last year, maybe her label wants to capitalize on her while she&#39;s still relevant, even if that risks overexposing her. A lot of other pop artists are rumored to be dropping albums later this year/early next year, maybe they wanted her to hurry up and drop something now while things were still quiet and there&#39;s less competition.&lt;/p&gt;
&lt;p&gt;I don&#39;t have a solid answer, and the general public probably never will. All I know is that her music isn&#39;t as good anymore and I&#39;m disappointed.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;Now if you don&#39;t mind, I think I have acquired &lt;strong&gt;Sabrina fatigue&lt;/strong&gt;. I think it&#39;ll be a while before I&#39;m able to listen to even her &lt;em&gt;good&lt;/em&gt; songs again.&lt;/p&gt;
</description>
      <pubDate>Fri, 05 Sep 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/mans-best-friend-album-review.html</guid>
    </item>
    <item>
      <title>Focus Outlines on Image Links</title>
      <link>https://sainthood.xyz/code/snippets/focus-outlines-on-image-links.html</link>
      <description>&lt;p&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://webaim.org/techniques/keyboard/#focus&quot;&gt;Focus indicators&lt;/a&gt; usually work fine when focusing on standard text links, but can sometimes look weird when focusing on links with images. By default, they select the area where the text would show up, not the area of the image. For smaller graphics, this can cause the outline to cover up important parts of the image. For larger ones, it might not be obvious what element is being focused on since the indicator is so small.&lt;/p&gt;
&lt;figure class=&quot;center&quot;&gt;
    &lt;div class=&quot;flexcontainer&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/outlinebad.png&quot; alt=&quot;default focus outline improperly covering up an image&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/outlinebetter.png&quot; alt=&quot;default focus outline properly outlining an image&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/outlinebest.png&quot; alt=&quot;styled focus outline outlining an image&quot;&gt;
    &lt;/div&gt;
    &lt;figcaption&gt;
        &lt;p&gt;Various focused links with small images. First is the default behavior without styling, second uses slightly better styling, and third uses optimal styling.&lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;h2&gt;Basic Version&lt;/h2&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;*:focus-visible, a:focus-visible img&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;outline&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; auto&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;a:has(img):focus-visible&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;outline&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;This snippet removes the outline from the link &lt;em&gt;only&lt;/em&gt; if it has an image as a child element and then applies the outline to the image instead. &lt;code&gt;outline: auto;&lt;/code&gt; will apply the browsers default outline style to the element. If you don&#39;t want to bother styling focus outlines, just use &lt;code&gt;auto&lt;/code&gt;.&lt;/p&gt;
&lt;h2&gt;Advanced Version&lt;/h2&gt;
&lt;p&gt;This is a slightly modified version of the CSS I use for my website:&lt;/p&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;*:focus-visible, a:focus-visible img&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
	&lt;span class=&quot;token property&quot;&gt;outline&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; currentColor solid 0.2rem&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
	&lt;span class=&quot;token property&quot;&gt;border-radius&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 5px&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
	&lt;span class=&quot;token property&quot;&gt;outline-offset&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; .2rem&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
	&lt;span class=&quot;token property&quot;&gt;z-index&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 100&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
	&lt;span class=&quot;token property&quot;&gt;position&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; relative&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;a:has(img):focus-visible&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
	&lt;span class=&quot;token property&quot;&gt;outline&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;This one&#39;s a little more complicated, so let&#39;s break it down:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;code&gt;outline&lt;/code&gt; styling is mostly taken from &lt;span lang=&quot;de&quot;&gt;medienbaecker&#39;s&lt;/span&gt; &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://medienbaecker.com/articles/focus-outlines&quot;&gt;beautiful focus outlines&lt;/a&gt;. You can customize them similarly to how you would a border by defining the color, width, and border style.&lt;/li&gt;
&lt;li&gt;&lt;code&gt;border-radius&lt;/code&gt; is just for aesthetic purposes.&lt;/li&gt;
&lt;li&gt;&lt;code&gt;outline-offset&lt;/code&gt; defines how far the outline is from the element it&#39;s focusing on. Setting it helps makes sure the outline doesn&#39;t cover up the element or hug it too tightly.&lt;/li&gt;
&lt;li&gt;&lt;code&gt;z-index&lt;/code&gt; and &lt;code&gt;position&lt;/code&gt; insure that elements are placed in front of all other elements when focused on. If you&#39;re playing around with other &lt;code&gt;position&lt;/code&gt; values, make sure you have that defined &lt;em&gt;after&lt;/em&gt; the focus styling, so that &lt;code&gt;position: relative;&lt;/code&gt; is overwritten.&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;Support for Older Browsers&lt;/h2&gt;
&lt;p&gt;The &lt;code&gt;:has()&lt;/code&gt; selector is considered a &quot;newly baseline&quot; CSS feature. This means that some older browsers may not be able to use it. I&#39;m personally not to worried about this because &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://caniuse.com/css-has&quot;&gt;over 90% of browsers already support it&lt;/a&gt;, but if you &lt;em&gt;really&lt;/em&gt; want to optimize your code for older browsers you can use &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://developer.mozilla.org/en-US/docs/Web/CSS/@supports&quot;&gt;@supports&lt;/a&gt; to detect wither or not their browser supports it.&lt;/p&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;*:focus-visible&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
	&lt;span class=&quot;token comment&quot;&gt;/* outline styling */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token atrule&quot;&gt;&lt;span class=&quot;token rule&quot;&gt;@supports&lt;/span&gt; &lt;span class=&quot;token function&quot;&gt;selector&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token selector-function-argument selector&quot;&gt;a:has(img)&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
	&lt;span class=&quot;token selector&quot;&gt;a:focus-visible img&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
	    &lt;span class=&quot;token comment&quot;&gt;/* outline styling */&lt;/span&gt;
	&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;
	&lt;span class=&quot;token selector&quot;&gt;a:has(img):focus-visible&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
	    &lt;span class=&quot;token property&quot;&gt;outline&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
  &lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;This way, if someones browser can&#39;t outline the whole image, it&#39;ll use it&#39;s default behavior as a fallback. It&#39;s not optimal, but a bad focus indicator is probably still better than no focus indicator.&lt;/p&gt;
</description>
      <pubDate>Fri, 22 Aug 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/code/snippets/focus-outlines-on-image-links.html</guid>
    </item>
    <item>
      <title>Some Updates</title>
      <link>https://sainthood.xyz/blog/posts/some-updates.html</link>
      <description>&lt;p&gt;It&#39;s been about a month since my last blog post. Thought I should pop in real quick and give a few updates.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;h2&gt;Personal Stuff&lt;/h2&gt;
&lt;p&gt;I&#39;m not gonna lie, the past couple months have been an absolute roller coaster for me. I&#39;ve experienced some of my biggest highs and lows in recent memory. I&#39;m going through at least two major life changes right now and there&#39;s possibly more on the way. Not all of the changes are bad, but it&#39;s all still a lot to adjust to.&lt;/p&gt;
&lt;p&gt;I&#39;m anticipating a &lt;em&gt;very&lt;/em&gt; busy September, so I probably won&#39;t be online as much. I&#39;m already pretty slow when it comes to replying to messages, but now people should expect me to be even slower.&lt;/p&gt;
&lt;h2&gt;Plans for the Site (But Mostly Just Philosophizing)&lt;/h2&gt;
&lt;p&gt;There&#39;s a &lt;em&gt;lot&lt;/em&gt; of stuff I want to do for my website. I&#39;m not sure if I&#39;ll actually be able to get to it any time soon. I guess the most substantial would be &quot;rebranding&quot; my site and making it more personal. I started this site and bought the domain at a very weird time in my life. I wasn&#39;t really thinking about longevity. There&#39;s kind of a story behind the &quot;sainthood&quot; URL, but honestly I don&#39;t have any strong attachment to the word or what it means. I&#39;m not even Christian. I feel like I should change my domain to something that actually reflects me and what I post here.&lt;/p&gt;
&lt;p&gt;I honestly kind of hate the idea of branding, not just in a corporate way but in general. The idea that my site needs a signature color palette or a catchy name to be a &quot;proper&quot; site makes me very sad.&lt;/p&gt;
&lt;p&gt;I think some people get very obsessive about their &quot;personal brand&quot;. Not just online, but offline too. Everyone wants to have an easy descriptor for themselves, to be the &quot;[insert thing here] friend&quot;. The artsy friend, the smart friend, the sporty friend, etc, etc. I sort of tried that when I was younger and I feel like over time it became less descriptive and more prescriptive. Am I &quot;the x guy&quot; because I do x, or do I do x because everyone around me has deemed me &quot;the x guy&quot;?&lt;/p&gt;
&lt;p&gt;I think people are more complicated than that, we all contain multitudes. I worry about making certain things my &quot;brand&quot; because people change. What if the things I base my whole personality around today mean nothing to me tomorrow? Maintaining a personal website is hard. Not just because of the technical stuff, but because how do you neatly organize yourself into a website? How do you decide what and what not to share?&lt;/p&gt;
&lt;p&gt;Somewhat related but I also feel like I haven&#39;t been using my &quot;personal&quot; website very personally. I think it&#39;s just a mixture of me being both a people pleaser and very paranoid. I&#39;m always worried about people hating me, and also deeply concerned about the rise of surveillance culture, so I&#39;ve grown to be pretty inhibited.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;Okay, sorry for all the philosophizing, here&#39;s some actual stuff I have plans for.&lt;/p&gt;
&lt;p&gt;I&#39;m working on a new layout. I think I really overengineered the one I&#39;m currently using, so this new one is hopefully going to be a lot simpler. Easier for me to customize, easier for you to read, and easier for your device to load!&lt;/p&gt;
&lt;p&gt;I&#39;m trying to figure out how to deploy my site so it&#39;s easier for me to update it. Right now I&#39;m just dragging and dropping files into cPanel and it&#39;s really annoying. I&#39;ll probably be using &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://codeberg.org/&quot;&gt;Codeberg&lt;/a&gt; since I&#39;m trying to avoid using GitHub/Microsoft products (I type, as I&#39;m using Windows). I also plan on eventually moving &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/projects/&quot;&gt;my code projects&lt;/a&gt; to their own repositories on there, so people don&#39;t have to download them directly from my site anymore.&lt;/p&gt;
&lt;p&gt;I really want to start using my blog as an &lt;em&gt;actual&lt;/em&gt; blog. I want to get into the habit of actually &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://shellsharks.com/just-put-it-on-your-blog&quot;&gt;putting things on my blog&lt;/a&gt; and having those things &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://bjhess.com/posts/you-re-a-blogger-not-an-essayist&quot;&gt;not be super long or formal&lt;/a&gt;. I kind of did this in July, but managing files was really annoying without deployment. I also maybe should look into using a &lt;abbr title=&quot;Content Management System&quot;&gt;CMS&lt;/abbr&gt; but I don&#39;t want to overcomplicate things too much.&lt;/p&gt;
&lt;p&gt;I want to start linking to more small/personal sites and make it so that more people can link to me. The main reason I haven&#39;t joined any webrings or created a site button or anything like that yet is because I don&#39;t want people to link to sainthood.xyz when I know I want to change it anyway. I&#39;m avoiding link rot by not linking in the first place. This kind of defeats the purpose of the internet, though. Hyperlinks are the foundation of the web. No one&#39;s going to find your site if there&#39;s no link to it. I hope to do all of that stuff once I get a new domain.&lt;/p&gt;
&lt;p&gt;I have a few projects and actual content for the site that I&#39;m working on but can&#39;t guarantee they&#39;ll ever see the light of day, so I won&#39;t get your hopes up. I really wanted to do some kind of Halloween project but since I&#39;m going to be so busy in September I don&#39;t think I&#39;ll have time this year. Maybe next year though.&lt;/p&gt;
</description>
      <pubDate>Fri, 22 Aug 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/some-updates.html</guid>
    </item>
    <item>
      <title>Linux First Impressions</title>
      <link>https://sainthood.xyz/blog/posts/linux-first-impressions.html</link>
      <description>&lt;p&gt;One of my New Year&#39;s resolutions for 2025 was to switch to Linux. It&#39;s now July and I&#39;m finally doing it. Better late than never I guess.&lt;/p&gt;
&lt;!--excerpt--&gt;
&lt;p&gt;I&#39;m sure I don&#39;t have to explain why I&#39;m doing this, blah blah Microsoft bad blah blah AI bad blah blah. Anyway, I like learning about technology (even though I&#39;m not that smart and find a lot of it very intimidating), so I thought it&#39;d be worth trying out. If not for daily use, then at least a cool learning experience.&lt;/p&gt;
&lt;h2 id=&quot;setup&quot;&gt;My Setup&lt;/h2&gt;
&lt;p&gt;I decided to use &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.linuxmint.com/&quot;&gt;Linux Mint&lt;/a&gt;. Basically every source I found listed it as a good &quot;beginner distro&quot; and it has a nice default &lt;abbr title=&quot;User Interface&quot;&gt;UI&lt;/abbr&gt; that&#39;s analogous to windows (by contrast, Ubuntu, another &quot;beginner distro&quot;, looks like a bootleg iPad). Many experienced users also label it as a &quot;just works distro&quot;, so it shouldn&#39;t require too much tinkering. Sounds like a great fit!&lt;/p&gt;
&lt;p&gt;I ended up testing it on a virtual machine. I originally wanted to dual boot it instead, since that’s what I’ve seen a lot of guides suggest, but it would have been a lot more complicated since I&#39;m using a laptop. Typically, when people dual boot, they&#39;re using desktop PCs and each &lt;abbr title=&quot;Operating System&quot;&gt;OS&lt;/abbr&gt; has it&#39;s own designated drive. My laptop has a single hard drive and it&#39;s soldered on. I know you can make partitions on a single drive, but I&#39;ve also heard about that causing issues for some people. I&#39;ve &lt;em&gt;also&lt;/em&gt; also heard about Windows updates fucking with the bootloader and bricking your computer. So, maybe dual booting just isn&#39;t worth all the hassle, VirtualBox will do for now.&lt;/p&gt;
&lt;p&gt;Emulating it still wasn&#39;t a perfect experience though. Since my computer isn&#39;t super beefy, it had trouble running two operating systems at once. I adjusted the settings to give VirtualBox more memory, which helped a little, but was still &lt;em&gt;very&lt;/em&gt; laggy. I&#39;m fully aware that this isn&#39;t an issue with Linux, but it did effect my experience with it so I thought it was worth mentioning.&lt;/p&gt;
&lt;p&gt;In fairness, I used the version that came with the Cinnamon desktop environment, which is slightly more resource-intensive compared to some of the other environments they offer. I&#39;ve seen users of other distros talk about just downloading/installing new desktop environments without having to completely reinstall their &lt;abbr title=&quot;Operating System&quot;&gt;OS&lt;/abbr&gt;, so maybe I&#39;ll have to see if that&#39;s available on Mint.&lt;/p&gt;
&lt;h2 id=&quot;getting-started&quot;&gt;Getting Started&lt;/h2&gt;
&lt;p&gt;Setting it up was very easy. It has a &lt;abbr title=&quot;Graphical User Interface&quot;&gt;GUI&lt;/abbr&gt; that walks you through everything.&lt;/p&gt;
&lt;p&gt;The very first issue I encountered was getting the screen resolution to work. Apparently, my computer&#39;s display is 3000 x 2000, but the maximum size available in the settings is 2048 x 1152. The only scaling options for the &lt;abbr title=&quot;User Interface&quot;&gt;UI&lt;/abbr&gt; elements were 100% and 200%, so they were always either way too big or way too small. I&#39;m not sure if this is a true fix, since it still doesn&#39;t detect my true screen resolution, but I was able to enable fractional scaling and set it to 150%, which looks a lot better.&lt;/p&gt;
&lt;h3 id=&quot;customization&quot;&gt;Customization&lt;/h3&gt;
&lt;p&gt;Once I got that figured out, customization was a breeze! I tested out a few different pre-made themes, but I ended up settling on &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://github.com/smurphos/cinnamox_themes/tree/master/Cinnamox-Kashmir-Blue#readme&quot;&gt;Cinnamox-Kashmir-Blue&lt;/a&gt;.&lt;/p&gt;
&lt;figure&gt;
    &lt;img alt=&quot;Screenshot of my Linux Mint desktop&quot; src=&quot;https://sainthood.xyz/assets/images/mintdesktop.png&quot;&gt;
    &lt;figcaption&gt;
        &lt;p&gt;My Linux Mint desktop. The system information is displayed via neofetch in the terminal window. The background is an abstract 3D rendering of a metallic gray and cyan cube. The UI elements all have muted gray/blue/cyan gradient backgrounds overlayed with white text. The taskbar and desktop widgets are slightly transparent.&lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;It was &lt;em&gt;so&lt;/em&gt; funny. I was so excited about getting everything set up that I went to go tell my siblings about it. When I finally showed them my desktop layout, they both laughed in my face and told me it &quot;looked like shit&quot;.&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;https://sainthood.xyz/assets/images/worstlinuxever.png&quot; alt=&quot;Saint rices worst linux ever, asked to leave sibling&#39;s room&quot;&gt;&lt;/p&gt;
&lt;p&gt;Fuck you guys, I think it&#39;s cool 🖕&lt;/p&gt;
&lt;h2 id=&quot;programs&quot;&gt;Managing Programs&lt;/h2&gt;
&lt;h3 id=&quot;basic-programs&quot;&gt;Basic Programs&lt;/h3&gt;
&lt;p&gt;There are two ways to manage software on Mint, using the terminal and using the software manager, which is basically an app store. For the sake of learning, I opted to use the terminal whenever possible.&lt;/p&gt;
&lt;p&gt;Installing programs is pretty easy, but I found deleting to be a bit more challenging. Since most Linux distros encourage the use of &lt;abbr title=&quot;Free Open Source Software&quot;&gt;FOSS&lt;/abbr&gt;, I thought it&#39;d be fun to try out some other software that I don&#39;t use on windows. I installed LibreWolf and attempted to uninstall Firefox, which comes prepackaged with Mint. The browser itself disappeared, but when I used &lt;code&gt;apt list --installed&lt;/code&gt; it showed a bunch of extra files that came with Firefox (mostly language packs).&lt;/p&gt;
&lt;p&gt;So, I did a little research and it turns out I have to use &lt;code&gt;purge&lt;/code&gt; to delete both the program &lt;em&gt;and&lt;/em&gt; any associated files. I try to &lt;code&gt;purge&lt;/code&gt; Firefox , it says that I can&#39;t because Firefox doesn&#39;t exist. So, I redownload Firefox and then try again. It&#39;s deleted, but when I check the list again all the extra stuff is still there. My best guess is that maybe those files are related to LibreWolf, since LibreWolf is a fork of Firefox. Maybe the developers just didn&#39;t bother changing the names of files that they thought nobody would actually see.&lt;/p&gt;
&lt;p&gt;As a brief aside: For some reason, my desktop theme overrides Firefox&#39;s browser theme, but not LibreWolf&#39;s. Both of their right-click menus are effected by my desktop theme though, and I can&#39;t seem to turn that off. I wonder why that is?&lt;/p&gt;
&lt;p&gt;That aside, all the prepackaged apps seem to work fine. I think Mint strikes a nice balance with the kind and amount of programs it comes with. One of my siblings showed me his fresh installation of Kali Linux and it came with so many fun, but ultimately superfluous, programs. Meanwhile, I know some other distros come with basically nothing and leave you to download everything yourself.&lt;/p&gt;
&lt;h3 id=&quot;gaming&quot;&gt;Gaming&lt;/h3&gt;
&lt;p&gt;I was able to install Steam and access my account. Steam &lt;em&gt;technically&lt;/em&gt; works as intended, but it made my system so laggy that every game was completely unplayable. I tried to boot up Balatro and it took over a full minute to get from the start menu to the actual game. Like I said, I don&#39;t think this is because of Mint, it&#39;s because it&#39;s running in a virtual machine and maxing out it&#39;s memory. However, Balatro is a &lt;em&gt;very&lt;/em&gt; light game as it is, so I can&#39;t imagine my computer being able to handle anything bigger.&lt;/p&gt;
&lt;p&gt;There is also an issue with games not automatically launching when I selected the game&#39;s icon on desktop or the start menu. I have to open steam separately and select the game manually. This is annoying but not the worst thing in the world, and I assume it&#39;s probably not too hard to fix.&lt;/p&gt;
&lt;p&gt;Aside from Steam, I also downloaded Tux Typing and Tux, of Math Command. I&#39;m not sure if modern kids who&#39;re used to Roblox or Minecraft would still enjoy them, but I thought they were cute! They made me very nostalgic. Reminded me of when I was a kid and the teacher would take us to the computer lab to play edutainment games like these.&lt;/p&gt;
&lt;h3 id=&quot;art&quot;&gt;Art&lt;/h3&gt;
&lt;p&gt;I really enjoyed using Tux Paint! In the past, I&#39;ve tried to use Kid Pix on Windows, but it kept crashing, so this is a nice alternative. The lag made the lines a little jagged, but it still works. It also worked when I used my finger on the touchscreen.&lt;/p&gt;
&lt;p&gt;My only major gripe is that you have to download a completely different program for the options menu (which I couldn&#39;t even get working). I don&#39;t understand why it&#39;s not just a tab in the base program. It&#39;s also not mentioned anymore in the program itself, so a lot of users probably don&#39;t even know it exists.&lt;/p&gt;
&lt;p&gt;In the future, I&#39;d like to test out some &quot;proper&quot; art programs, like Krita, and do some tests with my pen, which has pressure sensitivity.&lt;/p&gt;
&lt;h2 id=&quot;accessibility&quot;&gt;Accessibility&lt;/h2&gt;
&lt;p&gt;I really only use one accessibility feature regularly and it&#39;s text-to-speech. Unfortunately, Mints text-to-speech is pretty awful.&lt;/p&gt;
&lt;p&gt;While browsing, I wanted to read a blog post that looked interesting, so I entered reader mode and let the TTS read it out to me. Everything up to this point had been mildly annoying at worst, so I was shocked when the voice reading the post sounded like Microsoft Sam and horribly mispronounced some words. Upon doing further research, this seems to be a recurring issue with most popular Linux distros. I looked into how to download custom voices and for the life of me I couldn&#39;t figure it out.&lt;/p&gt;
&lt;h2 id=&quot;summary&quot;&gt;In Summary&lt;/h2&gt;
&lt;p&gt;I don&#39;t think I&#39;m quite ready to switch to Linux full time. There&#39;s some minor bugs I have to work out and more stuff I need to test. Still, I feel like I learned a lot and I&#39;m glad I did it! I have more plans for messing around with it in the future.&lt;/p&gt;
</description>
      <pubDate>Fri, 18 Jul 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/linux-first-impressions.html</guid>
    </item>
    <item>
      <title>Another IndieWeb Peeve</title>
      <link>https://sainthood.xyz/blog/posts/another-indieweb-peeve.html</link>
      <description>&lt;p&gt;I have a few guides/tutorials saved in my drafts. Most of them start with a tangentially related preamble about this subject. I thought it&#39;d be smart to just trim the fat; cut straight to the point for those posts, and share the preamble here separately for those who really care.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;I&#39;ve seen a lot of experienced webmasters complain about how newer webmasters shouldn&#39;t do [insert thing here], but they don&#39;t explain why said thing is bad, or don&#39;t say what you &lt;em&gt;should&lt;/em&gt; be doing instead. This isn&#39;t exclusive to the indieweb community by any means, but it&#39;s still something that I see a lot.&lt;/p&gt;
&lt;p&gt;Telling your kid to stop eating so much candy is not the same as telling them to eat their vegetables. If you tell your kid to stop eating candy, they might just start eating chips instead. Some people require clearer instructions. I think that older and more experienced webdevs should set an example for those who are younger or less experienced.&lt;/p&gt;
&lt;p&gt;If you want someone to start doing something, &lt;strong&gt;show them how to do it&lt;/strong&gt;. If someone doesn&#39;t understand why, then &lt;strong&gt;explain it to them&lt;/strong&gt;. Don&#39;t assume that just because something is &amp;quot;common sense&amp;quot; to you, that means everyone else does/should know it. Will this work with everyone? No, but that doesn&#39;t mean that it won&#39;t help &lt;em&gt;anybody&lt;/em&gt;. It&#39;s at least more helpful than whining about &amp;quot;poser webcore kids coming from TikTok/Twitter&amp;quot; or whatever the fuck.&lt;/p&gt;
&lt;p&gt;As a sidenote, I&#39;m sorry how ranty/opinionated my posts have been as of late. I guess a part of me feels like this is a safe place to vent, since I&#39;m basically forced to suppress any negative emotions/opinions I have when I&#39;m offline. I&#39;m not really sure what my &amp;quot;audience&amp;quot; (if they even exist) expects of me, but I can&#39;t imagine reading my frustrated ramblings is all that fun. I promise I&#39;ll try to get some more positive/constructive stuff out soon!&lt;/p&gt;
</description>
      <pubDate>Wed, 16 Jul 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/another-indieweb-peeve.html</guid>
    </item>
    <item>
      <title>Webring Pet Peeves</title>
      <link>https://sainthood.xyz/blog/posts/webring-pet-peeves.html</link>
      <description>&lt;p&gt;I recently started and then promptly gave up on trying to list every single &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/links/webmastery/directories&quot;&gt;small/independent webring and web directory&lt;/a&gt; I could find. Was it worth it? I don&#39;t know, but now that I&#39;ve seen and catalogued so many of them, I wanted to share some observations.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;I wish more people thought about what kind of directory (a webring, a fanlisting, a standard web directory, etc.) suits their needs best before just going out and doing it. A lot of these ringmasters seem to be pretty young, and most webrings are just for fun, so I&#39;m not angry at them or anything, but I do find it annoying that the same issues keep happening over and again and no one ever seems to learn from them.&lt;/p&gt;
&lt;p&gt;The point of a webring is that it&#39;s a &lt;em&gt;ring&lt;/em&gt;. If even &lt;em&gt;one&lt;/em&gt; person&#39;s site goes down, then the whole thing breaks! The more people there are, the more sites you have to keep tabs on. A common issue I saw was webrings getting &lt;em&gt;way&lt;/em&gt; too big. Too many people would join and then the ringmaster would have to close new member applications because they either couldn&#39;t keep up with that much interest, or didn&#39;t have the time/energy to go through &amp;gt;100 sites regularly to make sure the ring was still working.&lt;/p&gt;
&lt;p&gt;One ring I saw, the &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://neocreatives.byethost5.com/&quot;&gt;Neocreatives Webring&lt;/a&gt;, was smart enough to transition from being a ring to a regular directory when the member count got too high, instead of just shutting down, but I can&#39;t help but wonder why so many webrings weren&#39;t just standard directories in the first place. Especially since a lot of them have very vague/general themes that attract a lot of people.&lt;/p&gt;
&lt;p&gt;A lot of webrings I found were centered around being fans of a certain thing. Most of them had a rule like &quot;You must be a fan of x, but you don&#39;t need any content relating to it on your site&quot;. That&#39;s more or less the same rules that fanlistings operate under. Fanlistings also tend to have a lot of people in them, and the scripts they run on accommodate for that. I wonder why so many people don&#39;t just make fanlistings instead.&lt;/p&gt;
&lt;p&gt;Maybe younger people just don&#39;t know what they are? I found this &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://fanlore.org/wiki/Fanlisting&quot;&gt;FanLore page&lt;/a&gt; explaining what they are, but they don&#39;t have Wikipedia pages like &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://en.wikipedia.org/wiki/Webring&quot;&gt;webrings&lt;/a&gt; and &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://en.wikipedia.org/wiki/Web_directory&quot;&gt;web directories&lt;/a&gt; do. Maybe someone should put together a beginners guide for that? I&#39;d do it myself but I &lt;em&gt;really&lt;/em&gt; don&#39;t feel like starting another project right now.&lt;/p&gt;
&lt;p&gt;It also kind of annoys me that so many webrings will link sites to each other that have absolutely nothing in common. I guess for some people that&#39;s part of the charm, the internet being a true &quot;wild west&quot; and never knowing what you&#39;re going to see next. Personally, I use webrings to find sites that cover similar topics, so I prefer when there&#39;s some cohesion. To each their own, I guess.&lt;/p&gt;
&lt;p&gt;Anyway, I don&#39;t dislike webrings, I just wish people were a little more intentional about them. Think about what features are &lt;em&gt;really&lt;/em&gt; necessary, how you&#39;ll deal with potential problems, and so on.&lt;/p&gt;
</description>
      <pubDate>Fri, 11 Jul 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/webring-pet-peeves.html</guid>
    </item>
    <item>
      <title>Free Slurpee Day 2025</title>
      <link>https://sainthood.xyz/blog/posts/free-slurpee-day-2025.html</link>
      <description>&lt;figure class=&quot;small right&quot;&gt;
    &lt;img alt=&quot;Me holding my slurpee&quot; src=&quot;https://sainthood.xyz/assets/images/slurpee.JPG&quot;&gt;
&lt;/figure&gt;
&lt;p&gt;Today is July 11th (7/11), which means 7-Eleven is giving out free slurpees! Multiple 7-Elevens by my house have closed down, so we actually had to go out of our way to find a new one. When we got there the line was &lt;em&gt;really&lt;/em&gt; long, almost going out the door! My brother got a mix of the green and blue flavors (he couldn&#39;t remember the actual names) and I got a mix of a little of everything.&lt;/p&gt;
&lt;p&gt;As dumb as it sounds, this is something I kind of look forward to every year. I only drink one slurpee a year, and it&#39;s this one. It&#39;s also just nice to get out of the house sometimes, even if that place is a convenience store. Aside from going on walks, I haven&#39;t really done many summer activities this year. I guess when you get older all the seasons just kind of blend together and stop mattering. It&#39;s nice to enjoy the few &amp;quot;summerish&amp;quot; moments that I get.&lt;/p&gt;
</description>
      <pubDate>Thu, 10 Jul 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/free-slurpee-day-2025.html</guid>
    </item>
    <item>
      <title>I Support Lying on the Internet</title>
      <link>https://sainthood.xyz/blog/posts/i-support-lying-on-the-internet.html</link>
      <description>&lt;p&gt;Apparently this is a &quot;hot take&quot;, but I honestly think more people should lie about themselves on the internet.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;To be clear, I don&#39;t support stuff like teens lying about their age so they can use adult-only websites, people lying about being part of marginalized groups so they can argue about politics on the internet, people purposely spreading misinformation, etc, etc.&lt;/p&gt;
&lt;p&gt;What I &lt;em&gt;am&lt;/em&gt; saying is that you don&#39;t have to share anything about yourself that you don&#39;t want to, and if someone asks you directly, sometimes it&#39;s okay to lie about it. Think about it, do you want someone you know offline stumbling across your site/account to &lt;em&gt;immediately&lt;/em&gt; know that it&#39;s you? Or worse; do you want to make things easy for people who could potentially &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://en.wikipedia.org/wiki/Doxing&quot;&gt;doxx&lt;/a&gt; you?&lt;/p&gt;
&lt;p&gt;&quot;But I&#39;m not doing anything wrong, I have nothing to hide!&quot; Unfortunately, you can be totally innocent and people can still do this sort of thing to you. Employers can fire you, or not hire you in the first place, just because they didn&#39;t like some innocuous post you made. Sometimes people become targets of harassment campaigns solely because they&#39;re a visible minority on the internet, even if they&#39;re not super involved in politics or a major public figure. It really doesn&#39;t take much.&lt;/p&gt;
&lt;p&gt;So, saying you&#39;re 23 when actually you&#39;re 21? Or that you&#39;re birthdays in June when it&#39;s really in April? Totally harmless.&lt;/p&gt;
&lt;p&gt;Lying about what state you live in, or not sharing it at all? That&#39;s literally just good &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://en.wikipedia.org/wiki/Operations_security&quot;&gt;OPSEC&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;Using a different name or pronouns than what you use in real life? Honestly, I encourage it. Not even just for security reasons, I just think that everyone should feel comfortable with how they present themself online. Like I said, as long as you&#39;re not trying to weasel your way into someplace you shouldn&#39;t be or are trying to score internet brownie points, who cares?&lt;/p&gt;
&lt;figure class=&quot;small center&quot;&gt;
    &lt;img src=&quot;https://sainthood.xyz/assets/images/internet_dog.jpg&quot; alt=&quot;Cartoon of two dogs sitting around a large, old-school computer.&quot;&gt;
    &lt;figcaption&gt;
        &lt;p&gt;&lt;q&gt;On the Internet, nobody knows you&#39;re a dog.&lt;/q&gt;&lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;Being vague about your gender/sexuality? You don&#39;t owe anyone that information in the first place. If a stranger online &lt;em&gt;directly&lt;/em&gt; asks you about it, you have every right to be suspicious of them.&lt;/p&gt;
&lt;p&gt;Stop giving ammo to people who could very easily ruin your life!!! Stop using your real, full, legal name on your profile with your selfie as the profile pic!!! Stop posting photos with the EXIF data and geotag still attached!!! &lt;em&gt;&lt;strong&gt;You could literally get yourself killed!!!&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;
</description>
      <pubDate>Thu, 03 Jul 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/i-support-lying-on-the-internet.html</guid>
    </item>
    <item>
      <title>My Terrible Bookmarks Workflow</title>
      <link>https://sainthood.xyz/blog/posts/my-terrible-bookmarks-workflow.html</link>
      <description>&lt;p&gt;I recently added a &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/links/&quot;&gt;link directory&lt;/a&gt; to my site, but I still have a &lt;em&gt;ton&lt;/em&gt; of other pages that I’d like to share and categorize. I have a terrible habit of hoarding bookmarks and tabs and never going back to them. They desperately need a spring cleaning, but I’ve been preoccupied with my personal life and when I&#39;m not busy with that, I&#39;m usually procrastinating.&lt;/p&gt;
&lt;p&gt;So lets take a look at my awful bookmarking systems. Yes, &quot;systems&quot;, with an &quot;s&quot;. I&#39;m so scatterbrained that I can&#39;t even stick to just one.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;hr&gt;
&lt;p&gt;First, I have my browser bookmarks. I don’t actually use most of them too often. A lot of them are old and probably don’t even work anymore. I did clean them out at one point, a few years ago, so they’re not &lt;em&gt;that&lt;/em&gt; bad, but they could still use some organizing.&lt;/p&gt;
&lt;figure class=&quot;small right&quot;&gt;
	&lt;div class=&quot;flexcontainer&quot;&gt;
		&lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/Feedbro_screencap.png&quot; alt=&quot;Screenshot of my Feedbro extension&quot;&gt;
		&lt;img class=&quot;twothird&quot; src=&quot;https://sainthood.xyz/assets/images/OneTab_screencap.png&quot; alt=&quot;Screenshot of my OneTab extension&quot;&gt;
	&lt;/div&gt;
	&lt;figcaption&gt;
		&lt;p&gt;At the time of taking these screencaps I had 88 unread posts in my feed reader and 8,485 links (!!!) saved in my OneTab. Those numbers have increased since I first started drafting this post.&lt;/p&gt;
	&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;I use a Firefox addon called &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://addons.mozilla.org/en-US/firefox/addon/onetab/&quot;&gt;OneTab&lt;/a&gt;. It basically closes all your tabs and saves the URLs as a list of links you can access from a special pinned tab. I thought it’d stop me from hoarding so many bookmarks, and I guess it technically did, but now I just have a bunch of links hoarded there instead. A part of me wonders if having so many links saved on there is making Firefox run worse. Firefox takes a lot of CPU on my laptop, even when I only have one tab open, but I&#39;m not sure if that&#39;s OneTab&#39;s fault or not.&lt;/p&gt;
&lt;p&gt;Then there are social media drafts. On mastodon I have a ton of posts, mostly with links, saved as bookmarks. Like most social media platforms, Mastodon only shows you one post at a time. There’s no grid view or mass bookmark editor as far as I know, at least not on the standard web version. This makes it harder to go through each post and decide what you still need to save. This is especially annoying for me because often Mastodon struggles with lag and loading media, but that could just be a me problem.&lt;/p&gt;
&lt;p&gt;We also have my RSS reader, &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://addons.mozilla.org/en-US/firefox/addon/feedbroreader/&quot;&gt;Feedbro&lt;/a&gt;. Some of the blogs I follow post multiple times a week, some even daily, so it’s hard to keep up with those. Thankfully, this one isn&#39;t as bad as the other ones. Feedbro keeps track of all unread posts, and lets you read full posts in the reader, instead of making you open them in a new tab.&lt;/p&gt;
&lt;p&gt;Finally, we have this random HTML file that I just copy-paste links into sometimes. I&#39;m pretty sure it was originally the file for my old link directory, before I took it down for reorganizing, but over time it&#39;s kind of Ship of Theseus&#39;d itself into something else. Some of them are labeled as &quot;links to go through&quot;, sites that have been suggested to me in various places, but I want to verify before linking them in my directory. Is this really necessary? I don&#39;t know, but I know I&#39;d feel pretty shitty if I accidentally promoted misinformation or something, so it&#39;s probably better to be safe than sorry.&lt;/p&gt;
&lt;p&gt;Maybe once I’m done with a bunch of stuff offline I’ll set time aside to deal with all of that. This whole thing is especially annoying when I’m trying to find a specific link. I’ll think &quot;Oh, it’s probably in this one place&quot; and then I check, realize it’s not there and have to go through all the other tools I mentioned. It’d probably help to have them all in one place.&lt;/p&gt;
&lt;p&gt;I feel like some of the links I have hoarded wouldn&#39;t really &quot;fit&quot; in a link directory. Usually, those links are to blog posts or similar freeform writing. I’ve considered making regular blogroll/postroll posts on here to help with that somewhat, but I guess we’ll just have to wait and see.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;Maybe this is silly, but sometimes I find browsing independent sites to be very overwhelming. It&#39;s ironic, but I feel like the &quot;small web&quot; is much more sprawling than the &quot;big web&quot;. Every site I visit has at least a handful of pages and usually some kind of outlinks/directory page. They link to other sites with their own pages and links, and those linked sites have &lt;em&gt;their&lt;/em&gt; own stuff, and so on and so on. If you try to explore every nook and cranny of someone&#39;s site, even a small site, you&#39;ll have at least 20 tabs open by the end of the day.&lt;/p&gt;
&lt;p&gt;I guess when I put it like that, it describes the original intent of the internet: a vast web of interconnected sites. Maybe my modern-age peabrain just can&#39;t fathom the idea of so many websites existing, let alone trying to categorize them.&lt;/p&gt;
&lt;p&gt;I guess I could just skim everything, just focus on whatever it is I went to that site for, but that doesn&#39;t feel right. Can&#39;t really explain why though. Maybe it&#39;s the same kind of drive that leads people to 100% video games or something. Just not wanting to leave any stone unturned.&lt;/p&gt;
</description>
      <pubDate>Sun, 22 Jun 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/my-terrible-bookmarks-workflow.html</guid>
    </item>
    <item>
      <title>My Deltarune Theories</title>
      <link>https://sainthood.xyz/blog/posts/my-deltarune-theories.html</link>
      <description>&lt;p&gt;Chapters 3 and 4 of Deltarune are right around the corner! I’ve been working on a Deltarune shrine/fan site for a while now. I had a page dedicated to fan theories, both mine and others, that I thought were cool. Unfortunately, I don’t think I’ll be able to get the whole thing out before chapters 3 and 4 release on June 4th, so I figured I’d just share them on my blog instead.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;For the sake of brevity I&#39;m going to try to focus on ones that I came up with. At least I &lt;em&gt;think&lt;/em&gt; I&#39;m the first one to come up with them. Maybe these are really obvious to other people, but whatever.&lt;/p&gt;
&lt;h2 id=&quot;blood&quot;&gt;What’s the Deal With Blood?&lt;/h2&gt;
&lt;figure class=&quot;small right&quot;&gt;
    &lt;img src=&quot;https://sainthood.xyz/assets/images/everybody_bleeds.png&quot; alt=&quot;Everybody bleeds, right? Don&#39;t worry about it.&quot;&gt;
    &lt;img src=&quot;https://sainthood.xyz/assets/images/does_it_hurt.png&quot; alt=&quot;Does it hurt to be made of blood???&quot;&gt;
    &lt;figcaption&gt;
        &lt;p&gt;Some mentions of blood in chapter 1 of Deltarune.&lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;I guess this one is less of a theory and more of an observation. I know I&#39;m not the first person to notice this, it&#39;s pretty blatant, but it&#39;s still interesting enough to talk about in my opinion.&lt;/p&gt;
&lt;p&gt;We&#39;ve received conflicting information about wether or not monsters in the Deltarune universe bleed. In chapter 1, Susie says that &lt;q&gt;Everybody bleeds, right?&lt;/q&gt; which would suggest that they do. However, &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/my-deltarune-theories.html#localization&quot; aria-describedby=&quot;footnote-label&quot; id=&quot;localization-ref&quot;&gt;the Japanese localization makes no mention of blood&lt;/a&gt;, leading some fans to think she was just talking figuratively. Toby Fox works very closely on both versions, and has gone out of his way to preserve certain metaphors in both languages, so if he didn&#39;t preserve this one, maybe its not meant to be taken literally.&lt;/p&gt;
&lt;p&gt;A little later in the chapter, Lancer also makes references to buckets full of blood, which suggest that blood isn&#39;t a strange/foreign concept to the Darkners.&lt;/p&gt;
&lt;p&gt;During the segment in Hometown, things are made more muddy by a monster NPC who asks &lt;q&gt;Ooo, are you the human that lives at the top of the town? Wow, my mommy told me about you... &lt;strong&gt;Does it hurt to be made of blood???&lt;/strong&gt;&lt;/q&gt;&lt;/p&gt;
&lt;p&gt;So, being &quot;made of blood&quot; is something associated with humans, but is it exclusive to them?&lt;/p&gt;
&lt;figure class=&quot;small right&quot;&gt;
    &lt;img style=&quot;width: 74px;height: auto;image-rendering: pixelated;&quot; src=&quot;https://sainthood.xyz/assets/images/susiebleeding.gif&quot; alt=&quot;Susie using healing magic&quot;&gt;
    &lt;figcaption&gt;
        &lt;p&gt;One of the unused sprites, showing Susie bleeding and then healing herself with magic. More unused sprites can be found on &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://tcrf.net/Proto:Deltarune/Chapter_1_%26_2_Demo_(2021)/Unused_Graphics/Party_Members#Susie&quot;&gt;The Cutting Room Floor&lt;/a&gt;.&lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;In chapter 2, there&#39;s an unused sprite of Susie bleeding, but since these aren&#39;t used in the final game I don&#39;t know if I should be taking them at face value.&lt;/p&gt;
&lt;p&gt;In the developer intended way of playing the Snowgrave/weird route, we technically don&#39;t see any characters besides Berdly die, they just get frozen. But there are exploits you can do to power up Noelle early and see her use Snowgrave on regular enemies. The defeat animation in this situation is eerily similar to the &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/my-deltarune-theories.html#death-animation&quot; aria-describedby=&quot;footnote-label&quot; id=&quot;death-animation-ref&quot;&gt;death animation in Undertale&lt;/a&gt;. Maybe the Darkners are the ones that turn to dust? I was going to say that maybe it&#39;s just a placeholder animation at first, but if that was the case wouldn&#39;t they just use the same non-lethal defeat animation that they use in the rest of the game? This feels very intentional to me.&lt;/p&gt;
&lt;p&gt;So, a lot of conflicting information, I&#39;m not really sure what to make of it. I&#39;m just curious to know how they&#39;re going to thread this crazy needle in Chapter 3.&lt;/p&gt;
&lt;h2 id=&quot;eyes&quot;&gt;Eyes, Darkness, and Ignorance&lt;/h2&gt;
&lt;figure class=&quot;small right&quot;&gt;
    &lt;img src=&quot;https://sainthood.xyz/assets/images/eyepuzzle.png&quot; alt=&quot;the Dark World eye puzzle.&quot;&gt;
    &lt;figcaption&gt;
        &lt;p&gt;&lt;q&gt;In this world, only eyes blinded by Darkness can see the way…&lt;/q&gt;&lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;The games eye’s motif is pretty blatant. One of the first puzzles in the entire game is the eye puzzle, the first section of the closet dark world has eyes carved into the walls, and the creatures shown when Ralsei is describing the roaring are cyclopes with similar looking eyes on them. Some fans have even pointed out how certain characters covering their eyes, like Susie in chapter 1 and Kris, could possibly symbolize various things. Lightness and darkness are also very obvious themes of Deltarune. We have the Light World and the Dark Worlds, with their Lightner and Darkner inhabitants, respectively.&lt;/p&gt;
&lt;p&gt;Something I don&#39;t think I&#39;ve seen anyone talk about though is the possibly related motif of ignorance and how it connects to those other themes. I&#39;m not really sure how to fully explain my thoughts. I guess they&#39;re based more so on &quot;vibes&quot; than actual dialog from the game. Bare with me a little bit here.&lt;/p&gt;
&lt;p&gt;We have a lot of phrases in English that equate lightness with knowledge and darkness with lack of knowledge. When someone doesn&#39;t share important information with you, you&#39;re &quot;left in the dark&quot;. When people learn, they become &quot;enlightened&quot;. These figures of speech are often related to sight-based idioms, because people need light to see. For example, we say someone is &quot;blinded by rage&quot; when they&#39;re so angry that they can&#39;t think rationally&lt;/p&gt;
&lt;figure class=&quot;center&quot;&gt;
&lt;div class=&quot;flexcontainer&quot;&gt;
    &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/ralseisroom1.png&quot; alt=&quot;The nameplate reads Asriel&#39;s Room. Peek inside?&quot;&gt;
    &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/ralseisroom2.png&quot; alt=&quot;You opened the door with your eyes closed. You saw nothing.&quot;&gt;
&lt;/div&gt;
&lt;/figure&gt;
&lt;p&gt;There&#39;s this one part of the game that I think about a lot, and I haven&#39;t seen a &lt;em&gt;single&lt;/em&gt; other person talk about it. In Chapter 2, the Queen makes different, personalized rooms for several characters, based off of their internet searches. All of the narration when interacting with these rooms is lighthearted, until Kris reaches Asriel&#39;s room. The player can make Kris open the door, but Kris will just close their eyes.&lt;/p&gt;
&lt;p&gt;Trying to read up on Deltarune fan theories can be so annoying sometimes. &quot;oooooh… is this a reference to Gaster? Is ICE-E the knight??? Is Kris evil?????&quot; &lt;span class=&quot;caps&quot;&gt;Shut up!!! I don&#39;t care about any of that!!! What I really wanna know is why Kris opened the door with their eyes closed!!!!!&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;Anyway, a similar thing also happens in the chapters Light World segment. Kris can go to the second floor of the library and pick up the book &quot;How To Care For A Human&quot;. If you make them read it, they&#39;ll notice the pictures of &quot;unfamiliar humans&quot; and shut it closed.&lt;/p&gt;
&lt;p&gt;I guess a simpler interpretation of that second scene would be centered around Kris being uncomfortable with their humanity. That&#39;s probably the intended reading, but a part of me wants to connect these two sections of the game to the idea of being willfully ignorant. Kris is shown information, possibly even &lt;em&gt;new&lt;/em&gt; information, but they avoid it. They &lt;em&gt;want&lt;/em&gt; to remain in the dark. Ignorance is bliss, after all.&lt;/p&gt;
&lt;p&gt;But I don&#39;t know, maybe I&#39;m just looking too deep into it.&lt;/p&gt;
&lt;h2 id=&quot;asriel&quot;&gt;Asriel Is Not the Same Asriel From Undertale&lt;/h2&gt;
&lt;p&gt;This is maybe a tin foil hat theory, but it’s something I genuinely think could happen and I haven’t seen anyone else bring it up yet so I will. I think it’s possible that Asriel in Deltarune is not the same character as Asriel in Undertale. Not just a different &lt;em&gt;version&lt;/em&gt; of the character, like we’ve seen before with other characters that appear in both games, I mean a &lt;em&gt;totally different&lt;/em&gt; character.&lt;/p&gt;
&lt;p&gt;Why do I think this? For one, the game seems to be hyping up his appearance &lt;strong&gt;a lot&lt;/strong&gt;. More than any of the other returning characters. Imagine how crazy it would be if Toby subverted our exceptions and just made him a totally different guy.&lt;/p&gt;
&lt;p&gt;Secondly, &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/my-deltarune-theories.html#naming&quot; aria-describedby=&quot;footnote-label&quot; id=&quot;naming-ref&quot;&gt;remember how bad Asgore is at naming things&lt;/a&gt;. I mean, Asriel is literally just a mash up of Asgore and Toriel. The name &quot;Asriel&quot; isn&#39;t inherently connected to this one individual character if that makes sense. He wasn&#39;t named after any specific traits he has, he was named that because he&#39;s Asgore and Toriel&#39;s son. Following that logic, Asgore and Toriel would have probably named &lt;em&gt;any&lt;/em&gt; child of their&#39;s Asriel, even if it&#39;s not the Asriel we know in Deltarune.&lt;/p&gt;
&lt;p&gt;If it&#39;s not the same Asriel as in Undertale, maybe this Asriel isn’t a boss monster. Maybe he’s not even Asgore and Toriel&#39;s biological son. The only thing we know about him visually is that he has horns. We find this out when talking to Toriel in hometown in Chapter 1, when she tells the story of Asriel&#39;s horns coming in and Kris getting jealous. But a lot of monsters have horns, not just boss monsters. Maybe he&#39;s some other kind of monster.&lt;/p&gt;
&lt;h2 id=&quot;notreindeer&quot;&gt;Dess and Mayor Holiday Are Not Reindeer&lt;/h2&gt;
&lt;p&gt;In a similar vain, I wonder if Dess and Mayor Holiday are reindeer monsters. Again, another tinfoil hat theory, but I feel like it&#39;s more likely than the Asriel one, since Dess and Mayor Holiday (technically) aren&#39;t returning characters.&lt;/p&gt;
&lt;p&gt;In the Xbox One version of Undertale, Sans describes Noelle and Dess as &quot;the antlered girl and her big sis&quot;. This strongly implies that Dess &lt;em&gt;doesn&#39;t&lt;/em&gt; have horns. This is maybe a stretch, but what if the two are totally different species of monster? Maybe Dess’s species just doesn’t have horns, while Noelle’s does.&lt;/p&gt;
&lt;p&gt;We see a lot of cross-species couples in Undertale and Deltarune, but I don&#39;t think we&#39;ve ever seen a &quot;mixed species&quot; family. With the obvious exception of Toriel and Asgore adopting the fallen child/Kris, every family we see in the games are of a single species. I don&#39;t think there&#39;s any major lore implications of this, it&#39;s just easier to convey that two random NPCs are related by giving them similar designs, but it would be interesting to see it subverted.&lt;/p&gt;
&lt;p&gt;The more I think about it, maybe it would add some interesting parallels to Noelle and Kris’s relationship. Not only are they childhood friends who both have older siblings, but those older siblings are completely different species from them. Kris is very insecure about not being a monster, but maybe Noelle handles it differently? Obviously, she&#39;s still a monster, but you know what I mean. Maybe the game could compare and contrast the two’s experiences, that’d lead to some interesting character moments, I feel.&lt;/p&gt;
&lt;h2 id=&quot;footnote-label&quot;&gt;Footnotes&lt;/h2&gt;
&lt;ol class=&quot;footnotes&quot;&gt;
&lt;li id=&quot;localization&quot;&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.reddit.com/r/Deltarune/comments/wlwad3/blood_mystery_susie_actually_made_no_mention_of/&quot;&gt;Blood mystery: Susie actually made no mention of bleeding&lt;/a&gt;. &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/my-deltarune-theories.html#localization-ref&quot; aria-label=&quot;Back to content&quot;&gt;↩︎&lt;/a&gt;&lt;/li&gt;
&lt;li id=&quot;death-animation&quot;&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://youtu.be/WKT__Hkpkt4?si=VLAswKbEHD6rI5hL&amp;t=18&quot;&gt;Snowgrave death animation&lt;/a&gt;. &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/my-deltarune-theories.html#death-animation-ref&quot; aria-label=&quot;Back to content&quot;&gt;↩︎&lt;/a&gt;&lt;/li&gt;
&lt;li id=&quot;naming&quot;&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://nochocolate.tumblr.com/post/135286005625/undertale-spoilers-at-first-glance-the-two&quot;&gt;This Tumblr post&lt;/a&gt; covers all the times in Undertale where it&#39;s explicitly mentioned that Asgore sucks at naming things. &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/my-deltarune-theories.html#naming-ref&quot; aria-label=&quot;Back to content&quot;&gt;↩︎&lt;/a&gt;&lt;/li&gt;
&lt;/ol&gt;
</description>
      <pubDate>Fri, 30 May 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/my-deltarune-theories.html</guid>
    </item>
    <item>
      <title>CSS Tabs with Default Open Tab</title>
      <link>https://sainthood.xyz/code/snippets/css-tabs-with-default-open-tab.html</link>
      <description>&lt;p&gt;This is a minor edit of &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://kalechips.net/projects/snippets/tabs&quot;&gt;Kalechip’s CSS Tabs&lt;/a&gt;. I originally made it for &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/meta/changelog&quot;&gt;my changelog&lt;/a&gt;, because I wanted people to be able to filter through different years, but also I didn’t want to deal with JavaScript or PHP. The original has all tab content hidden by default until you click a tab. This edit lets you set a default tab, which is visible by default.&lt;/p&gt;
&lt;h2&gt;Demo&lt;/h2&gt;
&lt;div class=&quot;box&quot;&gt;
    &lt;p class=&quot;speciallink&quot; style=&quot;padding: 0.25em 0 1em 0;&quot;&gt;
        &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/css-tabs-with-default-open-tab.html#dogs&quot;&gt;Dogs&lt;/a&gt;
        &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/css-tabs-with-default-open-tab.html#cats&quot;&gt;Cats&lt;/a&gt;
        &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/css-tabs-with-default-open-tab.html#bunnies&quot;&gt;Bunnies&lt;/a&gt;
    &lt;/p&gt;
    &lt;div class=&quot;tabwrap&quot;&gt;
        &lt;section id=&quot;cats&quot;&gt;
            &lt;h3&gt;Cats&lt;/h3&gt;
            &lt;p&gt;I like cats too! 🐱&lt;/p&gt;
        &lt;/section&gt;
        &lt;section id=&quot;bunnies&quot;&gt;
            &lt;h3&gt;Bunnies&lt;/h3&gt;
            &lt;p&gt;I also think bunnies are super cute! 🐰&lt;/p&gt;
        &lt;/section&gt;
        &lt;section class=&quot;default&quot; id=&quot;dogs&quot;&gt;
            &lt;h3&gt;Dogs&lt;/h3&gt;
            &lt;p&gt;I love dogs! 🐶&lt;br&gt;(this is the default tab)&lt;/p&gt;
        &lt;/section&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;h2 id=&quot;html&quot;&gt;HTML&lt;/h2&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token comment&quot;&gt;&amp;lt;!-- Tab links --&amp;gt;&lt;/span&gt;
&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;p&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;a&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;#tab1&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Tab #1&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;a&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt; &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;a&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;#tab2&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Tab #2&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;a&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;p&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;

&lt;span class=&quot;token comment&quot;&gt;&amp;lt;!-- Tab content --&amp;gt;&lt;/span&gt;
&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;div&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;tabwrap&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;section&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;id&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;tab2&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
        &lt;span class=&quot;token comment&quot;&gt;&amp;lt;!--Regular tab content here--&amp;gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;section&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;section&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;default&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;id&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;tab1&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
        &lt;span class=&quot;token comment&quot;&gt;&amp;lt;!--Default tab content here--&amp;gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;section&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;div&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;mark&gt;You &lt;em&gt;&lt;strong&gt;must&lt;/strong&gt;&lt;/em&gt; put your default tab at the &lt;em&gt;bottom&lt;/em&gt; of your tabwrap, &lt;em&gt;after&lt;/em&gt; all of the other tabs.&lt;/mark&gt; The CSS will not work properly otherwise. The order of the other tabs doesn&#39;t matter. Change &quot;tab1&quot; and &quot;tab2&quot; to whatever you want your tab&#39;s names to be.&lt;/p&gt;
&lt;p&gt;For accessibility, I highly recommend starting each tab content section with a heading (&lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt;-&lt;code&gt;&amp;lt;h6&amp;gt;&lt;/code&gt;).&lt;/p&gt;
&lt;h2 id=&quot;css&quot;&gt;CSS&lt;/h2&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;.tabwrap section.default&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;token property&quot;&gt;display&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; block&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;
&lt;span class=&quot;token selector&quot;&gt;.tabwrap section&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;token property&quot;&gt;display&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; none&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;
&lt;span class=&quot;token selector&quot;&gt;.tabwrap section:target&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;token property&quot;&gt;display&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;block&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;
&lt;span class=&quot;token selector&quot;&gt;.tabwrap section:target ~ section.default&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;token property&quot;&gt;display&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;none&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;</description>
      <pubDate>Wed, 14 May 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/code/snippets/css-tabs-with-default-open-tab.html</guid>
    </item>
    <item>
      <title>My Hopes for Rhythm Heaven Groove</title>
      <link>https://sainthood.xyz/blog/posts/my-hopes-for-rhythm-heaven-groove.html</link>
      <description>&lt;figure class=&quot;center&quot;&gt;
    &lt;div style=&quot;position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%; margin-bottom: 1rem;&quot;&gt;
  &lt;iframe width=&quot;560&quot; height=&quot;315&quot; src=&quot;https://www.youtube.com/embed/ZkgjFacpnLE&quot; frameborder=&quot;0&quot; allow=&quot;accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture&quot; style=&quot;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;&quot; allowfullscreen=&quot;&quot;&gt;&lt;/iframe&gt;
&lt;/div&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            The announcement trailer for Rhythm Heaven Groove.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;!-- excerpt start --&gt;
&lt;p&gt;After ten long years, a &lt;em&gt;whole entire&lt;/em&gt; &lt;em&gt;&lt;strong&gt;decade&lt;/strong&gt;&lt;/em&gt;, we finally have it: a new Rhythm Heaven game.&lt;/p&gt;
&lt;!-- excerpt end --&gt;
&lt;p&gt;It might seem silly, but I can not overstate, how excited I am for this game. No joke, this game is to me and my siblings what GTA VI probably is for most other people.&lt;/p&gt;
&lt;p&gt;Over the course of the past week or so, Nintendo fans have been flooded with new info about upcoming releases for the Switch, and launch titles for the Switch 2. This game is &lt;em&gt;still&lt;/em&gt; at the top of my priorities. Elden Ring? Silk Song? Zelda? Couldn&#39;t care less. The Switch 2 supporting 4k resolution and 120FPS or whatever? Who gives a shit! But this wacky little Rhythm Game? You have my full and undivided attention.&lt;/p&gt;
&lt;p&gt;The only other game covered in the direct that matches this level of hype for me is Deltarune, which is another game that holds a very special place in my heart. But anyone who&#39;s been paying attention to Deltarune knew that new chapters were dropping sometime this year, Rhythm Heaven Grooves announcement came totally out of left field, and after a very long hiatus too!&lt;/p&gt;
&lt;p&gt;I am not a game journalist, so sorry if this post isn&#39;t super well-written. I just really wanted to share my hopes and predictions for Rhythm Heaven Groove while it&#39;s still fresh in peoples minds.&lt;/p&gt;
&lt;h2&gt;A Possible Return To Form&lt;/h2&gt;
&lt;p&gt;The most recent release in the series, Rhythm Heaven Megamix, is sometimes considered the black sheep of the franchise. It&#39;s the only entry in the series to have a story mode, mostly includes remakes of old minigames from past games instead of new ones, and adds a bunch of other new features. Some fans love it, while others hate it.&lt;/p&gt;
&lt;p&gt;I think a lot of fans are wondering: is Megamix the direction the series is going to go from now on, or was it just a fluke? A part of me feels like the series might be going back to its roots. The new character shown in the trailer says that Groove &amp;quot;doesn&#39;t have a big, epic story&amp;quot;, which Megamix did. All the minigames shown in the trailer seem to be original as well.&lt;/p&gt;
&lt;p&gt;That being said, I hope they still bring back some features from Megamix. I really liked the way megamix handled &amp;quot;collectibles&amp;quot; and in-game currency. I think it added a lot of replay value to the minigames without making it feel redundant. I also really liked how the bottom screen showed you how early/late your inputs were. It actually gives you an idea of how to improve your gameplay, instead of the older games which might as well tell you to &amp;quot;do it again, but better!&amp;quot; when you fail. I&#39;m not sure how that&#39;s going to work out though, since the switch only has one screen. None of the gameplay shown in the trailer has any extra UI elements, so maybe they&#39;re just not including it.&lt;/p&gt;
&lt;h2&gt;Improving The Story Mode&lt;/h2&gt;
&lt;p&gt;Something that a lot of people really appreciate about the first few games in the series is how to-the-point they are. There&#39;s a very brief tutorial and then you&#39;re thrown into the game menu. No padding, no bullshit. It&#39;s very easy to just pick up and play.&lt;/p&gt;
&lt;p&gt;A lot of fans disliked the story mode that was introduced in Rhythm Heaven Megamix, because now you have to button mash through a bunch of dialogue after every minigame. I think it&#39;s pretty safe to say that Rhythm Heaven does not need a heavy plot for it to function. I don&#39;t want to have to untangle some crazy, JRPG-style story, I just want to play my damn rhythm games!&lt;/p&gt;
&lt;p&gt;As I mentioned earlier, the trailer mentions that Groove &amp;quot;doesn&#39;t have a big, epic story&amp;quot;, but does that mean it doesn&#39;t have a story at all? Or just that the story is going to be more toned-down than Megamix&#39;s? I&#39;m not against them including story mode. Warioware, the other franchise that this dev team works on, has a story mode in all of their games that nobody complains about, and a wonderful cast of characters that its fans love. I&#39;m sure with a few edits, people would say the same thing about Rhythm Heaven!&lt;/p&gt;
&lt;p&gt;I feel like there&#39;s a couple ways they could go about this. For one, they could try better connecting the story mode to the minigames. For example, in Warioware, the microgames include characters from the rest of the game. Wario will show up both in the story mode and as a character in his own microgame. It makes everything feel more connected. Maybe I&#39;d care more about the characters in Rhythm Heaven&#39;s story mode if they showed up in the rhythm games themselves?&lt;/p&gt;
&lt;p&gt;Alternatively, they could just have the main game be like how it was in the older entries, and have the story mode be a separate mode. Or they could just do what Warioware does and have the story mode be video cutscenes instead of visual novel-esque text boxes. At least then, people who don&#39;t want to see it just have to skip it once instead of button mashing.&lt;/p&gt;
&lt;h2&gt;Better Multiplayer&lt;/h2&gt;
&lt;figure class=&quot;small right&quot;&gt;
        &lt;img src=&quot;https://sainthood.xyz/assets/images/FlipperFlop2Pgameplay.png&quot; alt=&quot;Screenshot of the two-player Flipper Flop minigame.&quot;&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            The two-player version of Flipper Flop for Rhythm Heaven Fever. Player One&#39;s character is tinted blue, while Player Two&#39;s is tinted orange.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;Something I really like about the Rhythm Heaven Games that I don&#39;t see a lot of people talk about is the multiplayer aspect. I often play Rhythm Heaven with my younger siblings, so being able to actually play &lt;em&gt;with&lt;/em&gt; them is a real treat. I&#39;d really love to see them expand on this in the new game.&lt;/p&gt;
&lt;p&gt;So far we&#39;ve seen them implement multiplayer in two different ways: the &amp;quot;true multiplayer&amp;quot; in Rhythm Heaven Fever, and the multiplayer challenge train in Rhythm Heaven Megamix. Personally, I prefer the way Fever did it, but both ways can be really fun and have their own sets of pros and cons.&lt;/p&gt;
&lt;p&gt;Considering how time-sensitive rhythm games are, and how bad online lag can be, it&#39;d be really difficult to include Fever-style multiplayer. Maybe they still could, but it&#39;d probably have to be local multiplayer only. There&#39;s a lot more they could do with the challenge train-style of multiplayer, since it allows for some asynchronous gameplay.&lt;/p&gt;
&lt;p&gt;All of the challenge train gameplay is cooperative. If one person wins, the other players still get rewarded. I wonder if they could add a competitive aspect to it. Maybe give the player the ability to sabotage the others? Or add a &amp;quot;last man standing&amp;quot; style of challenge? Or even something as simple as competing to see who can get a higher score? Like I mentioned earlier, these are the same people who make Warioware. WarioWare: Get It Together has tons of multiplayer options, both competitive and cooperative. I&#39;m sure they could come up with some cool ideas for this game too.&lt;/p&gt;
&lt;h2&gt;Voice Acting&lt;/h2&gt;
&lt;p&gt;The new character shown in the trailer talks! It sounds like text-to-speech, not a real voice actor, but still. I wonder if there&#39;s actually going to be voice acting in the game, or if they only did that for the trailer. Personally, I think it&#39;d be fun if they included it in the actual game.&lt;/p&gt;
&lt;h2&gt;The Price&lt;/h2&gt;
&lt;p&gt;How much will the game cost? Most Switch games go for around $60. Apparently Switch 2 games are going to cost at least $80. I still can&#39;t get over spending &lt;em&gt;$60&lt;/em&gt; on a game, so the idea of spending &lt;em&gt;$80&lt;/em&gt; on a &lt;em&gt;digital&lt;/em&gt; game makes me want to shrivel into dust. Thankfully, Groove is releasing for the &lt;em&gt;original&lt;/em&gt; Switch, so we don&#39;t have to set our expectations to be &lt;em&gt;that&lt;/em&gt; expensive.&lt;/p&gt;
&lt;p&gt;My brother is convinced that it&#39;ll be $30. I told him that&#39;s way too low, I spent $35 on Megamix when it first came out and that was for the 3DS, but he is adamant. If I had to guess, I&#39;d say it&#39;ll probably be $60, maybe $50. No, it&#39;s not a highly anticipated game, but it&#39;s still a first party Nintendo game on a home console. It&#39;s naive to think that they still won&#39;t try to nickle and dime us as much as they can.&lt;/p&gt;
&lt;h2&gt;My Now-Outdated Shrine&lt;/h2&gt;
&lt;figure class=&quot;center&quot;&gt;
        &lt;img src=&quot;https://sainthood.xyz/assets/images/rhshrinescreenshot.png&quot; alt=&quot;It has been 3555 days, or 10 years, since the last Rhythm Heaven game was released.&quot;&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            A screenshot from my unfinished Rhythm Heaven Shrine. Please note that the numbers shown here are probably wrong.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;Not directly related to the new game, but fuck it! It&#39;s my blog and I can talk about whatever I want!&lt;/p&gt;
&lt;p&gt;I&#39;ve been working on a shrine/fan site for the Rhythm Heaven Series for a while now. Here&#39;s a little sneak peak of a, now outdated, widget I had on it. I&#39;ll probably have to remove it now that we know there&#39;s a new game coming out.&lt;/p&gt;
</description>
      <pubDate>Wed, 02 Apr 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/my-hopes-for-rhythm-heaven-groove.html</guid>
    </item>
    <item>
      <title>Mini Knitting Showcase</title>
      <link>https://sainthood.xyz/blog/posts/mini-knitting-showcase.html</link>
      <description>&lt;p&gt;Lately, I&#39;ve been trying to have more hobbies that don&#39;t involve staring at a screen for hours on end. Last year, I got really into making kandi bracelets. This year, I&#39;ve decided to take up knitting.&lt;/p&gt;
&lt;p&gt;I want to start working on more actual knitting projects with practical uses, and I want to get in the habit of using this blog more often. So, I thought I&#39;d kill two birds with one stone and show you all what I&#39;ve made recently.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;h2&gt;Catnip Bunnies&lt;/h2&gt;
&lt;p&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.ravelry.com/patterns/library/catnip-bunny&quot;&gt;Catnip bunnies&lt;/a&gt; are cat toys that are shaped like cute little bunnies! The pattern is very easy to remember and doesn&#39;t take that long to make.&lt;/p&gt;
&lt;p&gt;Basically, you knit a drawstring bag and then fill it with toy stuffing and catnip. Then, you add its ears and optional embroidered face to give it its rabbit features. The instructions also suggest giving it a tail, but I opted to skip that part.&lt;/p&gt;
&lt;figure class=&quot;center&quot;&gt;
    &lt;img src=&quot;https://sainthood.xyz/assets/images/catnip_bunnies_1.jpg&quot; alt=&quot;My first batch of catnip bunnies.&quot;&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            My first batch of catnip bunnies.
        &lt;/p&gt;
        &lt;p&gt;
            &lt;b&gt;From left to right:&lt;/b&gt; A coral pink bunny with a winking expression, a smaller red bunny with X&#39;s for eyes, and an even smaller white bunny with both of its eyes closed.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;My first batch of catnip bunnies were under-stuffed. That&#39;s one of the first things I learned about knitting plush toys: There&#39;s basically no such thing as over-stuffing them. Not to mention plush filling deteriorates a &lt;em&gt;lot&lt;/em&gt; and quickly, so it&#39;s best to fill them up as much as you can.&lt;/p&gt;
&lt;p&gt;I went with some Squishmallow-inspired faces for this batch. For some reason I got into my head that Squishmallow&#39;s don&#39;t have mouths, which is wrong, but what&#39;s done is done I guess. It was also my first time embroidering with yarn, which is why it looks so sloppy.&lt;/p&gt;
&lt;figure class=&quot;center&quot;&gt;
    &lt;img src=&quot;https://sainthood.xyz/assets/images/catnip_bunnies_2.jpg&quot; alt=&quot;My second batch of catnip bunnies.&quot;&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            My second batch of catnip bunnies.
        &lt;/p&gt;
        &lt;p&gt;
            &lt;b&gt;From top to bottom, left to right:&lt;/b&gt; A coral pink bunny with both of its eyes closed, a dark purple bunny with white eyes and mouth, a camouflage patterned bunny with an annoyed/angry expression, a smiling light green bunny, and a calm medium green bunny. They&#39;re all about the same size.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;I ended up making a bunny for almost every color of yarn I had. I tried experimenting with different faces. There are a &lt;em&gt;lot&lt;/em&gt; of failed attempts not pictured here. I decided actually giving them mouths made them look cuter and made the expressions easier to tell apart.&lt;/p&gt;
&lt;figure class=&quot;center&quot;&gt;
    &lt;div class=&quot;flexcontainer&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/catnip_bunny_unstuffed.jpg&quot; alt=&quot;&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/catnip_bunnies_3.jpg&quot; alt=&quot;&quot;&gt;
        &lt;img class=&quot;third&quot; src=&quot;https://sainthood.xyz/assets/images/catnip_bunnies_4.jpg&quot; alt=&quot;&quot;&gt;
    &lt;/div&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            &lt;b&gt;Left:&lt;/b&gt; A catnip bunny before it&#39;s stuffed. The drawstring hasn&#39;t been pulled yet and it&#39;s missing its ears.
        &lt;/p&gt;
        &lt;p&gt;
            &lt;b&gt;Center:&lt;/b&gt; &quot;Rejects&quot; from my second batch. A red bunny and a bunny with a blue to green hue shift. Their faces look a bit wonky.
        &lt;/p&gt;
        &lt;p&gt;
            &lt;b&gt;Right:&lt;/b&gt; A bonus rainbow &quot;catnip&quot; bunny with a winking expression. The yarn I used for this one was too delicate, so I decided to make it a normal plush instead of a cat toy, and not put catnip in it.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;I don&#39;t have any photos of this unfortunately, but I did eventually gift some of these to a family friend who has a cat. The bunnies work exactly as intended, both the cat and the owner love them! I was worried that hand-made toys might not be able to withstand too much roughhousing, but they seem pretty durable so far.&lt;/p&gt;
&lt;h2&gt;Mug Cozy&lt;/h2&gt;
&lt;p&gt;This &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://craftingfingers.co.uk/archives/diy-braided-cable-mug-cosy-with-free-pattern/&quot;&gt;mug cozy pattern&lt;/a&gt; is more complicated, but after making all those cat toys, I was looking for a bit of a challenge. I had to restart this one a few times, the whole thing took me forever, and there are still visible errors in the final product, but it was still very rewarding.&lt;/p&gt;
&lt;p&gt;I already knew how to cable knit but this was my first time actually using it for a project. This was also my first time adding buttons and binding off/casting on in the middle of a project (for the button hole). A lot of firsts for this one!&lt;/p&gt;
&lt;figure class=&quot;center&quot;&gt;
    &lt;img src=&quot;https://sainthood.xyz/assets/images/mug_cozy.jpg&quot; alt=&quot;The mug cozy laid out.&quot;&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            The red mug cozy laid out flat on the table. The edges use a wavy/bumpy garter stitch and the middle uses a flatter purl stitch with a braided pattern in the center. The cozy has a button stitched on at one end and a button hole on the other, to let it fasten around a cup or mug.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;The edges of the cozy curve up a little bit when you try to lay it flat. This isn&#39;t really a problem when it&#39;s actually wrapped around something, though. I&#39;ve never blocked any of my yarn pieces before, maybe I should do that sometime.&lt;/p&gt;
&lt;figure class=&quot;center&quot;&gt;
    &lt;div class=&quot;flexcontainer&quot;&gt;
        &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/mug_cozy_glass_1.jpg&quot; alt=&quot;The mug cozy wrapped around a glass (front).&quot;&gt;
        &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/mug_cozy_glass_2.jpg&quot; alt=&quot;The mug cozy wrapped around a glass (side view).&quot;&gt;
    &lt;/div&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            The mug cozy wrapped around a glass.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;figure class=&quot;center&quot;&gt;
    &lt;div class=&quot;flexcontainer&quot;&gt;
        &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/mug_cozy_mug_1.jpg&quot; alt=&quot;The mug cozy wrapped around a mug (right side view).&quot;&gt;
        &lt;img class=&quot;half&quot; src=&quot;https://sainthood.xyz/assets/images/mug_cozy_mug_2.jpg&quot; alt=&quot;The mug cozy wrapped around a mug (left side view).&quot;&gt;
    &lt;/div&gt;
    &lt;figcaption&gt;
        &lt;p&gt;
            The mug cozy wrapped around a mug. The ends can fit through the handle.
        &lt;/p&gt;
    &lt;/figcaption&gt;
&lt;/figure&gt;
&lt;p&gt;Not as much to say about this one as I did about the bunnies. I only made one of them and it (supposedly) keeps your drink warm. Not much else to explain, really.&lt;/p&gt;
&lt;h2&gt;Misc Thoughts&lt;/h2&gt;
&lt;p&gt;Random opinions and observations that I wanted to share but couldn&#39;t fit anywhere else.&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Don&#39;t worry about splurging on fancy/expensive yarn. You can get a lot of decent crafting supplies at the dollar store.&lt;/li&gt;
&lt;li&gt;I had no idea how cheap toy stuffing was until now. I ended up buying way more than I needed and have a &lt;em&gt;ton&lt;/em&gt; left over.&lt;/li&gt;
&lt;li&gt;I&#39;ve come to really like the ease and portability of knitting. It doesn&#39;t make much of a mess, it&#39;s light and easy to carry around, and it&#39;s not too distracting to others. I can work on a small project while on public transportation or in a waiting room.&lt;/li&gt;
&lt;li&gt;Yarn is a lot easier to store than plastic beads. Figuring out storage for crafting supplies &lt;em&gt;in general&lt;/em&gt; is a huge pain in the ass for me. Maybe I&#39;ll write about that some time.&lt;/li&gt;
&lt;/ul&gt;
</description>
      <pubDate>Tue, 25 Mar 2025 19:00:00 CDT</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/mini-knitting-showcase.html</guid>
    </item>
    <item>
      <title>Rendering Pixel Art</title>
      <link>https://sainthood.xyz/code/snippets/rendering-pixel-art.html</link>
      <description>
&lt;p&gt;
    A super simple one, but one I still see some people struggle with. Modern browsers make pixel art look blurry when scaled up. We can use the CSS &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; class=&quot;external&quot; href=&quot;https://developer.mozilla.org/en-US/docs/Web/CSS/image-rendering&quot;&gt;image-rendering property&lt;/a&gt; to fix this.
&lt;/p&gt;

&lt;div class=&quot;box flexcontainer&quot;&gt;
    &lt;div class=&quot;half&quot;&gt;
        &lt;img src=&quot;https://sainthood.xyz/assets/images/pikachu.png&quot; alt=&quot;&quot;&gt;
        &lt;p&gt;No styling&lt;/p&gt;
    &lt;/div&gt;
    &lt;div class=&quot;half&quot;&gt;
        &lt;img class=&quot;pixelated&quot; src=&quot;https://sainthood.xyz/assets/images/pikachu.png&quot; alt=&quot;&quot;&gt; 
        &lt;p&gt;With &lt;code&gt;image-rendering: pixelated;&lt;/code&gt;&lt;/p&gt;
    &lt;/div&gt;
&lt;/div&gt;

&lt;h3 class=&quot;noborder&quot;&gt;HTML&lt;/h3&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;img&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;pixelated&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;image.png&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;h3 class=&quot;noborder&quot;&gt;CSS (Minimum Compatibility)&lt;/h3&gt;
&lt;p&gt;Works on all major and modern browsers&lt;/p&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;img.pixelated&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;image-rendering&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; pixelated&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;h3 class=&quot;noborder&quot;&gt;CSS (Maximum Compatibility)&lt;/h3&gt;
&lt;p&gt;Also works for older and more obscure browsers&lt;/p&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;img.pixelated&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;image-rendering&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; crisp-edges&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;image-rendering&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; pixelated&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;image-rendering&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; -moz-crisp-edges&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;</description>
      <pubDate>Thu, 02 Jan 2025 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/code/snippets/rendering-pixel-art.html</guid>
    </item>
    <item>
      <title>Link ::before Effects</title>
      <link>https://sainthood.xyz/code/snippets/link-before-effects.html</link>
      <description>
&lt;h2 id=&quot;before-link&quot;&gt;Sprite before link&lt;/h2&gt;
&lt;div class=&quot;box&quot;&gt;
    &lt;ul class=&quot;demoone&quot;&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #1&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #2&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #3&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;
&lt;h3 class=&quot;noborder&quot;&gt;HTML&lt;/h3&gt;
&lt;p&gt;I&#39;ll be using this HTML structure for all of the examples on this page.&lt;/p&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;ul&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;className&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;a&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;#&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Link #1&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;a&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;a&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;#&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Link #2&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;a&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;a&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;#&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Link #3&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;a&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;ul&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;h3 class=&quot;noborder&quot;&gt;CSS&lt;/h3&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;ul.className a::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;heartspin.gif&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;margin-right&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0.5em&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Optional, extra spacing so it looks nicer */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.className&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;list-style&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; none&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* removes list bullets */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;A pretty basic, but fun way to customize links. Best suited for links in simple lists or navigation menus, not in the main content.&lt;/p&gt;

&lt;h2 id=&quot;animate-sprite&quot;&gt;Animate Sprite on Hover&lt;/h2&gt;
&lt;h3 id=&quot;single-sprite&quot;&gt;Single Sprite Type&lt;/h3&gt;
&lt;div class=&quot;box&quot;&gt;
    &lt;ul class=&quot;demotwo&quot;&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #1&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #2&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #3&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;ul.className a::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;mascot.gif&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* This is your default/still sprite */&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;margin-right&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0.5em&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Optional, extra spacing so it looks nicer */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.className a:hover::before, ul.className a:focus::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;mascot-animated.gif&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* This is your animated sprite */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.className&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;list-style&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; none&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* removes list bullets */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;I really like this one. It gives the impression that we&#39;ve &quot;paused&quot; and &quot;played&quot; the GIF without any fancy scripting! All you have to do is save your regular animated GIF and a still frame from that GIF separately. Set the still one as your default sprite and the animated one for when the link is hovered over or focused on.&lt;/p&gt;
&lt;p&gt;You can get the first frame of the GIF by using &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; class=&quot;external&quot; href=&quot;https://ezgif.com/split&quot;&gt;Ezgif&lt;/a&gt;, or any image editor that supports animation. Why save the still image as a GIF? I noticed that saving it as a PNG made the colors a little off. If you want it to seamlessly transition, you&#39;ll want the colors to match.&lt;/p&gt;

&lt;h3 id=&quot;multiple-sprites&quot;&gt;Multiple Sprite Types&lt;/h3&gt;
&lt;div class=&quot;box&quot;&gt;
    &lt;ul class=&quot;demothree&quot;&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #1&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #2&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #3&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;ul.className li a::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;mascot1.gif&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* First still sprite */&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;margin-right&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0.5em&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Optional, extra spacing so it looks nicer */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.className li a:hover::before, ul.className li a:focus::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;mascot1-animated.gif&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* First animated sprite */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.className li:nth-of-type(3n-1) a::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;mascot2.gif&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Second still sprite */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.className li:nth-of-type(3n-1) a:hover::before, ul.className li:nth-of-type(3n-1) a:focus::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;mascot2-animated.gif&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Second animated sprite */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.className li:nth-of-type(3n) a::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;mascot3.gif&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Third still sprite */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.className li:nth-of-type(3n) a:hover::before, ul.className li:nth-of-type(3n-1) a:focus::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;mascot3-animated.gif&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Third animated sprite */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.className&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;list-style&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; none&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* removes list bullets */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Here&#39;s a little snippet I made for myself that uses multiple images before the links. I was originally going to use it for a project I&#39;m working on, but I didn&#39;t like how it looked with the rest of the layout I designed. Still, I thought it was cute and some people might find it useful, so I&#39;m sharing it with you guys now!&lt;/p&gt;
&lt;p&gt;I used the &lt;code&gt;:nth-of-type&lt;/code&gt; pseudo-class to select the second and third links and define them separately from the default link. Note that the second sprite &lt;em&gt;doesn&#39;t&lt;/em&gt; use &lt;code&gt;:nth-of-type(2n)&lt;/code&gt;. That would select every second link. Instead it uses &lt;code&gt;:nth-of-type(3n-1)&lt;/code&gt;, which selects the link before every third link. This also creates a repeating pattern, so if I added more links it&#39;d just repeat the pattern of the sprites before them indefinitely.&lt;/p&gt;

&lt;h2 id=&quot;show-sprite&quot;&gt;Show Sprite on Hover&lt;/h2&gt;
&lt;div class=&quot;box&quot;&gt;
    &lt;ul class=&quot;demofour&quot;&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #1&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #2&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/snippets/link-before-effects.html&quot;&gt;Link #3&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;nav ul a::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;heart.png&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;margin-right&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0.4em&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Optional, extra spacing so it looks nicer */&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;visibility&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; hidden&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Hides our sprite without collapsing the space it takes up */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;nav ul a:hover::before, nav ul a:focus::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;visibility&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; visible&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Shows our sprite */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Take note that the &lt;code&gt;visibility&lt;/code&gt; property is different from the &lt;code&gt;display&lt;/code&gt; property. &lt;code&gt;display: none;&lt;/code&gt; treats the element as if it&#39;s been completely removed, removing all the space that element takes up. &lt;code&gt;visibility: hidden;&lt;/code&gt; just makes the element invisible. Our sprite still takes up space, it just isn&#39;t shown. This is done to avoid the text shifting around, which can be very annoying.&lt;/p&gt;</description>
      <pubDate>Fri, 27 Dec 2024 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/code/snippets/link-before-effects.html</guid>
    </item>
    <item>
      <title>Accessible Eleventy Gallery</title>
      <link>https://sainthood.xyz/code/projects/accessible-eleventy-gallery/</link>
      <description>&lt;h2&gt;About&lt;/h2&gt;
&lt;p&gt;This project is an adaptation of &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://kalechips.net/projects/code/static-gallery/info&quot;&gt;Kalechip&#39;s Static Accessible Gallery Generator&lt;/a&gt; for Eleventy.&lt;/p&gt;
&lt;p&gt;The internet has no shortage of gallery frameworks, why bother adding another to the list? To be honest, a lot of existing frameworks aren&#39;t that great. They&#39;re clunky, bloated, and most importantly, &lt;em&gt;inaccessible&lt;/em&gt;. For the longest time I felt like I was going insane because no one else seemed to have the same concerns/issues I did, but then I stumbled upon &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://blog.kalechips.net/post/2023-08-21-Image-Gallery&quot;&gt;this blog post by Kalechips&lt;/a&gt;. My concerns were finally validated, hooray!&lt;/p&gt;
&lt;p&gt;Kale was able to solve the aforementioned issues by creating their own gallery generator. I like it a lot, but when I switched my site over to 11ty, I found it hard to manage two static site generators at once. This project is my attempt to adapt their gallery framework to an 11ty workflow.&lt;/p&gt;

&lt;h3&gt;Features&lt;/h3&gt;
&lt;ul&gt;
    &lt;li&gt;Easy way to add alt text and image descriptions.&lt;/li&gt;
    &lt;li&gt;Can be used as an 11ty starter project or integrated into existing projects.&lt;/li&gt;
    &lt;li&gt;No annoying lightboxes.&lt;/li&gt;
    &lt;li&gt;Easy to customize!&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;Usage&lt;/h2&gt;
&lt;p&gt;In short, you organize everything in a JSON file and 11ty generates all your gallery&#39;s pages automatically by &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.11ty.dev/docs/pages-from-data/&quot;&gt;creating pages from data&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;In long:&lt;/p&gt;
&lt;ol&gt;
    &lt;li&gt;Organize your JSON.&lt;/li&gt;
    &lt;li&gt;Add the layouts to your &lt;code&gt;_includes&lt;/code&gt; folder.&lt;/li&gt;
    &lt;li&gt;Add the gallery folder, with its contents, to the desired location. The permalinks and filepaths I used might be different from your setup, so remember to double-check the frontmatter of both files.&lt;/li&gt;
    &lt;li&gt;Start Eleventy!&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;You can also have as many different galleries as you want, just as long as they pull data from different JSON files! For example: you can have one gallery use data from dogPhotos.json and another that pulls from catPhotos.json.&lt;/p&gt;

&lt;h2&gt;Licensing&lt;/h2&gt;
&lt;p&gt;This project is licensed under the &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.gnu.org/licenses/gpl-3.0.en.html&quot;&gt;GNU General Public License v3&lt;/a&gt;.&lt;/p&gt;</description>
      <pubDate>Fri, 27 Dec 2024 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/code/projects/accessible-eleventy-gallery/</guid>
    </item>
    <item>
      <title>Inline Lists and List Item Separators</title>
      <link>https://sainthood.xyz/code/snippets/inline-lists-and-list-item-separators.html</link>
      <description>
&lt;p&gt;Inline/horizontal lists are especially useful for making simple, responsive navigation menus. Typically, list items in HTML are preceded with a bullet, but using CSS, we can change it so that whatever symbol we want only appears &lt;em&gt;in-between&lt;/em&gt; list items.&lt;/p&gt;
&lt;h2&gt;Basic Demo&lt;/h2&gt;
&lt;div class=&quot;box&quot;&gt;
    &lt;ul class=&quot;inlinelist&quot;&gt;
        &lt;li&gt;list item 1&lt;/li&gt;
        &lt;li&gt;list item 2&lt;/li&gt;
        &lt;li&gt;list item 3&lt;/li&gt;
        &lt;li&gt;list item 4&lt;/li&gt;
        &lt;li&gt;list item 5&lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;
&lt;h3 class=&quot;noborder&quot;&gt;HTML&lt;/h3&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;ul&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;inlinelist&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;list item 1&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;list item 2&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;list item 3&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;list item 4&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;list item 5&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;ul&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;h3 class=&quot;noborder&quot;&gt;CSS&lt;/h3&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;ul.inlinelist&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;display&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; flex&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/*Treats list items like they&#39;re items in a flex div*/&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;flex-wrap&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; wrap&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/*Causes list items to go to the next line if the viewport isn&#39;t wide enough*/&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;list-style-type&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; none&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/*Removes bullets*/&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;padding-left&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/*Removes default list indentation*/&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;justify-content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; center&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/*Optional, aligns our list to the center of the div*/&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.inlinelist li + li::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token string&quot;&gt;&quot;|&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/*Decoration that goes in-between list items.*/&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;margin&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; auto 0.5em&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/*Optional, extra spacing so it looks nicer*/&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;The decoration itself can be almost anything. A unicode character, an emoji, even an image! Just use &lt;code&gt;content: url(&quot;file/path/to/image.png&quot;);&lt;/code&gt;, similarly to how you set up a background image.&lt;/p&gt;

&lt;h2&gt;Combining It with Pseudo-Classes&lt;/h2&gt;
&lt;p&gt; If you know what you&#39;re doing, you can make a basic list look pretty advanced. Using &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; class=&quot;external&quot; href=&quot;https://www.w3schools.com/cssref/css_ref_pseudo_classes.php&quot;&gt;CSS pseudo-classes&lt;/a&gt;, we can select different list items and style them specifically.&lt;/p&gt;
&lt;p&gt;Below is a breadcrumbs navigation menu that I styled to look like a computer file manager. If you look into the HTML, you&#39;ll see that it&#39;s the exact same structure as the other example. Everything is defined in the styling.&lt;/p&gt;
&lt;div class=&quot;box&quot;&gt;
    &lt;ul class=&quot;inlinelist fakebreadcrumbs&quot;&gt;
        &lt;li&gt;Home&lt;/li&gt;
        &lt;li&gt;Blog&lt;/li&gt;
        &lt;li&gt;Posts&lt;/li&gt;
        &lt;li&gt;Post #1&lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;

&lt;h3 class=&quot;noborder&quot;&gt;HTML&lt;/h3&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;ul&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;breadcrumbs&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Home&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Blog&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Posts&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Post #1&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;ul&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;h3 class=&quot;noborder&quot;&gt;CSS&lt;/h3&gt;

&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;ul.breadcrumbs&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;display&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; flex&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;flex-wrap&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; wrap&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;list-style-type&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; none&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;padding-left&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;justify-content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; center&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.breadcrumbs li + li::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token string&quot;&gt;&quot;&#92;203A&#92;00a0📁&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;margin&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0 0.5em&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.breadcrumbs li:first-of-type::before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token string&quot;&gt;&quot;📁&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;margin-right&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0.5em&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;ul.breadcrumbs li:last-of-type:before&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;content&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token string&quot;&gt;&quot;&#92;203A&#92;00a0📂&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;This ones a bit more complicated, so let&#39;s break it down a bit.&lt;/p&gt;
&lt;ul&gt;
    &lt;li&gt;
        &lt;p&gt;&lt;code&gt;ul.breadcrumbs&lt;/code&gt; is our list. The styling is exactly the same as &lt;code&gt;ul.inlinelist&lt;/code&gt; from the previous section. It makes sure our list is displayed horizontally instead of vertically.&lt;/p&gt;
    &lt;/li&gt;
    &lt;li&gt;
        &lt;p&gt;&lt;code&gt;li + li::before&lt;/code&gt; is one we&#39;ve already used before. It selects all list items that come immediately after another list item. This is our &quot;default&quot; styling for most of our list items, since all but the first one come right after another.&lt;/p&gt;
        &lt;p&gt;For the &lt;code&gt;content&lt;/code&gt; I&#39;ve used a mixed of &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; class=&quot;external&quot; href=&quot;https://www.w3schools.com/cssref/css_entities.php&quot;&gt;CSS entities&lt;/a&gt; and regular emojis. &lt;code&gt;&quot;&#92;203A&quot;&lt;/code&gt; is the entity code for the separator we&#39;re using and &lt;code&gt;&quot;&#92;00a0&quot;&lt;/code&gt; is the code for a &quot;no-break space&quot;. Sometimes, CSS struggles to render spaces from just typing with your space bar in &lt;code&gt;content&lt;/code&gt; correctly, so I&#39;d suggest using CSS entities in situations like these.&lt;/p&gt;
    &lt;/li&gt;
    &lt;li&gt;
        &lt;p&gt;&lt;code&gt;li:first-of-type&lt;/code&gt; selects the first list item in the list. Since it&#39;s the first element, it doesn&#39;t follow another list item and isn&#39;t effected by the styling set at the beginning. We have to style it separately. I didn&#39;t want it to have the separator symbol, so I only gave it the closed file emoji.&lt;/p&gt;
    &lt;/li&gt;
    &lt;li&gt;
        &lt;p&gt;&lt;code&gt;li:last-of-type&lt;/code&gt; selects the last list item in the list. Because it follows another list item, by default it&#39;ll inherit the styling we set at the beginning. We can still override that styling if we want to, though. To show that the current page is our &quot;opened file&quot;, I put the opened file emoji before it.&lt;/p&gt;
    &lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;There&#39;s a lot more you can do. I encourage you to just tinker around and see what comes out of it!&lt;/p&gt;</description>
      <pubDate>Thu, 26 Dec 2024 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/code/snippets/inline-lists-and-list-item-separators.html</guid>
    </item>
    <item>
      <title>Using Images as Dividers</title>
      <link>https://sainthood.xyz/code/snippets/using-images-as-dividers.html</link>
      <description>
&lt;p&gt;Most people just use the &lt;code&gt;&amp;lt;img&amp;gt;&lt;/code&gt; tag when they want to use an image as a divider, but this method I&#39;m going to show you follows semantic HTML and is easier to edit if you want to change it later. Basically, you just use &lt;code&gt;&amp;lt;hr&amp;gt;&lt;/code&gt; and then use CSS to set its background to your image of choice.&lt;/p&gt;

&lt;h2&gt;Basic Graphics&lt;/h2&gt;
&lt;div class=&quot;box&quot;&gt;
    &lt;hr class=&quot;rainbowdivider&quot;&gt;
&lt;/div&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;hr&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;background-image&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;rainbowdivider.png&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* change to the file path to your image */&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;height&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 45px&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/*Same height as the original image, change to match your images height*/&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;background-size&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; contain&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Makes sure the image doesn&#39;t get cut off on smaller screens */&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;background-repeat&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; no-repeat&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;background-position&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; center&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;border&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; none&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Removes default hr styling */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;This is my recommended styling for basic divider graphics. I &lt;em&gt;highly&lt;/em&gt; recommend changing the height to match whatever the original height of the image is.&lt;/p&gt;

&lt;h2&gt;Repeating Patterns&lt;/h2&gt;
&lt;div class=&quot;box&quot;&gt;
    &lt;hr class=&quot;stardivider&quot;&gt;
&lt;/div&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;hr&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;background-image&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&quot;stardivider.png&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* change to the file path to your image */&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;height&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 19px&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/*Same height as the original image, change to match your images height*/&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;background-size&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; contain&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Makes sure the image doesn&#39;t get cut off on smaller screens */&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;background-repeat&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; repeat-x&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Has the image repeat infinitely on the x-axis */&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;border&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; none&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;token comment&quot;&gt;/* Removes default hr styling */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;This is a cool little advantage to using background images over HTML images. If you have a repeating pattern, you can change &lt;code&gt;background-repeat: no-repeat;&lt;/code&gt; to &lt;code&gt;background-repeat: repeat-x;&lt;/code&gt; and it&#39;ll repeat infinitely on the x-axis (left and right, not up and down).&lt;/p&gt;
&lt;p&gt;It&#39;s also responsive to screen size. Change your window size or turn your device sideways, you&#39;ll see that the graphic adjusts itself without changing the actual width/height or pushing around other elements on the page.&lt;/p&gt;</description>
      <pubDate>Wed, 25 Dec 2024 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/code/snippets/using-images-as-dividers.html</guid>
    </item>
    <item>
      <title>Accessible Zonelets</title>
      <link>https://sainthood.xyz/code/projects/accessible-zonelets/</link>
      <description>&lt;h2&gt;About&lt;/h2&gt;
&lt;p&gt;Accessible Zonelets is exactly what is sounds like, &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; class=&quot;external&quot; href=&quot;https://zonelets.net/&quot;&gt;Zonelets&lt;/a&gt;, but accessible! I went into extensive detail on the changes I made and why in my blog post &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/blog/posts/accessible-zonelets&quot;&gt;&quot;Making Your Zonelets Blog More Accessible&quot;&lt;/a&gt;.&lt;/p&gt;

&lt;h3&gt;Features&lt;/h3&gt;
&lt;ul&gt;
    &lt;li&gt;Added ARIA landmarks/page regions.&lt;/li&gt;
    &lt;li&gt;Added ARIA labels to help differentiate between the header and post navigation.&lt;/li&gt;
    &lt;li&gt;Added &lt;code&gt;:focus&lt;/code&gt; styling for all elements that had &lt;code&gt;:hover&lt;/code&gt; styling.&lt;/li&gt;
    &lt;li&gt;Added &quot;skip to main content&quot; and &quot;back to top&quot; links.&lt;/li&gt;
    &lt;li&gt;Changed links to have better color contrast with the background&lt;/li&gt;
    &lt;li&gt;Changed font size to use em instead of pixels.&lt;/li&gt;
    &lt;li&gt;Changed post dates to be paragraphs instead of headings.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;Styling&lt;/h2&gt;
&lt;p&gt;The ZIP includes both the default zonelets starter pack and the bonus theme pack! I&#39;ve gone through all of the themes and made sure they include the new accessibility features, while still keeping them as close to the original as possible.&lt;/p&gt;
&lt;p&gt;Any custom stylesheets that work with the original Zonelets should still work for Accessible Zonelets. Just remember to accommodate for the &quot;skip to content&quot; link at the end of the stylesheet.&lt;/p&gt;

&lt;h2&gt;Licensing&lt;/h2&gt;
&lt;p&gt;In the spirit of the original Zonelets, &lt;span style=&quot;font-weight: bold;&quot;&gt;Accessible Zonelets is freely distributed under the &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; class=&quot;external&quot; href=&quot;https://choosealicense.com/licenses/mit/&quot;&gt;MIT license&lt;/a&gt;&lt;/span&gt;.&lt;/p&gt;</description>
      <pubDate>Tue, 10 Dec 2024 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/code/projects/accessible-zonelets/</guid>
    </item>
    <item>
      <title>Making Your Zonelets Blog More Accessible</title>
      <link>https://sainthood.xyz/blog/posts/accessible-zonelets.html</link>
      <description>&lt;p&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://zonelets.net/&quot;&gt;Zonelets&lt;/a&gt; is a free to use, static blogging engine. It&#39;s aimed at absolute beginners and especially popular with young people on platforms like &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://neocities.org/&quot;&gt;Neocities&lt;/a&gt;. Unfortunately, the default Zonelets layout lacks a lot of basic accessibility features. Because so many of its users are newbies, they&#39;re either unaware of or unable to fix these issues. This post is me throwing my hat in the ring and trying to fix those issues myself.&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;Before I continue, I want to make it very clear that I have nothing but the upmost respect for Zonelets and it&#39;s creator, Marina. All of the issues I&#39;ll be pointing out in this post are purely technical. I hope this post can be a nice introduction to web accessibility for beginners, using a framework that they&#39;re already familiar with as a jumping-off point.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;All of the changes I&#39;m showing can be &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/code/projects/accessible-zonelets/&quot;&gt;downloaded from my projects page&lt;/a&gt; if you&#39;d prefer to start from scratch.&lt;/strong&gt; If you had a lot of blog posts before you&#39;d just have to back those up somewhere and then copy-paste the content of your old ones over to the new template. If you&#39;d prefer to update your existing Zonelets files, or just want to know how I did it, keep reading and follow the steps below!&lt;/p&gt;

&lt;h2 id=&quot;keyterms&quot;&gt;Key Terms&lt;/h2&gt;
&lt;p&gt;There are some terms I&#39;m going to be using a lot throughout this post. It&#39;s important that you&#39;re familiar with them before we start.&lt;/p&gt;
&lt;dl&gt;
    &lt;dt&gt;Screen Reader&lt;/dt&gt;
    &lt;dd&gt;A screen reader is a type of software frequently used by people who&#39;re blind or have low vision. It&#39;s main job is to read aloud the text on screen. Most screen readers will also announce when certain elements are interacted with (For example: when a button is pressed), and what section of the page it&#39;s currently reading.&lt;br&gt;Further Reading: &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://webaim.org/techniques/screenreader/&quot;&gt;&quot;Designing for Screen Reader Compatibility&quot; on WebAIM&lt;/a&gt;.&lt;/dd&gt;
    &lt;dt&gt;Keyboard User&lt;/dt&gt;
    &lt;dd&gt;A keyboard user is someone who (solely or primarily) uses a keyboard to navigate a web page instead of a mouse, trackpad, or touch screen. This is typically, but not always, because of motor disabilities. There is also a significant overlap between keyboard users and screen reader users, since people who&#39;re totally blind can&#39;t see/use a mouse cursor.&lt;br&gt;Further Reading: &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://webaim.org/techniques/keyboard/&quot;&gt;&quot;Keyboard Accessibility&quot; on WebAIM&lt;/a&gt;.&lt;/dd&gt;
    &lt;dt&gt;Semantic HTML&lt;/dt&gt;
	&lt;dd&gt;When an HTML element or HTML structure is semantic that means it&#39;s being used to convey information, not just decoration. For example, using headings to give a title to a section of a page, not just using it because you want large text.&lt;br&gt;Further Reading: &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://developer.mozilla.org/en-US/docs/Glossary/Semantics&quot;&gt;&quot;Semantics&quot; on MDN Web Docs&lt;/a&gt;.&lt;/dd&gt;
    &lt;dt&gt;Styling&lt;/dt&gt;
	&lt;dd&gt;Styling refers to changing the appearance, but &lt;em&gt;not&lt;/em&gt; the content or functionality, of an HTML element using CSS. For example: changing the font, size, or color of text on a page.&lt;br&gt;Further Reading: &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Styling_basics&quot;&gt;&quot;CSS styling basics&quot; on MDN Web Docs&lt;/a&gt;.&lt;/dd&gt;
&lt;/dl&gt;

&lt;h2 id=&quot;language&quot;&gt;Step 1: Defining the language&lt;/h2&gt;
&lt;h3 class=&quot;noborder&quot;&gt;Why?&lt;/h3&gt;
&lt;p&gt;Screen readers have the ability to read text aloud in multiple languages. Sometimes there can be ambiguity as to what language a block of text is supposed to be in, and that goes on to effect how the screen reader pronounces it and how the user interprets its meaning. For example, without context, most screen readers can&#39;t tell the difference between &quot;pan&quot;, the English word for a skillet, and &lt;span lang=&quot;es&quot;&gt;&quot;pan&quot;&lt;/span&gt; the Spanish word for bread. Defining what language the page is using can help with these problems.&lt;/p&gt;
&lt;h3 class=&quot;noborder&quot;&gt;What You Should Do&lt;/h3&gt;
&lt;p&gt;Change the very first &lt;code&gt;&amp;lt;html&amp;gt;&lt;/code&gt; at the top of &lt;em&gt;all&lt;/em&gt; your HTML files to &lt;code&gt;&amp;lt;html lang=&quot;en&quot;&amp;gt;&lt;/code&gt;.&lt;/p&gt;
&lt;p&gt;If your blog isn&#39;t in English, you can search through &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.w3schools.com/tags/ref_language_codes.asp&quot;&gt;this list&lt;/a&gt; to find your languages two letter code. Just replace &lt;code&gt;en&lt;/code&gt; with whatever your languages code is.&lt;/p&gt;
&lt;h4&gt;Country Codes&lt;/h4&gt;
&lt;p&gt;In some cases, you might want to add a &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.w3schools.com/tags/ref_country_codes.asp&quot;&gt;country code&lt;/a&gt; to the end of your language code. This is usually unnecessary for English, since most dialects of English are mutually intelligible (someone who speaks American English can understand British English and vice versa), but may be necessary for other languages. For example, there&#39;s &lt;code&gt;pt-PT&lt;/code&gt; for Portuguese Portuguese and &lt;code&gt;pt-BR&lt;/code&gt; for Brazilian Portuguese.&lt;/p&gt;
&lt;h4&gt;Defining Multiple Languages&lt;/h4&gt;
&lt;p&gt;The &lt;code&gt;lang&lt;/code&gt; tag is a &lt;em&gt;global&lt;/em&gt; attribute, which means it can be applied to &lt;em&gt;any&lt;/em&gt; HTML element. This can be useful in situations where you use words or phrases in other languages.&lt;/p&gt;
&lt;p&gt;You can set the overall language of your page to English, but then set individual sections, paragraphs, or spans to a different language. For example:&lt;/p&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;p&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;The national anthem of France is &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;span&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;lang&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;fr&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;La Marseillaise&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;span&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;.&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;p&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;h2 id=&quot;landmarks&quot;&gt;Step 2: Adding Landmark Regions&lt;/h2&gt;
&lt;h3 class=&quot;noborder&quot;&gt;Why?&lt;/h3&gt;
&lt;p&gt;Landmarks help define what kind of content that part of the page has. There are multiple different landmark elements, each with their own purpose, but here are the ones we&#39;ll be going over in this tutorial:&lt;/p&gt;
&lt;dl&gt;
    &lt;dt&gt;&amp;lt;header&amp;gt;&lt;/dt&gt;
    &lt;dd&gt;The header at the top of your site. Usually includes the sites name, banner, and main links.&lt;/dd&gt;
    &lt;dt&gt;&amp;lt;footer&amp;gt;&lt;/dt&gt;
	&lt;dd&gt;The footer at the bottom of your site. Usually includes legal information, secondary links, and contact info.&lt;/dd&gt;
    &lt;dt&gt;&amp;lt;main&amp;gt;&lt;/dt&gt;
    &lt;dd&gt;The main content of the page. In this case: your blog post.&lt;/dd&gt;
    &lt;dt&gt;&amp;lt;nav&amp;gt;&lt;/dt&gt;
	&lt;dd&gt;Used for navigation menus. Note that unlike the other landmarks mentioned, some sites might have more than one &amp;lt;nav&amp;gt; element.&lt;/dd&gt;
&lt;/dl&gt;
&lt;p&gt;Both screen reader and keyboard users can use landmarks to jump to different sections of a page. It&#39;s also just generally considered best practice to use landmarks when designing web pages, for a bunch of reasons besides accessibility that I won&#39;t bother going into here. For now, just know that it&#39;s a good thing to get into the habit of doing!&lt;/p&gt;

&lt;h3 class=&quot;noborder&quot;&gt;What You Should Do&lt;/h3&gt;
&lt;p&gt;Replace &lt;code&gt;div&lt;/code&gt; with the appropriate landmark element.&lt;/p&gt;
&lt;div class=&quot;box callout warning&quot;&gt;
    &lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; width=&quot;32&quot; height=&quot;32&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;none&quot; stroke=&quot;currentColor&quot; stroke-width=&quot;2&quot; stroke-linecap=&quot;round&quot; stroke-linejoin=&quot;round&quot; class=&quot;lucideicon&quot; alt=&quot;&quot;&gt;&lt;path d=&quot;m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3&quot; /&gt;&lt;path d=&quot;M12 9v4&quot; /&gt;&lt;path d=&quot;M12 17h.01&quot; /&gt;&lt;/svg&gt;
    &lt;p&gt;&lt;strong&gt;Do not change or remove the IDs!&lt;/strong&gt; It might seem repetitive, but they effect both the styling of your elements &lt;em&gt;and&lt;/em&gt; tell the JavaScript where to place certain text.&lt;/p&gt;
&lt;/div&gt;
&lt;h4&gt;Header, Footer, and Main Regions&lt;/h4&gt;
&lt;p&gt;Change &lt;code&gt;&amp;lt;div id=&quot;header&quot;&amp;gt;&lt;/code&gt; to &lt;code&gt;&amp;lt;header id=&quot;header&quot;&amp;gt;&lt;/code&gt;.&lt;/p&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;header&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;id&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;header&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;...&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;header&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Then, change &lt;code&gt;&amp;lt;div id=&quot;footer&quot;&amp;gt;&lt;/code&gt; to &lt;code&gt;&amp;lt;footer id=&quot;footer&quot;&amp;gt;&lt;/code&gt;.&lt;/p&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;footer&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;id&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;footer&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;footer&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Lastly, change &lt;code&gt;&amp;lt;div id=&quot;content&quot;&amp;gt;&lt;/code&gt; to &lt;code&gt;&amp;lt;main id=&quot;content&quot;&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;main&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;id&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;content&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;    
    &lt;span class=&quot;token comment&quot;&gt;&amp;lt;!--your content here--&amp;gt;&lt;/span&gt;
&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;main&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Pretty easy, right?&lt;/p&gt;

&lt;h4&gt;Navigation Region&lt;/h4&gt;
&lt;p&gt;Navigation is where things get a little more complicated. In Zonelet&#39;s post template, it has both a main navigation menu in the header, and a &quot;next and previous post&quot; navigation menu towards the end of every post. We could just replace &lt;code&gt;&amp;lt;div&amp;gt;&lt;/code&gt; with &lt;code&gt;&amp;lt;nav&amp;gt;&lt;/code&gt; and leave it at that, like we did with the other landmark elements, but that might be confusing for some users.&lt;/p&gt;
&lt;p&gt;Instead, we&#39;re going to make each &lt;code&gt;&amp;lt;nav&amp;gt;&lt;/code&gt; unique by using &lt;code&gt;aria-label&lt;/code&gt;, a special attribute that is read out loud by a screen reader. &lt;code&gt;aria-label&lt;/code&gt; is helpful in situations where surrounding text isn&#39;t enough to describe an element. We can give our &lt;code&gt;&amp;lt;nav&amp;gt;&lt;/code&gt; in the header the &lt;code&gt;aria-label&lt;/code&gt; &quot;main navigation&quot; and the &lt;code&gt;&amp;lt;nav&amp;gt;&lt;/code&gt; towards the bottom the &lt;code&gt;aria-label&lt;/code&gt; &quot;post navigation&quot;. Now, people using screen readers will be able to easily tell the two apart!&lt;/p&gt;


&lt;div class=&quot;box callout warning&quot;&gt;
    &lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; width=&quot;32&quot; height=&quot;32&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;none&quot; stroke=&quot;currentColor&quot; stroke-width=&quot;2&quot; stroke-linecap=&quot;round&quot; stroke-linejoin=&quot;round&quot; class=&quot;lucideicon&quot; alt=&quot;&quot;&gt;&lt;path d=&quot;m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3&quot; /&gt;&lt;path d=&quot;M12 9v4&quot; /&gt;&lt;path d=&quot;M12 17h.01&quot; /&gt;&lt;/svg&gt;
    &lt;p&gt;&lt;strong&gt;Edit 2025-03-15:&lt;/strong&gt; I feel like I should have done a better job explaining how accidentally using ARIA incorrectly can &lt;em&gt;hinder&lt;/em&gt; accessibility instead of enhancing it. When using it for your own projects, please remember to do proper research and testing.&lt;/p&gt;
    &lt;p&gt;&lt;strong&gt;Remember: &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.w3.org/WAI/ARIA/apg/practices/read-me-first/&quot;&gt;No ARIA is better than Bad ARIA&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;/div&gt;

&lt;p&gt;Editing the post navigation can be done similarly to our other landmark edits. Change &lt;code&gt;&amp;lt;div id=&quot;nextprev&quot;&amp;gt;&lt;/code&gt; to &lt;code&gt;&amp;lt;nav id=&quot;nextprev&quot;&amp;gt;&lt;/code&gt; and make sure to include &lt;code&gt;aria-label=&quot;post navigation&quot;&lt;/code&gt;.&lt;/p&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;nav&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;id&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;nextprev&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;aria-label&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;post navigation&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;nav&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Unlike the rest of our edits so far, the contents of the header menu is defined in our JavaScript file. Open &lt;code&gt;script.js&lt;/code&gt; and look for the variable &lt;code&gt;headerHTML&lt;/code&gt; (should be on line 63). It might look intimidating at first, but don&#39;t worry! All the stuff we&#39;re going to edit is just HTML formatted in a way that&#39;s easier for the JavaScript to understand.&lt;/p&gt;
&lt;p&gt;You&#39;ll see that the header links are wrapped in an unordered list (&lt;code&gt;&amp;lt;ul&amp;gt;&lt;/code&gt;). We&#39;re going to wrap a &lt;code&gt;&amp;lt;nav&amp;gt;&lt;/code&gt; around that and give it &lt;code&gt;aria-label=&quot;main navigation&quot;&lt;/code&gt;. Now, every time our header is loaded, it&#39;ll load with those elements as well.&lt;/p&gt;
&lt;p&gt;Your JS code will look like this if done correctly:&lt;/p&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;let headerHTML = &#39;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;nav&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;aria-label&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;main navigation&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;ul&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt; &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;a&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&#39;&lt;/span&gt; + relativePath + &#39;/index.html&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Home&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;a&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&#39; + 
&#39;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;a&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&#39;&lt;/span&gt; + relativePath + &#39;/archive.html&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Archive&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;a&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&#39; +
&#39;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;a&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&#39;&lt;/span&gt; + relativePath + &#39;/about.html&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;About&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;a&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;li&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt; &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;ul&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;nav&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&#39;;&lt;/code&gt;&lt;/pre&gt;


&lt;h2 id=&quot;headings&quot;&gt;Step 3: Fixing Headings&lt;/h2&gt;
&lt;h3 class=&quot;noborder&quot;&gt;Why?&lt;/h3&gt;
&lt;p&gt;A mistake that nearly every newbie webdev makes at first is using semantic HTML elements, when they should have just used styling. For example, a lot of beginners use the heading elements because they think that all it does is make the text bigger, and just want large text that grabs the reader&#39;s attention. In actuality, headings tell your browser that there&#39;s a hierarchy of information. &lt;code&gt;&amp;lt;h2&amp;gt;&lt;/code&gt; is a subset of &lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt;, &lt;code&gt;&amp;lt;h3&amp;gt;&lt;/code&gt; is a subset of &lt;code&gt;&amp;lt;h2&amp;gt;&lt;/code&gt;, and so on.&lt;/p&gt;
&lt;p&gt;Similarly to landmarks, screen reader and keyboard users can use headings to jump to different sections of a page. Labeling something as a heading when it&#39;s actually not can be confusing and annoying to the user.&lt;/p&gt;

&lt;h3 class=&quot;noborder&quot;&gt;What You Should Do&lt;/h3&gt;
&lt;p&gt;Using CSS, we can give a regular paragraph the appearance of a heading, without giving it the semantics of one.&lt;/p&gt;
&lt;p&gt;First, we replace our post dates &lt;code&gt;&amp;lt;h4&amp;gt;&lt;/code&gt; tags with &lt;code&gt;&amp;lt;p&amp;gt;&lt;/code&gt;.&lt;/p&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;p&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;id&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;postDate&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;p&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;The post date is now just a normal paragraph, but it still has the &lt;code&gt;postDate&lt;/code&gt; ID, which we can customize in our stylesheet.&lt;/p&gt;
&lt;div class=&quot;box callout info&quot;&gt;
    &lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; width=&quot;32&quot; height=&quot;32&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;none&quot; stroke=&quot;currentColor&quot; stroke-width=&quot;2&quot; stroke-linecap=&quot;round&quot; stroke-linejoin=&quot;round&quot; class=&quot;lucideicon&quot; alt=&quot;&quot;&gt;&lt;circle cx=&quot;12&quot; cy=&quot;12&quot; r=&quot;10&quot; /&gt;&lt;path d=&quot;M12 16v-4&quot; /&gt;&lt;path d=&quot;M12 8h.01&quot; /&gt;&lt;/svg&gt;
    &lt;p&gt;Now is a good time to mention that &lt;strong&gt;&lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://dequeuniversity.com/rules/axe/4.10/heading-order&quot;&gt;heading levels should only increase by one&lt;/a&gt;!&lt;/strong&gt; You should never just skip from &lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt; to &lt;code&gt;&amp;lt;h4&amp;gt;&lt;/code&gt;, like in the original post template.&lt;/p&gt;
&lt;/div&gt;
&lt;p&gt;This next part may be slightly different depending on what theme your using. I&#39;ll be using the default Zonelets stylesheet. In your &lt;code&gt;style&lt;/code&gt; folder, go to &lt;code&gt;style.css&lt;/code&gt; and scroll down to around line 59. You should see a comma separated list of heading elements (&lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt;-&lt;code&gt;&amp;lt;h5&amp;gt;&lt;/code&gt;). Add &lt;code&gt;#postDate&lt;/code&gt; to that list.
&lt;/p&gt;&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;h1, h2, h3, h4, h5, #postDate&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;font-family&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; Tahoma&lt;span class=&quot;token punctuation&quot;&gt;,&lt;/span&gt; Geneva&lt;span class=&quot;token punctuation&quot;&gt;,&lt;/span&gt; sans-serif&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;color&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; #34436f&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;


&lt;p&gt;Now, your post date will be the same font and color as your headings, but there&#39;s still a few properties we have to define if we want it to look like it did before.&lt;/p&gt;
&lt;p&gt;Most elements have default styles that render even when not defined in the stylesheet. For example, all &lt;code&gt;h4&lt;/code&gt; elements will render with a &lt;code&gt;font-size&lt;/code&gt; of &lt;code&gt;1em&lt;/code&gt;, unless explicitly defined otherwise. We can use &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.w3schools.com/cssref/css_default_values.php&quot;&gt;W3Schools list of default CSS values for HTML elements&lt;/a&gt; to find and apply relevant ones from &lt;code&gt;h4&lt;/code&gt; to &lt;code&gt;#postDate&lt;/code&gt;.&lt;/p&gt;
&lt;p&gt;I also set the line height to &quot;normal&quot;. Originally the line height for paragraphs was set to 1.6em, which gave our post date a lot of awkward extra spacing. Giving it the value of &quot;normal&quot; resets that number to the browsers default and makes it look more uniform with the other heading elements.&lt;/p&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;h1, h2, h3, h4, h5, #postDate&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;font-family&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; Tahoma&lt;span class=&quot;token punctuation&quot;&gt;,&lt;/span&gt; Geneva&lt;span class=&quot;token punctuation&quot;&gt;,&lt;/span&gt; sans-serif&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;color&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; #34436f&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;#postDate&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;font-size&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 1em&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;margin&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 1.33em 0&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;font-weight&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; bold&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;line-height&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; normal&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;


&lt;p&gt;Congratulations! Now your post date looks just like a heading, without any of the semantics!&lt;/p&gt;

&lt;h2 id=&quot;tweaks&quot;&gt;Step 4: Small Tweaks&lt;/h2&gt;
&lt;p&gt;The rest of my edits were super small quick changes that don&#39;t need too much explanation.&lt;/p&gt;

&lt;h3&gt;Using Relative Units&lt;/h3&gt;
&lt;p&gt;Relative units are more flexible and work better with screen magnifiers and mobile devices. Whenever possible, it&#39;s best to use relative units, like &lt;code&gt;em&lt;/code&gt; and &lt;code&gt;rem&lt;/code&gt;, over absolute units like &lt;code&gt;px&lt;/code&gt;. Better yet, you can ditch units all together in some cases! The recommended way to set &lt;code&gt;line-height&lt;/code&gt; is to just type a number without defining the unit.&lt;/p&gt;
&lt;p&gt;Here I used a &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.w3schools.com/TAGS/ref_pxtoemconversion.asp&quot;&gt;pixel to ems converter&lt;/a&gt; to help change the &lt;code&gt;font-size&lt;/code&gt; unit, and removed the unit from our paragraphs &lt;code&gt;line-hight&lt;/code&gt;.&lt;/p&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;body&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;background-color&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; #436a7b&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;background-image&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;token url&quot;&gt;&lt;span class=&quot;token function&quot;&gt;url&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;token string url&quot;&gt;&#39;../images/bg_diamond.png&#39;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;background-position&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; top&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;font-size&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 1.125em&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;font-family&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; Georgia&lt;span class=&quot;token punctuation&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;token string&quot;&gt;&quot;Times New Roman&quot;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;,&lt;/span&gt; serif&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;margin&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;

&lt;span class=&quot;token selector&quot;&gt;p&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
    &lt;span class=&quot;token property&quot;&gt;line-height&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 1.6&lt;span class=&quot;token punctuation&quot;&gt;;&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;


&lt;h3&gt;Insuring Decent Color Contrast&lt;/h3&gt;
&lt;p&gt;Make sure that all of your text, including links, are easily distinguishable from the background. You can use &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://webaim.org/resources/contrastchecker/&quot;&gt;WebAIMs color contrast checker&lt;/a&gt; to help you out.&lt;/p&gt;
&lt;p&gt;The specifics of how you fix this will depend on the specific theme of your blog. For the default Zonelets theme, the body text was fine, but the link text was too light, so I adjusted it to make it darker.&lt;/p&gt;

&lt;h3&gt;Adding :focus Effects&lt;/h3&gt;
&lt;p&gt;Keyboard-only users can&#39;t hover over links or buttons with a mouse, instead they have to focus on them by pressing &lt;kbd&gt;tab&lt;/kbd&gt;. Most stylesheets have it set so that links and buttons change appearance when hovered over. It&#39;s usually a good idea to apply whatever effect is set to hovered elements to focused elements as well.&lt;/p&gt;
&lt;p&gt;This can be done by simply adding a comma separated list, copy-pasting the element, and replacing &lt;code&gt;:hover&lt;/code&gt; with &lt;code&gt;:focus&lt;/code&gt;. Now, whatever styles you define will effect both hovered over &lt;em&gt;and&lt;/em&gt; focused on states of that element.&lt;/p&gt;
&lt;pre class=&quot;language-css&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-css&quot;&gt;&lt;span class=&quot;token selector&quot;&gt;a:hover, a:focus&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt; 
    &lt;span class=&quot;token comment&quot;&gt;/* whatever you want it to look like when hovered over/focused on */&lt;/span&gt;
&lt;span class=&quot;token punctuation&quot;&gt;}&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;h3&gt;Adding Skip Links&lt;/h3&gt;
&lt;p&gt;Skip links rarely ever make or break a sites accessibility, but can still make your site slightly more convenient for some people. Most websites have features that appear on every page, like the header and navigation menu. This can be annoying and repetitive for screen reader users and keyboard users. To remedy this, you can add a &quot;Skip to Content&quot; link.&lt;/p&gt;
&lt;p&gt;I was originally going to add my own code that I stitched together for this, but then I found &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://kalechips.net/projects/snippets/skip&quot;&gt;Kalechip&#39;s code snippet for it&lt;/a&gt; and it&#39;s a lot cleaner and better explained than mine, so I&#39;ll just recommend that you use that.&lt;/p&gt;
&lt;p&gt;Additionally, you can add a visible &quot;back to top&quot; link at the bottom of your blog. This is useful not only for disabled users, but able-bodied users who&#39;re reading your blog on their phone or tablet.&lt;/p&gt;
&lt;p&gt;Further Reading: &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://webaim.org/techniques/skipnav/&quot;&gt;&quot;Skip Navigation Links&quot; on WebAIM&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;Using the Figure and Figcaption Elements&lt;/h3&gt;
&lt;p&gt;The default Zonelets framework lets you turn regular paragraphs into image captions by giving it the &lt;code&gt;caption&lt;/code&gt; class. This doesn&#39;t actually change the semantics of the element, though, just the way it looks. This setup isn&#39;t &lt;em&gt;inherently&lt;/em&gt; inaccessible, but in some situations it might be ambiguous as to which paragraphs are normal parts of a post and which are directly referring to an image.&lt;/p&gt;
&lt;p&gt;To make it clear that a caption is grouped with an image or set of images, you can use the &lt;code&gt;figure&lt;/code&gt; and &lt;code&gt;figcaption&lt;/code&gt; tags. You can still apply the &lt;code&gt;caption&lt;/code&gt; class to your &lt;code&gt;figcaption&lt;/code&gt; so that it&#39;s styled differently from the main text. You can also apply classes meant for images (&lt;code&gt;left&lt;/code&gt;, &lt;code&gt;right&lt;/code&gt;, &lt;code&gt;center&lt;/code&gt;, and &lt;code&gt;small&lt;/code&gt;) to &lt;code&gt;figure&lt;/code&gt; so that it affects both the image and the caption.
&lt;/p&gt;&lt;p&gt;For example:&lt;/p&gt;
&lt;pre class=&quot;language-html&quot; tabindex=&quot;0&quot;&gt;&lt;code class=&quot;language-html&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;figure&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;small right&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;img&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;dog.png&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;alt&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;photograph of a small dog lying in the sun&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
    &lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;&lt;/span&gt;figcaption&lt;/span&gt; &lt;span class=&quot;token attr-name&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;token attr-value&quot;&gt;&lt;span class=&quot;token punctuation attr-equals&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;caption&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;Me and my dog had a fun summer!&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;figcaption&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;
&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token tag&quot;&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;lt;/&lt;/span&gt;figure&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;h2 id=&quot;conclusion&quot;&gt;In Conclusion&lt;/h2&gt;
&lt;p&gt;For those interested in learning more about web accessibility, I&#39;d highly recommend checking out &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://webaim.org/&quot;&gt;WebAIM&lt;/a&gt;. They provide a lot of in-depth information and I used them as a resource multiple times while writing this post. &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://developer.mozilla.org/en-US/docs/Web/Accessibility&quot;&gt;MDN Web Docs&lt;/a&gt; and &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.w3schools.com/accessibility/index.php&quot;&gt;W3Schools&lt;/a&gt; also have very good overviews on the subject.&lt;/p&gt;
&lt;p&gt;Once you understand the basics, you can start using tools like &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://wave.webaim.org/&quot;&gt;WAVE&lt;/a&gt; or &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/&quot;&gt;axe DevTools&lt;/a&gt;. Automated accessibility tests aren&#39;t foolproof, you should always do them in conjunction with manual testing, but they can still help you notice things that you might have glossed over otherwise. I also recently found out about &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://www.a11yproject.com/checklist/&quot;&gt;the A11Y Project Checklist&lt;/a&gt;, which I think a lot of people might find useful.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;Phew! That took a lot longer to write than I thought it would! I hope this tutorial was easy to understand. Technically, I guess this isn&#39;t my first time writing a long tutorial like this, but it is my first time actually finishing and publishing one.&lt;/p&gt;
&lt;p&gt;If you have any questions, or think I got something wrong and want to correct me, feel free to &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/#contact&quot;&gt;contact me&lt;/a&gt;!&lt;/p&gt;</description>
      <pubDate>Tue, 10 Dec 2024 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/accessible-zonelets.html</guid>
    </item>
    <item>
      <title>Who Invited This Guy?</title>
      <link>https://sainthood.xyz/blog/posts/who-invited-this-guy.html</link>
      <description>&lt;p&gt;I&#39;ve tried to write and rewrite this blog post at least three times by now. Every time it ended up going off topic or becoming way too personal for my comfort. I have a few other blog drafts I&#39;m working on, mostly about tech stuff. I could&#39;ve just finished and posted one of those, but I guess I felt weird just jumping in without introducing myself or my site a little bit first.&lt;/p&gt;
&lt;p&gt;So, who the hell invited this guy?&lt;/p&gt;
&lt;!-- excerpt --&gt;
&lt;p&gt;Hi, I&#39;m that guy! You can call me Saint!&lt;/p&gt;
&lt;p&gt;I started this site back in April, but I&#39;ve been in general indieweb spaces for about a year and a half. Depending on what you count as &quot;indieweb&quot; you might say I&#39;ve been here for several years, actually. But it was only about a couple years ago that I started taking it seriously and actually knew what I was doing. Before 2022, I couldn&#39;t tell you what the hell a &quot;flexbox&quot; or a &quot;webring&quot; was.&lt;/p&gt;
&lt;p&gt;I&#39;d consider myself to be more on the creative side than the techie side, to be honest. Most of my old sites where used to show off art, &lt;abbr title=&quot;Original Characters&quot;&gt;OCs&lt;/abbr&gt;, and other artsy-type projects. Even my technical knowledge leans more towards making things look nice with CSS than understanding complicated scripting languages. I&#39;d like to think I know more about basic web development than the average person on the street, but &lt;em&gt;definitely&lt;/em&gt; less than a professional full stack webdev. I mostly keep myself in hobbyist spaces for a reason.&lt;/p&gt;
&lt;p&gt;So, if this site&#39;s been around since April, why did I wait till November to make my first blog post? Lame answer, but I&#39;ve been pretty busy with offline stuff. Just know that this last year has been very hectic for me in multiple ways, and I don&#39;t always have the time or energy to work on my site. I&#39;m hoping that should change soon, but I can&#39;t make any promises.&lt;/p&gt;
&lt;p&gt;Another small part of it was that I wanted to use a big fancy blog framework with a tag cloud and comment section and all that fun stuff! I couldn&#39;t find an existing framework that I liked, so I over-confidently attempted to code it all myself using my &lt;em&gt;extremely&lt;/em&gt; limited PHP knowledge. I eventually realized this was all pointless if I didn&#39;t actually have any blog posts that were worth reading, though. Generally, I think it&#39;s better to focus on the actual content of my website, than the extra stuff surrounding it. You can have a site with the coolest looking layout and the most robust back-end and whatever other features you think may matter, but no ones going to actually visit it if the core content is shallow or non-existent. Maybe one day I&#39;ll go back to that project, but for now I don&#39;t think people will have a very hard time sifting through all &lt;em&gt;one&lt;/em&gt; of my blog posts.&lt;/p&gt;

&lt;h2&gt;Site Changes&lt;/h2&gt;
&lt;p&gt;On the off-chance anyone is actually regularly visiting my site, you may have noticed some changes. I&#39;ve redone basically everything, most notably I&#39;ve updated the homepage and changed the CSS to &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://lissomware.github.io/css/&quot; class=&quot;external&quot;&gt;Lissom.CSS&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;As much as I love hand-coding all my stuff, it can take a lot of time and effort to test. I was &lt;em&gt;so&lt;/em&gt; lazy with my old CSS and it showed. Every time I added a new type of element that wasn&#39;t already defined in the stylesheet, I had to add it, which was a hassle. All because I was just too lazy to define all the basic HTML elements the first time around. Half of the CSS rules where set inline for some reason, I think my past self thought it saved storage/loading time, somehow? Anyway, Lissom comes with everything I need right out of the box, I just made a couple small adjustments to make it fit the needs of my site better. Hopefully, everything should be functional, responsive, and accessible. Eventually I&#39;d like to go back and redo my layout from scratch to give it a more personalized feel, but this will do for now.&lt;/p&gt;
&lt;p&gt;I also switched everything back from PHP to static HTML. I just figured with how few pages I have so far, it&#39;s really not that tedious just copying and pasting the header and footer to most of the pages, and not worth making your computer fetch extra files. I&#39;m not one of those people who&#39;s super minimalist about scripts and thinks any use of them whatsoever is &quot;bloat&quot;, but I do try to only use them when I think they&#39;re completely necessary. I&#39;m also looking into various static site generators, so hopefully that&#39;ll make things easier for both of us down the line.&lt;/p&gt;
&lt;p&gt;I&#39;ve also added an &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/rss.xml&quot;&gt;RSS feed&lt;/a&gt; to my site! This blog post is the only thing there now, but I&#39;ll be updating it as time goes on.&lt;/p&gt;

&lt;h2&gt;Future Plans&lt;/h2&gt;
&lt;p&gt;I have &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://sainthood.xyz/wips&quot;&gt;a whole separate page&lt;/a&gt; dedicated to stuff I&#39;m working on. My highest priorities are my &lt;a rel=&quot;noreferrer&quot; target=&quot;_blank&quot; href=&quot;https://zonelets.net/&quot; class=&quot;external&quot;&gt;zonelets&lt;/a&gt;-related projects and redoing my link directory. The latter has grown especially big and I might have to separate it into multiple pages or something if I actually want it to be readable.&lt;/p&gt;
&lt;p&gt;I&#39;m still brainstorming what exactly I want this website to be. I&#39;m sure I&#39;ll figure it out eventually.&lt;/p&gt;</description>
      <pubDate>Tue, 12 Nov 2024 18:00:00 CST</pubDate>
      <dc:creator>Saint</dc:creator>
      <guid>https://sainthood.xyz/blog/posts/who-invited-this-guy.html</guid>
    </item>
  </channel>
</rss>