inherentlee/leecat.art-site
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

drone build Sun Sep 20 15:08:31 PDT 2026

Browse Source
This commit is contained in:
inherentlee
2026-09-20 22:08:31 +00:00
parent 1d51eaebec
commit 207d8c1cd5
731 changed files with 8308 additions and 5281 deletions
Download Patch File Download Diff File Expand all files Collapse all files
1/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/screen-reader-optimizations/">
<h2 data-ha-exclude="" id="screen-reader-optimizations">screen reader optimizations </h2>
<h2 data-ha-exclude="">screen reader optimizations </h2>
<ul class="postlist-tags">
@@ -1412,7 +1413,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/charlie-the-alpaca-handspun/">
<h2 data-ha-exclude="" id="charlie-the-alpaca-handspun">charlie the alpaca handspun </h2>
<h2 data-ha-exclude="">charlie the alpaca handspun </h2>
<ul class="postlist-tags">
@@ -1426,7 +1427,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/ruby-the-alpaca-handspun/">
<h2 data-ha-exclude="" id="ruby-the-alpaca-handspun">ruby the alpaca handspun </h2>
<h2 data-ha-exclude="">ruby the alpaca handspun </h2>
<ul class="postlist-tags">
@@ -1440,7 +1441,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/hand-dyed-gold-handspun/">
<h2 data-ha-exclude="" id="hand-dyed-gold-handspun">hand-dyed gold handspun </h2>
<h2 data-ha-exclude="">hand-dyed gold handspun </h2>
<ul class="postlist-tags">
@@ -1454,7 +1455,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/spinners-dream-handspun/">
<h2 data-ha-exclude="" id="spinners-dream-handspun">spinner&#39;s dream handspun </h2>
<h2 data-ha-exclude="">spinner&#39;s dream handspun </h2>
<ul class="postlist-tags">
@@ -1468,7 +1469,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/rambouillet-handspun/">
<h2 data-ha-exclude="" id="rambouillet-handspun">rambouillet handspun </h2>
<h2 data-ha-exclude="">rambouillet handspun </h2>
<ul class="postlist-tags">
@@ -1484,7 +1485,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/fire-and-ice-handspun/">
<h2 data-ha-exclude="" id="fire-and-ice-handspun">fire &amp; ice handspun </h2>
<h2 data-ha-exclude="">fire &amp; ice handspun </h2>
<ul class="postlist-tags">
@@ -1498,7 +1499,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/dyeing-fiber/">
<h2 data-ha-exclude="" id="dyeing-fiber">dyeing fiber </h2>
<h2 data-ha-exclude="">dyeing fiber </h2>
<ul class="postlist-tags">
@@ -1512,7 +1513,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/coral-reef-handspun/">
<h2 data-ha-exclude="" id="coral-reef-handspun">coral reef handspun </h2>
<h2 data-ha-exclude="">coral reef handspun </h2>
<ul class="postlist-tags">
@@ -1526,7 +1527,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/bfl-silk-handspun/">
<h2 data-ha-exclude="" id="bfl-silk-handspun">BFL/silk handspun </h2>
<h2 data-ha-exclude="">BFL/silk handspun </h2>
<ul class="postlist-tags">
@@ -1540,7 +1541,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/spinning-plants/">
<h2 data-ha-exclude="" id="spinning-plants">spinning plants </h2>
<h2 data-ha-exclude="">spinning plants </h2>
<ul class="postlist-tags">
@@ -1554,7 +1555,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/comparing-text-editors/">
<h2 data-ha-exclude="" id="comparing-text-editors">comparing text editors </h2>
<h2 data-ha-exclude="">comparing text editors </h2>
<ul class="postlist-tags">
@@ -1568,7 +1569,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/an-intro-to-git/">
<h2 data-ha-exclude="" id="an-intro-to-git">an intro to git </h2>
<h2 data-ha-exclude="">an intro to git </h2>
<ul class="postlist-tags">
@@ -1654,6 +1655,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/1/` was built on 2026-09-20T00:40:45.063Z -->
<!-- This page `/1/` was built on 2026-09-20T22:08:17.530Z -->
</body>
</html>
10/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/anarchy-autism/">
<h2 data-ha-exclude="" id="anarchy-autism">anarchy autism </h2>
<h2 data-ha-exclude="">anarchy autism </h2>
<ul class="postlist-tags">
@@ -1418,7 +1419,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/ecommerce-options/">
<h2 data-ha-exclude="" id="ecommerce-options">ecommerce options </h2>
<h2 data-ha-exclude="">ecommerce options </h2>
<ul class="postlist-tags">
@@ -1430,7 +1431,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/rope-one/">
<h2 data-ha-exclude="" id="rope-one-mature">rope (one) (mature)</h2>
<h2 data-ha-exclude="">rope (one) (mature)</h2>
<ul class="postlist-tags">
@@ -1446,7 +1447,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/artisans-cooperative-shirts/">
<h2 data-ha-exclude="" id="artisans-cooperative-shirts">artisans cooperative shirts </h2>
<h2 data-ha-exclude="">artisans cooperative shirts </h2>
<ul class="postlist-tags">
@@ -1462,7 +1463,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/shrimp/">
<h2 data-ha-exclude="" id="shrimp">shrimp </h2>
<h2 data-ha-exclude="">shrimp </h2>
<ul class="postlist-tags">
@@ -1482,7 +1483,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/in-the-news/">
<h2 data-ha-exclude="" id="in-the-news">in the news </h2>
<h2 data-ha-exclude="">in the news </h2>
<ul class="postlist-tags">
@@ -1496,7 +1497,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/girldick/">
<h2 data-ha-exclude="" id="girldick-mature">girldick (mature)</h2>
<h2 data-ha-exclude="">girldick (mature)</h2>
<ul class="postlist-tags">
@@ -1518,7 +1519,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/boypussy/">
<h2 data-ha-exclude="" id="boypussy-mature">boypussy (mature)</h2>
<h2 data-ha-exclude="">boypussy (mature)</h2>
<ul class="postlist-tags">
@@ -1540,7 +1541,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/rainbow-shawl/">
<h2 data-ha-exclude="" id="rainbow-shawl">rainbow shawl </h2>
<h2 data-ha-exclude="">rainbow shawl </h2>
<ul class="postlist-tags">
@@ -1554,7 +1555,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/queer/">
<h2 data-ha-exclude="" id="queer">queer </h2>
<h2 data-ha-exclude="">queer </h2>
<ul class="postlist-tags">
@@ -1576,7 +1577,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/coming-out/">
<h2 data-ha-exclude="" id="coming-out">coming out </h2>
<h2 data-ha-exclude="">coming out </h2>
<ul class="postlist-tags">
@@ -1594,7 +1595,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/happy-bihrtday/">
<h2 data-ha-exclude="" id="happy-bihrtday">happy biHRTday </h2>
<h2 data-ha-exclude="">happy biHRTday </h2>
<ul class="postlist-tags">
@@ -1612,7 +1613,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/foxgloves/">
<h2 data-ha-exclude="" id="foxgloves">foxgloves </h2>
<h2 data-ha-exclude="">foxgloves </h2>
<ul class="postlist-tags">
@@ -1702,6 +1703,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/10/` was built on 2026-09-20T00:40:51.811Z -->
<!-- This page `/10/` was built on 2026-09-20T22:08:21.618Z -->
</body>
</html>
11/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/artisans-cooperative-cards/">
<h2 data-ha-exclude="" id="artisans-cooperative-cards">artisans cooperative cards </h2>
<h2 data-ha-exclude="">artisans cooperative cards </h2>
<ul class="postlist-tags">
@@ -1414,7 +1415,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/stickers/">
<h2 data-ha-exclude="" id="stickers">stickers! </h2>
<h2 data-ha-exclude="">stickers! </h2>
<ul class="postlist-tags">
@@ -1428,7 +1429,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/shirts/">
<h2 data-ha-exclude="" id="shirts">shirts! </h2>
<h2 data-ha-exclude="">shirts! </h2>
<ul class="postlist-tags">
@@ -1442,7 +1443,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/nonbinary-flag/">
<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
<h2 data-ha-exclude="">nonbinary flag </h2>
<ul class="postlist-tags">
@@ -1460,7 +1461,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/gender-in-data-models/">
<h2 data-ha-exclude="" id="gender-in-data-models">gender in data models </h2>
<h2 data-ha-exclude="">gender in data models </h2>
<ul class="postlist-tags">
@@ -1478,7 +1479,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/five-of-them/">
<h2 data-ha-exclude="" id="five-of-them">five of them </h2>
<h2 data-ha-exclude="">five of them </h2>
<ul class="postlist-tags">
@@ -1494,7 +1495,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/swallowtail-on-snowdrops/">
<h2 data-ha-exclude="" id="swallowtail-on-snowdrops">swallowtail on snowdrops </h2>
<h2 data-ha-exclude="">swallowtail on snowdrops </h2>
<ul class="postlist-tags">
@@ -1512,7 +1513,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leather-strap-journal/">
<h2 data-ha-exclude="" id="leather-strap-journal">leather strap journal </h2>
<h2 data-ha-exclude="">leather strap journal </h2>
<ul class="postlist-tags">
@@ -1526,7 +1527,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/hummingbird-become-ungovernable/">
<h2 data-ha-exclude="" id="hummingbird-become-ungovernable">hummingbird become ungovernable </h2>
<h2 data-ha-exclude="">hummingbird become ungovernable </h2>
<ul class="postlist-tags">
@@ -1544,7 +1545,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/printing-press-notes/">
<h2 data-ha-exclude="" id="printing-press-notes">printing press notes </h2>
<h2 data-ha-exclude="">printing press notes </h2>
<ul class="postlist-tags">
@@ -1556,7 +1557,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/stampede-journal/">
<h2 data-ha-exclude="" id="stampede-journal">stampede journal </h2>
<h2 data-ha-exclude="">stampede journal </h2>
<ul class="postlist-tags">
@@ -1570,7 +1571,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/orange-green-journal/">
<h2 data-ha-exclude="" id="orange-green-journal">orange green journal </h2>
<h2 data-ha-exclude="">orange green journal </h2>
<ul class="postlist-tags">
@@ -1584,7 +1585,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/baseball-journal/">
<h2 data-ha-exclude="" id="baseball-journal">baseball journal </h2>
<h2 data-ha-exclude="">baseball journal </h2>
<ul class="postlist-tags">
@@ -1670,6 +1671,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/11/` was built on 2026-09-20T00:40:52.304Z -->
<!-- This page `/11/` was built on 2026-09-20T22:08:21.990Z -->
</body>
</html>
12/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/trans-wrongs-skull/">
<h2 data-ha-exclude="" id="trans-wrongs-skull">trans wrongs skull </h2>
<h2 data-ha-exclude="">trans wrongs skull </h2>
<ul class="postlist-tags">
@@ -1420,7 +1421,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/geese-trans-wrongs/">
<h2 data-ha-exclude="" id="geese-trans-wrongs">geese/trans wrongs </h2>
<h2 data-ha-exclude="">geese/trans wrongs </h2>
<ul class="postlist-tags">
@@ -1438,7 +1439,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/spotted-towhee/">
<h2 data-ha-exclude="" id="spotted-towhee">spotted towhee </h2>
<h2 data-ha-exclude="">spotted towhee </h2>
<ul class="postlist-tags">
@@ -1454,7 +1455,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/knit-shrimp/">
<h2 data-ha-exclude="" id="knit-shrimp">knit shrimp </h2>
<h2 data-ha-exclude="">knit shrimp </h2>
<ul class="postlist-tags">
@@ -1468,7 +1469,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/geese/">
<h2 data-ha-exclude="" id="geese">geese </h2>
<h2 data-ha-exclude="">geese </h2>
<ul class="postlist-tags">
@@ -1486,7 +1487,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/fat-raccoon/">
<h2 data-ha-exclude="" id="fat-raccoon">fat raccoon </h2>
<h2 data-ha-exclude="">fat raccoon </h2>
<ul class="postlist-tags">
@@ -1504,7 +1505,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/big-pidge/">
<h2 data-ha-exclude="" id="big-pidge">big pidge </h2>
<h2 data-ha-exclude="">big pidge </h2>
<ul class="postlist-tags">
@@ -1522,7 +1523,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/shirt-making-notes/">
<h2 data-ha-exclude="" id="shirt-making-notes">shirt making notes </h2>
<h2 data-ha-exclude="">shirt making notes </h2>
<ul class="postlist-tags">
@@ -1534,7 +1535,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/trans-rights-skull/">
<h2 data-ha-exclude="" id="trans-rights-skull">trans rights skull </h2>
<h2 data-ha-exclude="">trans rights skull </h2>
<ul class="postlist-tags">
@@ -1556,7 +1557,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/stellars-jay/">
<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
<h2 data-ha-exclude="">stellar&#39;s jay </h2>
<ul class="postlist-tags">
@@ -1574,7 +1575,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/backend-accessibility/">
<h2 data-ha-exclude="" id="backend-accessibility">backend accessibility </h2>
<h2 data-ha-exclude="">backend accessibility </h2>
<ul class="postlist-tags">
@@ -1588,7 +1589,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/block-printing-transfer-method/">
<h2 data-ha-exclude="" id="block-printing-transfer-method">block printing transfer method </h2>
<h2 data-ha-exclude="">block printing transfer method </h2>
<ul class="postlist-tags">
@@ -1602,7 +1603,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/hair/">
<h2 data-ha-exclude="" id="hair">hair </h2>
<h2 data-ha-exclude="">hair </h2>
<ul class="postlist-tags">
@@ -1690,6 +1691,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/12/` was built on 2026-09-20T00:40:52.811Z -->
<!-- This page `/12/` was built on 2026-09-20T22:08:22.301Z -->
</body>
</html>
13/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/flicker/">
<h2 data-ha-exclude="" id="flicker">flicker </h2>
<h2 data-ha-exclude="">flicker </h2>
<ul class="postlist-tags">
@@ -1416,7 +1417,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/heron/">
<h2 data-ha-exclude="" id="heron">heron </h2>
<h2 data-ha-exclude="">heron </h2>
<ul class="postlist-tags">
@@ -1434,7 +1435,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/seedling/">
<h2 data-ha-exclude="" id="seedling">seedling </h2>
<h2 data-ha-exclude="">seedling </h2>
<ul class="postlist-tags">
@@ -1450,7 +1451,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/lupine/">
<h2 data-ha-exclude="" id="lupine">lupine </h2>
<h2 data-ha-exclude="">lupine </h2>
<ul class="postlist-tags">
@@ -1468,7 +1469,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leather-keychains/">
<h2 data-ha-exclude="" id="leather-keychains">leather keychains </h2>
<h2 data-ha-exclude="">leather keychains </h2>
<ul class="postlist-tags">
@@ -1482,7 +1483,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/killdeer/">
<h2 data-ha-exclude="" id="killdeer">killdeer </h2>
<h2 data-ha-exclude="">killdeer </h2>
<ul class="postlist-tags">
@@ -1498,7 +1499,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/junco/">
<h2 data-ha-exclude="" id="junco">junco </h2>
<h2 data-ha-exclude="">junco </h2>
<ul class="postlist-tags">
@@ -1514,7 +1515,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
<h2 data-ha-exclude="">handspun yarn in party mix and orange-gold </h2>
<ul class="postlist-tags">
@@ -1528,7 +1529,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/flatfish/">
<h2 data-ha-exclude="" id="flatfish">flatfish </h2>
<h2 data-ha-exclude="">flatfish </h2>
<ul class="postlist-tags">
@@ -1544,7 +1545,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/chanterelle/">
<h2 data-ha-exclude="" id="chanterelle">chanterelle </h2>
<h2 data-ha-exclude="">chanterelle </h2>
<ul class="postlist-tags">
@@ -1560,7 +1561,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/butch-hands-pattern/">
<h2 data-ha-exclude="" id="butch-hands-pattern">butch hands pattern </h2>
<h2 data-ha-exclude="">butch hands pattern </h2>
<ul class="postlist-tags">
@@ -1576,7 +1577,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/iris/">
<h2 data-ha-exclude="" id="iris">iris </h2>
<h2 data-ha-exclude="">iris </h2>
<ul class="postlist-tags">
@@ -1592,7 +1593,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/congrats-on-the-gay/">
<h2 data-ha-exclude="" id="congrats-on-the-gay">congrats on the gay </h2>
<h2 data-ha-exclude="">congrats on the gay </h2>
<ul class="postlist-tags">
@@ -1682,6 +1683,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/13/` was built on 2026-09-20T00:40:53.118Z -->
<!-- This page `/13/` was built on 2026-09-20T22:08:22.468Z -->
</body>
</html>
14/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/lined-notebook/">
<h2 data-ha-exclude="" id="lined-notebook">lined notebook </h2>
<h2 data-ha-exclude="">lined notebook </h2>
<ul class="postlist-tags">
@@ -1412,7 +1413,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/flocked-notebook/">
<h2 data-ha-exclude="" id="flocked-notebook">flocked notebook </h2>
<h2 data-ha-exclude="">flocked notebook </h2>
<ul class="postlist-tags">
@@ -1426,7 +1427,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-notebook/">
<h2 data-ha-exclude="" id="brookes-notebook">brooke&#39;s notebook </h2>
<h2 data-ha-exclude="">brooke&#39;s notebook </h2>
<ul class="postlist-tags">
@@ -1442,7 +1443,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/recommendations-and-favorites/">
<h2 data-ha-exclude="" id="recommendations-and-favorites">recommendations &amp; favorites </h2>
<h2 data-ha-exclude="">recommendations &amp; favorites </h2>
<ul class="postlist-tags">
@@ -1456,7 +1457,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/pink-socks/">
<h2 data-ha-exclude="" id="pink-socks">pink socks </h2>
<h2 data-ha-exclude="">pink socks </h2>
<ul class="postlist-tags">
@@ -1470,7 +1471,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-socks/">
<h2 data-ha-exclude="" id="brookes-socks">brooke&#39;s socks </h2>
<h2 data-ha-exclude="">brooke&#39;s socks </h2>
<ul class="postlist-tags">
@@ -1484,7 +1485,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/gender/">
<h2 data-ha-exclude="" id="gender">gender? </h2>
<h2 data-ha-exclude="">gender? </h2>
<ul class="postlist-tags">
@@ -1498,7 +1499,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/pride-dice-bags/">
<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
<h2 data-ha-exclude="">pride dice bags </h2>
<ul class="postlist-tags">
@@ -1514,7 +1515,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/square-watercolor-pad/">
<h2 data-ha-exclude="" id="square-watercolor-pad">square watercolor pad </h2>
<h2 data-ha-exclude="">square watercolor pad </h2>
<ul class="postlist-tags">
@@ -1528,7 +1529,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/tiny-books/">
<h2 data-ha-exclude="" id="tiny-books">tiny books </h2>
<h2 data-ha-exclude="">tiny books </h2>
<ul class="postlist-tags">
@@ -1542,7 +1543,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/orange-journal/">
<h2 data-ha-exclude="" id="orange-journal">orange journal </h2>
<h2 data-ha-exclude="">orange journal </h2>
<ul class="postlist-tags">
@@ -1556,7 +1557,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/striped-journal/">
<h2 data-ha-exclude="" id="striped-journal">striped journal </h2>
<h2 data-ha-exclude="">striped journal </h2>
<ul class="postlist-tags">
@@ -1570,7 +1571,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/green-memo-pad/">
<h2 data-ha-exclude="" id="green-memo-pad">green memo pad </h2>
<h2 data-ha-exclude="">green memo pad </h2>
<ul class="postlist-tags">
@@ -1656,6 +1657,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/14/` was built on 2026-09-20T00:40:53.720Z -->
<!-- This page `/14/` was built on 2026-09-20T22:08:22.651Z -->
</body>
</html>
15/index.html
+10 -9
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/blue-and-brown-leather-journal/">
<h2 data-ha-exclude="" id="blue-and-brown-leather-journal">blue and brown leather journal </h2>
<h2 data-ha-exclude="">blue and brown leather journal </h2>
<ul class="postlist-tags">
@@ -1412,7 +1413,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/acadia-coloring-journal/">
<h2 data-ha-exclude="" id="acadia-coloring-journal">Acadia coloring journal </h2>
<h2 data-ha-exclude="">Acadia coloring journal </h2>
<ul class="postlist-tags">
@@ -1426,7 +1427,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/pronoun-patches/">
<h2 data-ha-exclude="" id="pronoun-patches">pronoun patches </h2>
<h2 data-ha-exclude="">pronoun patches </h2>
<ul class="postlist-tags">
@@ -1444,7 +1445,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/congrats-on-the-autism-adhd/">
<h2 data-ha-exclude="" id="congrats-on-the-autism-adhd">congrats on the autism/adhd </h2>
<h2 data-ha-exclude="">congrats on the autism/adhd </h2>
<ul class="postlist-tags">
@@ -1460,7 +1461,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/become-unbutterable/">
<h2 data-ha-exclude="" id="become-unbutterable">become unbutterable </h2>
<h2 data-ha-exclude="">become unbutterable </h2>
<ul class="postlist-tags">
@@ -1474,7 +1475,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/queer-book-list/">
<h2 data-ha-exclude="" id="queer-book-list">queer book list </h2>
<h2 data-ha-exclude="">queer book list </h2>
<ul class="postlist-tags">
@@ -1554,6 +1555,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/15/` was built on 2026-09-20T00:40:54.154Z -->
<!-- This page `/15/` was built on 2026-09-20T22:08:22.949Z -->
</body>
</html>
2/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/orion-handspun/">
<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
<h2 data-ha-exclude="">orion handspun </h2>
<ul class="postlist-tags">
@@ -1412,7 +1413,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/moving-images/">
<h2 data-ha-exclude="" id="moving-images">moving images </h2>
<h2 data-ha-exclude="">moving images </h2>
<ul class="postlist-tags">
@@ -1426,7 +1427,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/petrichor-handspun/">
<h2 data-ha-exclude="" id="petrichor-handspun">petrichor handspun </h2>
<h2 data-ha-exclude="">petrichor handspun </h2>
<ul class="postlist-tags">
@@ -1440,7 +1441,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/light-grey-jacobs-handspun/">
<h2 data-ha-exclude="" id="light-grey-jacobs-handspun">light grey jacobs handspun </h2>
<h2 data-ha-exclude="">light grey jacobs handspun </h2>
<ul class="postlist-tags">
@@ -1454,7 +1455,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/icelandic-lamb-handspun/">
<h2 data-ha-exclude="" id="icelandic-lamb-handspun">icelandic lamb handspun </h2>
<h2 data-ha-exclude="">icelandic lamb handspun </h2>
<ul class="postlist-tags">
@@ -1468,7 +1469,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/handcombed-jacobs-handspun/">
<h2 data-ha-exclude="" id="handcombed-jacobs-handspun">handcombed jacobs handspun </h2>
<h2 data-ha-exclude="">handcombed jacobs handspun </h2>
<ul class="postlist-tags">
@@ -1482,7 +1483,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/happy-solstice-2025/">
<h2 data-ha-exclude="" id="happy-solstice-2025">happy solstice 2025 </h2>
<h2 data-ha-exclude="">happy solstice 2025 </h2>
<ul class="postlist-tags">
@@ -1496,7 +1497,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/stationery-exchange/">
<h2 data-ha-exclude="" id="stationery-exchange">stationery exchange </h2>
<h2 data-ha-exclude="">stationery exchange </h2>
<ul class="postlist-tags">
@@ -1510,7 +1511,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/siblinghood-of-the-traveling-greeting-card/">
<h2 data-ha-exclude="" id="siblinghood-of-the-traveling-greeting-card">siblinghood of the traveling greeting card </h2>
<h2 data-ha-exclude="">siblinghood of the traveling greeting card </h2>
<ul class="postlist-tags">
@@ -1524,7 +1525,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-scarf/">
<h2 data-ha-exclude="" id="brookes-scarf">brooke&#39;s scarf </h2>
<h2 data-ha-exclude="">brooke&#39;s scarf </h2>
<ul class="postlist-tags">
@@ -1538,7 +1539,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/my-favorite-git-flag/">
<h2 data-ha-exclude="" id="my-favorite-git-flag">my favorite git flag </h2>
<h2 data-ha-exclude="">my favorite git flag </h2>
<ul class="postlist-tags">
@@ -1552,7 +1553,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/dragon-mask/">
<h2 data-ha-exclude="" id="dragon-mask">dragon mask </h2>
<h2 data-ha-exclude="">dragon mask </h2>
<ul class="postlist-tags">
@@ -1568,7 +1569,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/intro-to-wireframing/">
<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
<h2 data-ha-exclude="">intro to wireframing </h2>
<ul class="postlist-tags">
@@ -1654,6 +1655,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/2/` was built on 2026-09-20T00:40:45.615Z -->
<!-- This page `/2/` was built on 2026-09-20T22:08:18.112Z -->
</body>
</html>
3/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/designing-a-bag/">
<h2 data-ha-exclude="" id="designing-a-bag">designing a bag </h2>
<h2 data-ha-exclude="">designing a bag </h2>
<ul class="postlist-tags">
@@ -1414,7 +1415,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-suspenders/">
<h2 data-ha-exclude="" id="brookes-suspenders">brooke&#39;s suspenders </h2>
<h2 data-ha-exclude="">brooke&#39;s suspenders </h2>
<ul class="postlist-tags">
@@ -1428,7 +1429,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/wrap-bracelets/">
<h2 data-ha-exclude="" id="wrap-bracelets">wrap bracelets </h2>
<h2 data-ha-exclude="">wrap bracelets </h2>
<ul class="postlist-tags">
@@ -1442,7 +1443,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/acadia-mitts/">
<h2 data-ha-exclude="" id="acadia-mitts">acadia mitts </h2>
<h2 data-ha-exclude="">acadia mitts </h2>
<ul class="postlist-tags">
@@ -1456,7 +1457,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/on-the-shoulders-of-giants/">
<h2 data-ha-exclude="" id="on-the-shoulders-of-giants">on the shoulders of giants </h2>
<h2 data-ha-exclude="">on the shoulders of giants </h2>
<ul class="postlist-tags">
@@ -1472,7 +1473,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/sideways-canvas-shirt/">
<h2 data-ha-exclude="" id="sideways-canvas-shirt">sideways canvas shirt </h2>
<h2 data-ha-exclude="">sideways canvas shirt </h2>
<ul class="postlist-tags">
@@ -1486,7 +1487,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/scrap-patches/">
<h2 data-ha-exclude="" id="scrap-patches">scrap patches </h2>
<h2 data-ha-exclude="">scrap patches </h2>
<ul class="postlist-tags">
@@ -1500,7 +1501,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/keffiyah-fishing-net-pattern/">
<h2 data-ha-exclude="" id="keffiyah-fishing-net-pattern">keffiyah fishing net pattern </h2>
<h2 data-ha-exclude="">keffiyah fishing net pattern </h2>
<ul class="postlist-tags">
@@ -1514,7 +1515,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/art-shows-and-events/">
<h2 data-ha-exclude="" id="art-shows-and-events">art shows and events </h2>
<h2 data-ha-exclude="">art shows and events </h2>
<ul class="postlist-tags">
@@ -1526,7 +1527,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/textures-unite/">
<h2 data-ha-exclude="" id="textures-unite">textures unite </h2>
<h2 data-ha-exclude="">textures unite </h2>
<ul class="postlist-tags">
@@ -1542,7 +1543,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/redirections/">
<h2 data-ha-exclude="" id="redirections">redirections </h2>
<h2 data-ha-exclude="">redirections </h2>
<ul class="postlist-tags">
@@ -1556,7 +1557,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/azure-locations-and-file-crawling/">
<h2 data-ha-exclude="" id="azure-locations-and-file-crawling">azure locations and file crawling </h2>
<h2 data-ha-exclude="">azure locations and file crawling </h2>
<ul class="postlist-tags">
@@ -1572,7 +1573,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/fix-your-hearts/">
<h2 data-ha-exclude="" id="fix-your-hearts">fix your hearts </h2>
<h2 data-ha-exclude="">fix your hearts </h2>
<ul class="postlist-tags">
@@ -1658,6 +1659,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/3/` was built on 2026-09-20T00:40:46.226Z -->
<!-- This page `/3/` was built on 2026-09-20T22:08:18.566Z -->
</body>
</html>
4/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/networks-of-trans-care/">
<h2 data-ha-exclude="" id="networks-of-trans-care">networks of trans care </h2>
<h2 data-ha-exclude="">networks of trans care </h2>
<ul class="postlist-tags">
@@ -1412,7 +1413,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/give-to-trans-orgs-and-people/">
<h2 data-ha-exclude="" id="give-to-trans-orgs-and-people">give to trans orgs and people </h2>
<h2 data-ha-exclude="">give to trans orgs and people </h2>
<ul class="postlist-tags">
@@ -1426,7 +1427,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/loon/">
<h2 data-ha-exclude="" id="loon">loon </h2>
<h2 data-ha-exclude="">loon </h2>
<ul class="postlist-tags">
@@ -1440,7 +1441,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/kestrel-zine/">
<h2 data-ha-exclude="" id="kestrel-zine">kestrel zine </h2>
<h2 data-ha-exclude="">kestrel zine </h2>
<ul class="postlist-tags">
@@ -1458,7 +1459,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/happy-solstice-2024/">
<h2 data-ha-exclude="" id="happy-solstice-2024">happy solstice 2024 </h2>
<h2 data-ha-exclude="">happy solstice 2024 </h2>
<ul class="postlist-tags">
@@ -1470,7 +1471,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/greeting-loons/">
<h2 data-ha-exclude="" id="greeting-loons">greeting loons </h2>
<h2 data-ha-exclude="">greeting loons </h2>
<ul class="postlist-tags">
@@ -1488,7 +1489,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/fountain-pen-friendly-stationery/">
<h2 data-ha-exclude="" id="fountain-pen-friendly-stationery">fountain pen-friendly stationery </h2>
<h2 data-ha-exclude="">fountain pen-friendly stationery </h2>
<ul class="postlist-tags">
@@ -1502,7 +1503,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brown-creeper/">
<h2 data-ha-exclude="" id="brown-creeper">brown creeper </h2>
<h2 data-ha-exclude="">brown creeper </h2>
<ul class="postlist-tags">
@@ -1516,7 +1517,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/quorbs/">
<h2 data-ha-exclude="" id="quorbs">quorbs </h2>
<h2 data-ha-exclude="">quorbs </h2>
<ul class="postlist-tags">
@@ -1532,7 +1533,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/not-a-drill/">
<h2 data-ha-exclude="" id="not-a-drill">not a drill </h2>
<h2 data-ha-exclude="">not a drill </h2>
<ul class="postlist-tags">
@@ -1548,7 +1549,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leather-long-stitch-journals/">
<h2 data-ha-exclude="" id="leather-long-stitch-journals">leather long-stitch journals </h2>
<h2 data-ha-exclude="">leather long-stitch journals </h2>
<ul class="postlist-tags">
@@ -1564,7 +1565,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/lobstah/">
<h2 data-ha-exclude="" id="lobstah">lobstah </h2>
<h2 data-ha-exclude="">lobstah </h2>
<ul class="postlist-tags">
@@ -1578,7 +1579,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/greeting-quorbs/">
<h2 data-ha-exclude="" id="greeting-quorbs">greeting quorbs </h2>
<h2 data-ha-exclude="">greeting quorbs </h2>
<ul class="postlist-tags">
@@ -1666,6 +1667,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/4/` was built on 2026-09-20T00:40:47.011Z -->
<!-- This page `/4/` was built on 2026-09-20T22:08:18.967Z -->
</body>
</html>
404.html
+4 -3
View File
@@ -51,6 +51,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -109,7 +111,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1400,7 +1401,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>" data-pagefind-body="">
<h1></h1>
<h1 id="sorry-cant-find-that">Sorry, can't find that</h1>
<h1>Sorry, can't find that</h1>
<p>Head <a href="/">home</a>.</p>
</heading-anchors>
@@ -1450,6 +1451,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/404.html` was built on 2026-09-20T00:40:39.768Z -->
<!-- This page `/404.html` was built on 2026-09-20T22:08:14.572Z -->
</body>
</html>
5/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/fedizinefest-2025/">
<h2 data-ha-exclude="" id="fedizinefest-2025">fediZineFest 2025 </h2>
<h2 data-ha-exclude="">fediZineFest 2025 </h2>
<ul class="postlist-tags">
@@ -1412,7 +1413,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/euphorbia/">
<h2 data-ha-exclude="" id="euphorbia">euphorbia </h2>
<h2 data-ha-exclude="">euphorbia </h2>
<ul class="postlist-tags">
@@ -1426,7 +1427,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/on-the-ubiquity-of-enby/">
<h2 data-ha-exclude="" id="on-the-ubiquity-of-enby">on the ubiquity of &#39;enby&#39; </h2>
<h2 data-ha-exclude="">on the ubiquity of &#39;enby&#39; </h2>
<ul class="postlist-tags">
@@ -1440,7 +1441,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/handedness-toggle/">
<h2 data-ha-exclude="" id="handedness-toggle">handedness toggle </h2>
<h2 data-ha-exclude="">handedness toggle </h2>
<ul class="postlist-tags">
@@ -1454,7 +1455,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/rescue-trans-rescue/">
<h2 data-ha-exclude="" id="rescue-trans-rescue">rescue Trans Rescue </h2>
<h2 data-ha-exclude="">rescue Trans Rescue </h2>
<ul class="postlist-tags">
@@ -1466,7 +1467,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/no-politics-wip/">
<h2 data-ha-exclude="" id="no-politics-wip">no politics (wip) </h2>
<h2 data-ha-exclude="">no politics (wip) </h2>
<ul class="postlist-tags">
@@ -1478,7 +1479,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/booby-congrats-on-the-top-surgery/">
<h2 data-ha-exclude="" id="booby-congrats-on-the-top-surgery">booby (congrats on the top surgery) </h2>
<h2 data-ha-exclude="">booby (congrats on the top surgery) </h2>
<ul class="postlist-tags">
@@ -1496,7 +1497,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/luminescent/">
<h2 data-ha-exclude="" id="luminescent-mature">luminescent (mature)</h2>
<h2 data-ha-exclude="">luminescent (mature)</h2>
<ul class="postlist-tags">
@@ -1512,7 +1513,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/kniphofia/">
<h2 data-ha-exclude="" id="kniphofia">kniphofia </h2>
<h2 data-ha-exclude="">kniphofia </h2>
<ul class="postlist-tags">
@@ -1526,7 +1527,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/fd-signifier-and-oppositional-sexism/">
<h2 data-ha-exclude="" id="fd-signifier-and-oppositional-sexism">fd signifier &amp; oppositional sexism </h2>
<h2 data-ha-exclude="">fd signifier &amp; oppositional sexism </h2>
<ul class="postlist-tags">
@@ -1540,7 +1541,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/triangle-pouch/">
<h2 data-ha-exclude="" id="triangle-pouch">triangle pouch </h2>
<h2 data-ha-exclude="">triangle pouch </h2>
<ul class="postlist-tags">
@@ -1554,7 +1555,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/tiny-portraits/">
<h2 data-ha-exclude="" id="tiny-portraits">tiny portraits </h2>
<h2 data-ha-exclude="">tiny portraits </h2>
<ul class="postlist-tags">
@@ -1568,7 +1569,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/snap-pouch/">
<h2 data-ha-exclude="" id="snap-pouch">snap pouch </h2>
<h2 data-ha-exclude="">snap pouch </h2>
<ul class="postlist-tags">
@@ -1654,6 +1655,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/5/` was built on 2026-09-20T00:40:48.135Z -->
<!-- This page `/5/` was built on 2026-09-20T22:08:19.596Z -->
</body>
</html>
6/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/gender-as-a-proxy-variable/">
<h2 data-ha-exclude="" id="gender-as-a-proxy-variable">gender as a proxy variable </h2>
<h2 data-ha-exclude="">gender as a proxy variable </h2>
<ul class="postlist-tags">
@@ -1414,7 +1415,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/o-ring-bracelet/">
<h2 data-ha-exclude="" id="o-ring-bracelet">o-ring bracelet </h2>
<h2 data-ha-exclude="">o-ring bracelet </h2>
<ul class="postlist-tags">
@@ -1428,7 +1429,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leaf-patches/">
<h2 data-ha-exclude="" id="leaf-patches">leaf patches </h2>
<h2 data-ha-exclude="">leaf patches </h2>
<ul class="postlist-tags">
@@ -1442,7 +1443,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/bowtie/">
<h2 data-ha-exclude="" id="bowtie">bowtie </h2>
<h2 data-ha-exclude="">bowtie </h2>
<ul class="postlist-tags">
@@ -1456,7 +1457,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/swoop-wallet/">
<h2 data-ha-exclude="" id="swoop-wallet">swoop wallet </h2>
<h2 data-ha-exclude="">swoop wallet </h2>
<ul class="postlist-tags">
@@ -1470,7 +1471,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/squarsh/">
<h2 data-ha-exclude="" id="squarsh">squarsh </h2>
<h2 data-ha-exclude="">squarsh </h2>
<ul class="postlist-tags">
@@ -1484,7 +1485,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/rachels-bracelets/">
<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
<h2 data-ha-exclude="">rachel&#39;s bracelets </h2>
<ul class="postlist-tags">
@@ -1498,7 +1499,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/printmaking-paper-notes/">
<h2 data-ha-exclude="" id="printmaking-paper-notes">printmaking paper notes </h2>
<h2 data-ha-exclude="">printmaking paper notes </h2>
<ul class="postlist-tags">
@@ -1512,7 +1513,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/bottom-growth/">
<h2 data-ha-exclude="" id="bottom-growth-mature">bottom growth (mature)</h2>
<h2 data-ha-exclude="">bottom growth (mature)</h2>
<ul class="postlist-tags">
@@ -1528,7 +1529,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/soras-collar/">
<h2 data-ha-exclude="" id="soras-collar">sora&#39;s collar </h2>
<h2 data-ha-exclude="">sora&#39;s collar </h2>
<ul class="postlist-tags">
@@ -1542,7 +1543,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/shrimp-cat-toy/">
<h2 data-ha-exclude="" id="shrimp-cat-toy">shrimp cat toy </h2>
<h2 data-ha-exclude="">shrimp cat toy </h2>
<ul class="postlist-tags">
@@ -1556,7 +1557,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/foldy-wallet-with-thumb-slide/">
<h2 data-ha-exclude="" id="foldy-wallet-with-thumb-slide">foldy wallet with thumb slide </h2>
<h2 data-ha-exclude="">foldy wallet with thumb slide </h2>
<ul class="postlist-tags">
@@ -1570,7 +1571,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-cuff-bracelets/">
<h2 data-ha-exclude="" id="brookes-cuff-bracelets">brooke&#39;s cuff bracelets </h2>
<h2 data-ha-exclude="">brooke&#39;s cuff bracelets </h2>
<ul class="postlist-tags">
@@ -1656,6 +1657,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/6/` was built on 2026-09-20T00:40:48.747Z -->
<!-- This page `/6/` was built on 2026-09-20T22:08:20.067Z -->
</body>
</html>
7/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/aarons-mask/">
<h2 data-ha-exclude="" id="aarons-mask">aaron&#39;s mask </h2>
<h2 data-ha-exclude="">aaron&#39;s mask </h2>
<ul class="postlist-tags">
@@ -1412,7 +1413,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/sunflower/">
<h2 data-ha-exclude="" id="sunflower">sunflower </h2>
<h2 data-ha-exclude="">sunflower </h2>
<ul class="postlist-tags">
@@ -1426,7 +1427,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/foldy-wallet/">
<h2 data-ha-exclude="" id="foldy-wallet">foldy wallet </h2>
<h2 data-ha-exclude="">foldy wallet </h2>
<ul class="postlist-tags">
@@ -1440,7 +1441,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/proud-dad-wallet/">
<h2 data-ha-exclude="" id="proud-dad-wallet">proud dad wallet </h2>
<h2 data-ha-exclude="">proud dad wallet </h2>
<ul class="postlist-tags">
@@ -1456,7 +1457,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/patchwork-wallet/">
<h2 data-ha-exclude="" id="patchwork-wallet">patchwork wallet </h2>
<h2 data-ha-exclude="">patchwork wallet </h2>
<ul class="postlist-tags">
@@ -1472,7 +1473,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/mom-bag/">
<h2 data-ha-exclude="" id="mom-bag">mom bag </h2>
<h2 data-ha-exclude="">mom bag </h2>
<ul class="postlist-tags">
@@ -1486,7 +1487,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/gradient-purse-strap/">
<h2 data-ha-exclude="" id="gradient-purse-strap">gradient purse strap </h2>
<h2 data-ha-exclude="">gradient purse strap </h2>
<ul class="postlist-tags">
@@ -1500,7 +1501,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/zipper-bifold-green/">
<h2 data-ha-exclude="" id="zipper-bifold-green">zipper bifold (green) </h2>
<h2 data-ha-exclude="">zipper bifold (green) </h2>
<ul class="postlist-tags">
@@ -1514,7 +1515,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/vix-collar/">
<h2 data-ha-exclude="" id="vix-collar">vix collar </h2>
<h2 data-ha-exclude="">vix collar </h2>
<ul class="postlist-tags">
@@ -1528,7 +1529,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/trans-the-world/">
<h2 data-ha-exclude="" id="trans-the-world">trans the world </h2>
<h2 data-ha-exclude="">trans the world </h2>
<ul class="postlist-tags">
@@ -1546,7 +1547,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/slightly-weird-man-club/">
<h2 data-ha-exclude="" id="slightly-weird-man-club">slightly weird man club </h2>
<h2 data-ha-exclude="">slightly weird man club </h2>
<ul class="postlist-tags">
@@ -1564,7 +1565,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/pins/">
<h2 data-ha-exclude="" id="pins">pins! </h2>
<h2 data-ha-exclude="">pins! </h2>
<ul class="postlist-tags">
@@ -1578,7 +1579,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/mousie/">
<h2 data-ha-exclude="" id="mousie">mousie </h2>
<h2 data-ha-exclude="">mousie </h2>
<ul class="postlist-tags">
@@ -1664,6 +1665,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/7/` was built on 2026-09-20T00:40:49.522Z -->
<!-- This page `/7/` was built on 2026-09-20T22:08:20.433Z -->
</body>
</html>
8/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/long-zipper-bifold/">
<h2 data-ha-exclude="" id="long-zipper-bifold">long zipper bifold </h2>
<h2 data-ha-exclude="">long zipper bifold </h2>
<ul class="postlist-tags">
@@ -1412,7 +1413,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/tooled-leather-patches/">
<h2 data-ha-exclude="" id="tooled-leather-patches">tooled leather patches </h2>
<h2 data-ha-exclude="">tooled leather patches </h2>
<ul class="postlist-tags">
@@ -1430,7 +1431,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/fishhook-pride-keychains/">
<h2 data-ha-exclude="" id="fishhook-pride-keychains">fishhook pride keychains </h2>
<h2 data-ha-exclude="">fishhook pride keychains </h2>
<ul class="postlist-tags">
@@ -1446,7 +1447,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/circle-bag/">
<h2 data-ha-exclude="" id="circle-bag">circle bag </h2>
<h2 data-ha-exclude="">circle bag </h2>
<ul class="postlist-tags">
@@ -1460,7 +1461,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/on-pronouns/">
<h2 data-ha-exclude="" id="on-pronouns">on pronouns </h2>
<h2 data-ha-exclude="">on pronouns </h2>
<ul class="postlist-tags">
@@ -1474,7 +1475,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/stephanie-collar/">
<h2 data-ha-exclude="" id="stephanie-collar">stephanie collar </h2>
<h2 data-ha-exclude="">stephanie collar </h2>
<ul class="postlist-tags">
@@ -1488,7 +1489,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/tiny-mushrooms/">
<h2 data-ha-exclude="" id="tiny-mushrooms">tiny mushrooms </h2>
<h2 data-ha-exclude="">tiny mushrooms </h2>
<ul class="postlist-tags">
@@ -1502,7 +1503,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/pinatex-wallet-with-zipper/">
<h2 data-ha-exclude="" id="pinatex-wallet-with-zipper">piñatex wallet with zipper </h2>
<h2 data-ha-exclude="">piñatex wallet with zipper </h2>
<ul class="postlist-tags">
@@ -1516,7 +1517,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/moss-harness/">
<h2 data-ha-exclude="" id="moss-harness">moss harness </h2>
<h2 data-ha-exclude="">moss harness </h2>
<ul class="postlist-tags">
@@ -1530,7 +1531,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/makers-mark-keychain/">
<h2 data-ha-exclude="" id="makers-mark-keychain">maker&#39;s mark keychain </h2>
<h2 data-ha-exclude="">maker&#39;s mark keychain </h2>
<ul class="postlist-tags">
@@ -1544,7 +1545,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-collar/">
<h2 data-ha-exclude="" id="brookes-collar">brooke&#39;s collar </h2>
<h2 data-ha-exclude="">brooke&#39;s collar </h2>
<ul class="postlist-tags">
@@ -1558,7 +1559,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/bag-strap/">
<h2 data-ha-exclude="" id="bag-strap">bag strap </h2>
<h2 data-ha-exclude="">bag strap </h2>
<ul class="postlist-tags">
@@ -1572,7 +1573,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/artists-conk/">
<h2 data-ha-exclude="" id="artists-conk">artists conk! </h2>
<h2 data-ha-exclude="">artists conk! </h2>
<ul class="postlist-tags">
@@ -1656,6 +1657,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/8/` was built on 2026-09-20T00:40:50.150Z -->
<!-- This page `/8/` was built on 2026-09-20T22:08:20.927Z -->
</body>
</html>
9/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="home">home</h1>
<h1>home</h1>
<p class="centered">(see the <a href="/tags/highlight/">highlights</a>
or <a href="/tags/">browse by tags</a>)</p>
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/domain-and-site-setup/">
<h2 data-ha-exclude="" id="domain-and-site-setup">domain and site setup </h2>
<h2 data-ha-exclude="">domain and site setup </h2>
<ul class="postlist-tags">
@@ -1412,7 +1413,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/x-acto-knife-sheath/">
<h2 data-ha-exclude="" id="x-acto-knife-sheath">x-acto knife sheath </h2>
<h2 data-ha-exclude="">x-acto knife sheath </h2>
<ul class="postlist-tags">
@@ -1426,7 +1427,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/little-critter-pouch/">
<h2 data-ha-exclude="" id="little-critter-pouch">little critter pouch </h2>
<h2 data-ha-exclude="">little critter pouch </h2>
<ul class="postlist-tags">
@@ -1442,7 +1443,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/zipper-bifold/">
<h2 data-ha-exclude="" id="zipper-bifold">zipper bifold </h2>
<h2 data-ha-exclude="">zipper bifold </h2>
<ul class="postlist-tags">
@@ -1456,7 +1457,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/vertical-zipper-card-wallet/">
<h2 data-ha-exclude="" id="vertical-zipper-card-wallet">vertical zipper card wallet </h2>
<h2 data-ha-exclude="">vertical zipper card wallet </h2>
<ul class="postlist-tags">
@@ -1470,7 +1471,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/vertical-card-wallet/">
<h2 data-ha-exclude="" id="vertical-card-wallet">vertical card wallet </h2>
<h2 data-ha-exclude="">vertical card wallet </h2>
<ul class="postlist-tags">
@@ -1484,7 +1485,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/vertical-bifold/">
<h2 data-ha-exclude="" id="vertical-bifold">vertical bifold </h2>
<h2 data-ha-exclude="">vertical bifold </h2>
<ul class="postlist-tags">
@@ -1498,7 +1499,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/eight-pocket-bifold/">
<h2 data-ha-exclude="" id="eight-pocket-bifold">eight pocket bifold </h2>
<h2 data-ha-exclude="">eight pocket bifold </h2>
<ul class="postlist-tags">
@@ -1512,7 +1513,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/double-bill-pocket-bifold/">
<h2 data-ha-exclude="" id="double-bill-pocket-bifold">double bill pocket bifold </h2>
<h2 data-ha-exclude="">double bill pocket bifold </h2>
<ul class="postlist-tags">
@@ -1526,7 +1527,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/nine-pocket-bifold/">
<h2 data-ha-exclude="" id="nine-pocket-bifold">nine pocket bifold </h2>
<h2 data-ha-exclude="">nine pocket bifold </h2>
<ul class="postlist-tags">
@@ -1540,7 +1541,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leather-lighter-case/">
<h2 data-ha-exclude="" id="leather-lighter-case">leather lighter case </h2>
<h2 data-ha-exclude="">leather lighter case </h2>
<ul class="postlist-tags">
@@ -1554,7 +1555,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leather-chest-harness/">
<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
<h2 data-ha-exclude="">leather chest harness </h2>
<ul class="postlist-tags">
@@ -1568,7 +1569,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leatherworking-favorites/">
<h2 data-ha-exclude="" id="leatherworking-favorites">leatherworking favorites </h2>
<h2 data-ha-exclude="">leatherworking favorites </h2>
<ul class="postlist-tags">
@@ -1654,6 +1655,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/9/` was built on 2026-09-20T00:40:51.065Z -->
<!-- This page `/9/` was built on 2026-09-20T22:08:21.274Z -->
</body>
</html>
aarons-mask/index.html
+16 -13
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="aarons-mask">aaron&#39;s mask</h1>
<h1>aaron&#39;s mask</h1>
<div class="post-metadata">
<p>
@@ -1882,47 +1883,49 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/triangle-pouch/">
<h2 data-ha-exclude="" id="triangle-pouch">triangle pouch </h2>
<a class="postlink" href="/patchwork-wallet/">
<h2 data-ha-exclude="">patchwork wallet </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>highlight</li>
</ul>
<img src="/img/triangle-pouch.jpg" alt="5 small triangular pouches made of leather in two sizes and various colors." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/patchwork-wallet.jpg" alt="A collage showing a wallet in a patchwork style, with different colors of leather all stitched together to make up the exterior and the top interior pockets. Other pockets inside are dyed various colors." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/leatherworking-favorites/">
<h2 data-ha-exclude="" id="leatherworking-favorites">leatherworking favorites </h2>
<a class="postlink" href="/vertical-zipper-card-wallet/">
<h2 data-ha-exclude="">vertical zipper card wallet </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/leather-harness-wip.jpg" alt="two pieces of a chest harness sitting on a messy workbench. both pieces are about 8 inches long total and consist of two large o-rings joined by a dark teal leather strap. the o rings and rivets are matte black." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/vertical-zipper-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets, a hidden pocket, and a zippered coin pouch." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/moss-harness/">
<h2 data-ha-exclude="" id="moss-harness">moss harness </h2>
<a class="postlink" href="/foldy-wallet-with-thumb-slide/">
<h2 data-ha-exclude="">foldy wallet with thumb slide </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/moss-harness.jpg" alt="A nylon webbing harness in bright teal laid out on a desk." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/foldy-thumb-slide.jpg" alt="A card wallet with one main pocket and one quick access slot with a thumb slide. The cover of the main pocket curves around the thumb slide." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
@@ -1979,6 +1982,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/aarons-mask/` was built on 2026-09-20T00:40:39.735Z -->
<!-- This page `/aarons-mask/` was built on 2026-09-20T22:08:14.536Z -->
</body>
</html>
about/index.html
+6 -5
View File
@@ -51,6 +51,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -109,7 +111,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>" data-pagefind-body="">
<h1 id="about">about</h1>
<h1>about</h1>
<p>My name is Lee Cattarin. I use he or ze pronouns.</p>
@@ -1409,7 +1410,7 @@ switch (currentThemeValue) {
<p>As of November 2023, my wife Brooke Osment and I have a art store: Riverside Refuge Studio. You can find various store links, or other ways to connect, on my <a href="/contact">contact page</a>. We're based out of Vashon, WA, USA, and ship internationally.</p>
<h2 id="pets">pets</h2>
<h2>pets</h2>
<p>We have a dog...</p>
@@ -1419,7 +1420,7 @@ switch (currentThemeValue) {
<img src="/img/duckies.png" alt="2 pictures that show all six ducks, each duck labeled with their name. In the first image, Sparrow (Golden 300, a light brown breed that looks similar to female mallards) and Puffin (Swedish Black, black with a white bib and beautiful iridescence) come up to eat from my hand. In the second image, Chickadee (Magpie, black and white splotched) is up front looking to one side, and behind her are Dodo (Silver Runner, white and grey), Emu (Fawn & White Runner, white and pale tan), and Kiwi (Chocolate Runner, dark brown all over), with Sparrow and Puffin partially visible behind." loading="lazy" decoding="async" width="1000" height="562">
<h2 id="webrings">webrings</h2>
<h2>webrings</h2>
@@ -1567,6 +1568,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/about/` was built on 2026-09-20T00:40:39.767Z -->
<!-- This page `/about/` was built on 2026-09-20T22:08:14.571Z -->
</body>
</html>
acadia-coloring-journal/index.html
+14 -15
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="acadia-coloring-journal">Acadia coloring journal</h1>
<h1>Acadia coloring journal</h1>
<div class="post-metadata">
<p>
@@ -1898,49 +1899,47 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/lined-notebook/">
<h2 data-ha-exclude="" id="lined-notebook">lined notebook </h2>
<a class="postlink" href="/striped-journal/">
<h2 data-ha-exclude="">striped journal </h2>
<ul class="postlist-tags">
<li>book</li>
</ul>
<img src="/img/lined-notebook.jpg" alt="A three panel collage showing a the endpapers, cover, and pages of a small hardbound notebook." loading="lazy" decoding="async" width="1000" height="1776">
<img src="/img/striped-journal.jpg" alt="A three panel collage showcasing a journal with a striped cover." loading="lazy" decoding="async" width="1000" height="1776">
</a>
</li>
<li class="post">
<a class="postlink" href="/black-and-red-journal/">
<h2 data-ha-exclude="" id="black-and-red-journal">black and red journal </h2>
<a class="postlink" href="/orange-journal/">
<h2 data-ha-exclude="">orange journal </h2>
<ul class="postlist-tags">
<li>book</li>
<li>leather</li>
</ul>
<img src="/img/black-red-journal.jpg" alt="3 image collage showing a leather-bound journal. The cover is black, with long red vertical stitches along the spine and a red leather strap for a closure. On the back in one lower corner is stamped LEE CAT ART" loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/orange-journal.jpg" alt="A three panel collage showcasing a small book with foldout pages and a bright orange cover." loading="lazy" decoding="async" width="1000" height="1776">
</a>
</li>
<li class="post">
<a class="postlink" href="/orange-green-journal/">
<h2 data-ha-exclude="" id="orange-green-journal">orange green journal </h2>
<a class="postlink" href="/flocked-notebook/">
<h2 data-ha-exclude="">flocked notebook </h2>
<ul class="postlist-tags">
<li>book</li>
</ul>
<img src="/img/orange-green-journal.jpg" alt="A 4-part collage of a slim handbound book." loading="lazy" decoding="async" width="1000" height="1777">
<img src="/img/flocked-notebook.jpg" alt="A two panel collage showing the cover and endpapers of a thick notebook." loading="lazy" decoding="async" width="1000" height="1331">
</a>
</li>
@@ -1997,6 +1996,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/acadia-coloring-journal/` was built on 2026-09-20T00:40:39.710Z -->
<!-- This page `/acadia-coloring-journal/` was built on 2026-09-20T22:08:14.532Z -->
</body>
</html>
acadia-mitts/index.html
+14 -11
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="acadia-mitts">acadia mitts</h1>
<h1>acadia mitts</h1>
<div class="post-metadata">
<p>
@@ -1882,26 +1883,26 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/brookes-scarf/">
<h2 data-ha-exclude="" id="brookes-scarf">brooke&#39;s scarf </h2>
<a class="postlink" href="/knit-shrimp/">
<h2 data-ha-exclude="">knit shrimp </h2>
<ul class="postlist-tags">
<li>knit</li>
</ul>
<img src="/img/brooke-scarf.jpg" alt="A diaphanous knit lacework scarf draped over the back of a chair. It is split down the long way into two colors - one tinted orange and one tinted mint blue. Both colors, the orange and the blue, are held double with the same variegated gray, making the piece more cohesive. The yarn overs in the lacework create airy repeating holes." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/knit-shrimp.jpg" alt="Four knitted shrimp in various shades of pink. They are all somewhere around hand-sized, and have little yarn antennae and leggies." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/brookes-socks/">
<h2 data-ha-exclude="" id="brookes-socks">brooke&#39;s socks </h2>
<h2 data-ha-exclude="">brooke&#39;s socks </h2>
<ul class="postlist-tags">
@@ -1914,15 +1915,17 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/pink-socks/">
<h2 data-ha-exclude="" id="pink-socks">pink socks </h2>
<a class="postlink" href="/pride-dice-bags/">
<h2 data-ha-exclude="">pride dice bags </h2>
<ul class="postlist-tags">
<li>knit</li>
<li>gender</li>
</ul>
<img src="/img/pink-socks.jpg" alt="Feet propped up on a car dashboard, with a desert landscape beyond. The feet are in salmon-colored socks with black flecks, and decorative lines running down the socks." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
</a>
</li>
@@ -1979,6 +1982,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/acadia-mitts/` was built on 2026-09-20T00:40:39.761Z -->
<!-- This page `/acadia-mitts/` was built on 2026-09-20T22:08:14.542Z -->
</body>
</html>
accessibility/index.html
+5 -4
View File
@@ -51,6 +51,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -109,7 +111,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1398,12 +1399,12 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>" data-pagefind-body="">
<h1 id="accessibility">accessibility</h1>
<h1>accessibility</h1>
<p>This website (<a href="/">leecat.art</a>) aims to be as accessible as possible. To that end, I have tested to the best of my abilities with <a href="https://www.nvaccess.org/download/" target="_blank" rel="external">NVDA</a> and <a href="https://help.gnome.org/orca/index.html" target="_blank" rel="external">Orca</a>, keyboard navigation, and automated review tools.</p>
<h2 id="limitations">Limitations</h2>
<p>Because of the nature of a blog with an ever-expanding page list and the fact that I have learned a significant amount in 4 or so years, I cannot guarantee that every article on this site is as accessible as I want it to be. That said, the major pages and navigation have been tested, and I bring my best efforts to every new post.</p>
<h2 id="adherence-to-wcag-2-2">Adherence to WCAG 2.2</h2>
<h2 id="adherence-to-wcag-2.2">Adherence to WCAG 2.2</h2>
<p>While I would like to do further structured review and go through the entire list with a finer-tooth comb, my current assessment is that this site meets <a href="https://www.w3.org/WAI/standards-guidelines/wcag/" target="_blank" rel="external">WCAG 2.2</a> at least at level AA.</p>
<h2 id="feedback">Feedback</h2>
<p>If you meet any barriers in accessing this site, please <a href="/contact">contact me</a>.</p>
@@ -1455,6 +1456,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/accessibility/` was built on 2026-09-20T00:40:39.772Z -->
<!-- This page `/accessibility/` was built on 2026-09-20T22:08:14.572Z -->
</body>
</html>
accessible-image-modals/index.html
+149 -27
View File
@@ -40,7 +40,80 @@
<style>.post-metadata {
<style>#toc {
float: right;
margin: 1rem 0 1.5rem 1.5rem;
width: min(calc(100% - 1.5rem), 23rem);
/* 23rem is the width of the words 'table of contents' in my header font */
/* yes, it's a bit hacky */
}
@media (max-width: 850px) {
#toc {
float: unset;
margin-top: 2rem;
margin-left: .5rem;
width: calc(100% - .5rem);
}
}
#toc details {
border: thick solid var(--color-pink);
border-radius: 1rem;
margin-top: 1rem;
}
#toc summary {
position: relative;
top: -1.5rem;
left: -.75rem;
width: fit-content;
background: var(--color-bg);
border-radius: .5rem;
}
#toc summary:focus-visible {
outline: .15rem solid var(--color-teal);
}
#toc summary::marker {
font-size: 2.35rem;
}
#toc h2 {
margin-top: 0;
display: inline;
line-height: normal;
}
#toc nav {
position: relative;
top: -1.25rem;
}
#toc li {
margin-block: .45rem 0;
}
@media (max-width: 650px) {
#toc nav > ol {
margin-left: .5rem;
}
}
/* basically we want to style this `ol` as a `ul` */
#toc ol > li {
list-style: disc;
}
#toc ol > li > ol > li {
list-style: circle;
}
#toc ol > li > ol > li > ol > li {
list-style: square;
}
.post-metadata {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
@@ -438,6 +511,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +571,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1888,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="accessible-image-modals">accessible image modals</h1>
<h1>accessible image modals</h1>
<div class="post-metadata">
<p>
@@ -1843,9 +1917,54 @@ switch (currentThemeValue) {
<img class="hero" src="/img/snacking-seagull.jpg" alt="Image unrelated to post. A seagull floating in the water with a starfish hanging out of eir mouth." loading="lazy" decoding="async" width="1000" height="666">
<p>Recently I've been working on a single-page digital rendition of a zine complete with many hand-drawn images. The author wanted to be able to bring images up to a full-screen view, to either zoom in or to put the whole enlarged image on one screen with no scrolling. It was a real struggle to find resources on how to do this in an accessible manner, so I'm writing up what I did.</p>
<aside id="toc">
<details>
<summary><h2>table of contents</h2></summary>
<nav class="toc">
<ol>
<li><a href="#the-dialog-element">the dialog element</a>
<ol>
<li><a href="#what-does-%3Cdialog%3E-give-us%3F">what does <dialog> give us?</dialog></a>
</li>
<li><a href="#what-doesn't-it-give-us%3F">what doesn't it give us?</a>
</li>
<li><a href="#a-bug">a bug</a>
</li>
</ol>
</li>
<li><a href="#in-addition-to-the-%3Cdialog%3E">in addition to the <dialog></dialog></a>
<ol>
<li><a href="#html">html</a>
</li>
<li><a href="#js">js</a>
</li>
<li><a href="#css">css</a>
</li>
</ol>
</li>
<li><a href="#errors%3F-questions%3F">errors? questions?</a>
</li>
</ol>
</nav>
</details>
</aside>
<p>Recently I've been working on a single-page digital rendition of a zine complete with many hand-drawn images. The author wanted to be able to bring images up to a full-screen view, to either zoom in or to put the whole enlarged image on one screen with no scrolling. It was a real struggle to find resources on how to do this in an accessible manner, so I'm writing up what I did.</p>
<blockquote>
<p>Fair warning: This solution is likely imperfect.</p>
<p>Fair warning: this solution is likely imperfect.</p>
</blockquote>
<h2 id="the-dialog-element">the <code>dialog</code> element</h2>
<p>do you know how many tutorials want you to roll your own modals? It's a not-insignificant amount. W3Schools, top of the search results in many cases, recommends it in two places - <a href="https://www.w3schools.com/howto/howto_css_modal_images.asp" target="_blank" rel="external">image modals</a> and <a href="https://www.w3schools.com/css/css3_images_modal.asp" target="_blank" rel="external">responsive image modals</a>. Several search results for &quot;image modal&quot; pop up div solutions - <a href="https://stackoverflow.com/questions/75598914/how-to-display-an-image-clicking-on-it-using-modal-window-on-html-css-and-js" target="_blank" rel="external">div modal 1</a>, <a href="https://dev.to/salehmubashar/create-an-image-modal-with-javascript-2lf3" target="_blank" rel="external">div modal 2</a>, <a href="https://www.youtube.com/watch?v=Y9TNHynFjaQ" target="_blank" rel="external">div modal 3</a>.</p>
@@ -1853,7 +1972,7 @@ switch (currentThemeValue) {
<p>If you search for <em>accessible</em> image modals, you'll still hear about <code>&lt;div&gt;</code>s. Hell, <a href="https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/examples/dialog/" target="_blank" rel="external">W3C's ARIA Authoring Practices Guide uses a <code>&lt;div&gt;</code></a>. You kinda have to go digging to read about the <a href="https://www.scottohara.me/blog/2023/01/26/use-the-dialog-element.html" target="_blank" rel="external">dialog element from Scott O'Hara</a> or find <a href="https://accessibleweb.dev/modals" target="_blank" rel="external">AccessibleWeb.dev's piece on modals</a>. Or you can go <a href="https://adrianroselli.com/2025/06/where-to-put-focus-when-opening-a-modal-dialog.html" target="_blank" rel="external">straight for Adrian Roselli</a> and find examples that use the native <code>&lt;dialog&gt;</code> element. Thanks Adrian!</p>
<p>Did I roll my own modal at first? Regretfully, yes. I'd used the <code>&lt;dialog&gt;</code> element before... several years ago... in a project I don't have access to anymore... Needless to say, I had forgotten about its existence.</p>
<p>Anyway, I got there. Eventually. So let's talk about modals and <code>&lt;dialog&gt;</code>.</p>
<h3 id="what-does-dialog-give-us">what does <code>&lt;dialog&gt;</code> give us?</h3>
<h3 id="what-does-%3Cdialog%3E-give-us%3F">what does <code>&lt;dialog&gt;</code> give us?</h3>
<p>so, what do we get from the <code>&lt;dialog&gt;</code> element that we don't get from a <code>&lt;div&gt;</code> modal?</p>
<ol>
<li>a semantically meaningful element</li>
@@ -1867,7 +1986,7 @@ switch (currentThemeValue) {
<li>the <code>open</code> attribute which is set on the <code>&lt;dialog&gt;</code> when open and removed when closed (when you use the functions mentioned previously)</li>
</ol>
<p>and more. This is just the pieces in use for me. There's also things like <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dialog#additional_notes" target="_blank" rel="external">setting forms so that submission closes the dialog</a> (point 1 in that list).</p>
<h3 id="what-doesnt-it-give-us">what doesn't it give us?</h3>
<h3 id="what-doesn't-it-give-us%3F">what doesn't it give us?</h3>
<ol>
<li>a close button - gotta roll your own and attach the requisite <code>.close()</code> call (or rely on users hitting escape or clicking the backdrop)</li>
<li>prevention of scroll on the rest of the page</li>
@@ -1881,7 +2000,7 @@ switch (currentThemeValue) {
<p>despite this, I found that in Firefox (but not Edge), the <em><code>&lt;dialog&gt;</code> itself was focusable</em>. I have no idea why, but I tested this on a totally unstyled and unmodified page and still found it to be true. As a focusable element, it made no sense. It had no interactivity and could not be activated.</p>
<p>I'm still torn: do I add <code>tabindex=&quot;-1&quot;</code>? MDN specifically says not to, but I'm pretty sure they're warning against making it <em>focusable</em>. Why warn against making it nonfocusable when <em>it's not supposed to be focusable in the first place</em>, after all?</p>
<p>At current, I'm ambivalent, but I've added <code>tabindex=&quot;-1&quot;</code> to handle Firefox's poor behavior. Making the dialog focusable is unhelpful and confusing.</p>
<h2 id="in-addition-to-the-dialog">in addition to the <code>&lt;dialog&gt;</code></h2>
<h2 id="in-addition-to-the-%3Cdialog%3E">in addition to the <code>&lt;dialog&gt;</code></h2>
<p>here's what else I wrote...</p>
<h3 id="html">html</h3>
<p>besides the <code>&lt;dialog&gt;</code>, I gave my <code>&lt;img&gt;</code> elements <code>tabindex=&quot;0&quot;</code> to make them focusable.</p>
@@ -1901,9 +2020,10 @@ switch (currentThemeValue) {
<li><code>body:has(dialog[open])</code> has <code>overflow: hidden</code> set</li>
<li><code>dialog img</code> uses a <code>max-height</code> as well as <code>object-fit: contain</code></li>
</ul>
<h2 id="errors-questions">errors? questions?</h2>
<h2 id="errors%3F-questions%3F">errors? questions?</h2>
<p>reach out!</p>
</article>
@@ -1941,12 +2061,28 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/azure-locations-and-file-crawling/">
<h2 data-ha-exclude="">azure locations and file crawling </h2>
<ul class="postlist-tags">
<li>software</li>
<li>highlight</li>
</ul>
<img src="/img/azure-locations.jpg" alt="A Linux terminal. There is a fun rainbow flag in ascii art at the top, and then the user has called a command asking Azure for a list of locations applicable to a specific resource type. The output is lengthy." loading="lazy" decoding="async" width="1000" height="827">
</a>
</li>
<li class="post">
<a class="postlink" href="/an-intro-to-git/">
<h2 data-ha-exclude="" id="an-intro-to-git">an intro to git </h2>
<h2 data-ha-exclude="">an intro to git </h2>
<ul class="postlist-tags">
@@ -1960,7 +2096,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/handedness-toggle/">
<h2 data-ha-exclude="" id="handedness-toggle">handedness toggle </h2>
<h2 data-ha-exclude="">handedness toggle </h2>
<ul class="postlist-tags">
@@ -1972,20 +2108,6 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/framer-accessibility/">
<h2 data-ha-exclude="" id="framer-accessibility">framer accessibility </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/framer.png" alt="A screenshot of the Framer projects page showing part of the tile for a very rudimentary project titled Accessibility Test. It has a huge title that just reads Title, a basic form, and some pictures of my dog as notable features." loading="lazy" decoding="async" width="841" height="532">
</a>
</li>
</ol>
</section>
@@ -2038,6 +2160,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/accessible-image-modals/` was built on 2026-09-20T00:40:39.765Z -->
<!-- This page `/accessible-image-modals/` was built on 2026-09-20T22:08:14.588Z -->
</body>
</html>
an-intro-to-git/index.html
+264 -103
View File
@@ -40,7 +40,80 @@
<style>.post-metadata {
<style>#toc {
float: right;
margin: 1rem 0 1.5rem 1.5rem;
width: min(calc(100% - 1.5rem), 23rem);
/* 23rem is the width of the words 'table of contents' in my header font */
/* yes, it's a bit hacky */
}
@media (max-width: 850px) {
#toc {
float: unset;
margin-top: 2rem;
margin-left: .5rem;
width: calc(100% - .5rem);
}
}
#toc details {
border: thick solid var(--color-pink);
border-radius: 1rem;
margin-top: 1rem;
}
#toc summary {
position: relative;
top: -1.5rem;
left: -.75rem;
width: fit-content;
background: var(--color-bg);
border-radius: .5rem;
}
#toc summary:focus-visible {
outline: .15rem solid var(--color-teal);
}
#toc summary::marker {
font-size: 2.35rem;
}
#toc h2 {
margin-top: 0;
display: inline;
line-height: normal;
}
#toc nav {
position: relative;
top: -1.25rem;
}
#toc li {
margin-block: .45rem 0;
}
@media (max-width: 650px) {
#toc nav > ol {
margin-left: .5rem;
}
}
/* basically we want to style this `ol` as a `ul` */
#toc ol > li {
list-style: disc;
}
#toc ol > li > ol > li {
list-style: circle;
}
#toc ol > li > ol > li > ol > li {
list-style: square;
}
.post-metadata {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
@@ -438,6 +511,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +571,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1888,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="an-intro-to-git">an intro to git</h1>
<h1>an intro to git</h1>
<div class="post-metadata">
<p>
@@ -1843,88 +1917,172 @@ switch (currentThemeValue) {
<img class="hero" src="/img/goldeneye-tail.jpg" alt="Image unrelated to post. The tail of a diving duck pokes out from the water with a small splash." loading="lazy" decoding="async" width="1000" height="666">
<p>alrighty, this one's a real doozy. Strap in.</p>
<hr>
<!-- TOC -->
<ul>
<li><a href="#versioning">versioning</a></li>
<li><a href="#problem-statement">problem statement</a></li>
<li><a href="#what-is-git">what is git?</a>
<ul>
<li><a href="#where-can-i-use-git">where can I use git?</a>
<ul>
<li><a href="#what-is-a-cli">what is a CLI?</a></li>
</ul>
</li>
<li><a href="#where-can-i-use-the-git-cli">where can I use the git CLI?</a>
<ul>
<li><a href="#git-for-windows">git for Windows</a></li>
<li><a href="#wsl">WSL</a></li>
<li><a href="#a-few-terminal-operations">a few terminal operations</a></li>
<li><a href="#edit-files">edit files</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#git-version">git version</a>
<ul>
<li><a href="#a-few-handy-settings">a few handy settings</a></li>
</ul>
</li>
<li><a href="#git-going">git going</a>
<ul>
<li><a href="#git-init">git init</a></li>
<li><a href="#git-clone">git clone</a></li>
</ul>
</li>
<li><a href="#git-status">git status</a>
<ul>
<li><a href="#branch-main">branch main</a></li>
<li><a href="#no-commits--nothing-to-commit">no commits / nothing to commit</a></li>
</ul>
</li>
<li><a href="#commits-and-history">commits and history</a>
<ul>
<li><a href="#git-log">git log</a></li>
<li><a href="#creating-a-commit">creating a commit</a></li>
</ul>
</li>
<li><a href="#the-staging-area">the staging area</a>
<ul>
<li><a href="#git-add">git add</a></li>
</ul>
</li>
<li><a href="#git-commit">git commit</a>
<ul>
<li><a href="#checking-our-work">checking our work</a></li>
</ul>
</li>
<li><a href="#changes-to-existing-files">changes to existing files</a>
<ul>
<li><a href="#git-restore">git restore</a></li>
</ul>
</li>
<li><a href="#git-revert">git revert</a></li>
<li><a href="#git-remote">git remote</a>
<ul>
<li><a href="#git-fetch-and-git-pull">git fetch and git pull</a></li>
<li><a href="#git-push-take-one">git push, take one</a></li>
<li><a href="#authentication">authentication</a></li>
<li><a href="#ssh-keys">SSH keys</a>
<ul>
<li><a href="#creation">creation</a></li>
<li><a href="#an-alias">an alias...</a></li>
<li><a href="#and-a-function">and a function</a></li>
<li><a href="#ssh-keys-and-the-remote">SSH keys and the remote</a></li>
</ul>
</li>
<li><a href="#git-push-take-two">git push, take two</a></li>
</ul>
</li>
<li><a href="#summary">summary</a></li>
</ul>
<!-- /TOC -->
<hr>
<aside id="toc">
<details>
<summary><h2>table of contents</h2></summary>
<nav class="toc">
<ol>
<li><a href="#versioning">versioning</a>
</li>
<li><a href="#problem-statement">problem statement</a>
</li>
<li><a href="#what-is-git%3F">what is git?</a>
<ol>
<li><a href="#where-can-i-use-git%3F">where can I use git?</a>
<ol>
<li><a href="#what-is-a-cli%3F">what is a CLI?</a>
</li>
</ol>
</li>
<li><a href="#where-can-i-use-the-git-cli%3F">where can I use the git CLI?</a>
<ol>
<li><a href="#git-for-windows">git for Windows</a>
</li>
<li><a href="#wsl">WSL</a>
</li>
<li><a href="#a-few-terminal-operations">a few terminal operations</a>
</li>
<li><a href="#edit-files">edit files</a>
</li>
</ol>
</li>
</ol>
</li>
<li><a href="#git-version">git version</a>
<ol>
<li><a href="#a-few-handy-settings">a few handy settings</a>
</li>
</ol>
</li>
<li><a href="#git-going">git going</a>
<ol>
<li><a href="#git-init">git init</a>
</li>
<li><a href="#git-clone">git clone</a>
</li>
</ol>
</li>
<li><a href="#git-status">git status</a>
<ol>
<li><a href="#branch-main">branch main</a>
</li>
<li><a href="#no-commits-%2F-nothing-to-commit">no commits / nothing to commit</a>
</li>
</ol>
</li>
<li><a href="#commits-and-history">commits and history</a>
<ol>
<li><a href="#git-log">git log</a>
</li>
<li><a href="#creating-a-commit">creating a commit</a>
</li>
</ol>
</li>
<li><a href="#the-staging-area">the staging area</a>
<ol>
<li><a href="#git-add">git add</a>
</li>
</ol>
</li>
<li><a href="#git-commit">git commit</a>
<ol>
<li><a href="#checking-our-work">checking our work</a>
</li>
</ol>
</li>
<li><a href="#changes-to-existing-files">changes to existing files</a>
<ol>
<li><a href="#git-restore">git restore</a>
</li>
</ol>
</li>
<li><a href="#git-revert">git revert</a>
</li>
<li><a href="#git-remote">git remote</a>
<ol>
<li><a href="#git-fetch-(and-git-pull)">git fetch (and git pull)</a>
</li>
<li><a href="#git-push%2C-take-one">git push, take one</a>
</li>
<li><a href="#authentication">authentication</a>
</li>
<li><a href="#ssh-keys">SSH keys</a>
<ol>
<li><a href="#creation">creation</a>
</li>
<li><a href="#an-alias...">an alias...</a>
</li>
<li><a href="#and-a-function">and a function</a>
</li>
<li><a href="#ssh-keys-and-the-remote">SSH keys and the remote</a>
</li>
</ol>
</li>
<li><a href="#git-push%2C-take-two">git push, take two</a>
</li>
</ol>
</li>
<li><a href="#summary">summary</a>
</li>
</ol>
</nav>
</details>
</aside>
<p>alrighty, this one's a real doozy. Strap in.</p>
<h2 id="versioning">versioning</h2>
<p>have you ever tried to revert to a previous version of a document in MS Office or Google Docs and found that your revision history is cluttered with small changes that by all rights should be grouped into one set of edits, but they aren't, and it's tedious to pick through all the versions?</p>
<p>or, more uniquely and/or uncommonly:</p>
@@ -1939,12 +2097,12 @@ switch (currentThemeValue) {
<p>this walkthrough also focuses on the &quot;happy path,&quot; without much discussion of troubleshooting. I may write more on the topic in the future, but we're already over <em>4,500 words</em>, so we're calling it a day.</p>
<p>finally, I wrote this walkthrough primarily with knowledge from using <strong>WSL</strong> [more on this later] on <strong>Windows</strong> and with <strong>Zed</strong> as my text editor. While I've tried to cover my bases with other OSes and options, there's a solid chance I'm missing things!</p>
<p>that all said, let's get (git?) into it!</p>
<h2 id="what-is-git">what is <code>git</code>?</h2>
<h2 id="what-is-git%3F">what is <code>git</code>?</h2>
<p><code>git</code> is a <em>version control system</em>. We can use it to track changes we make to a set of files.</p>
<blockquote>
<p>tip: it's important to understand that despite the examples of MS Office and Google Docs above, <code>git</code> <em>isn't useful</em> with word documents. <code>git</code> shines with plain text files - .txt, .md, or basically any type of code.</p>
</blockquote>
<h3 id="where-can-i-use-git">where can I use <code>git</code>?</h3>
<h3 id="where-can-i-use-git%3F">where can I use <code>git</code>?</h3>
<p>many, many tools interact with <code>git</code>:</p>
<ul>
<li>a lot of modern text editors have graphical user interfaces (GUIs) that let you perform <code>git</code> operations, like <a href="https://code.visualstudio.com/docs/sourcecontrol/overview" target="_blank" rel="external">VSCode</a>, <a href="https://zed.dev/docs/git" target="_blank" rel="external">Zed</a>, or <a href="https://www.sublimetext.com/docs/git_integration.html" target="_blank" rel="external">Sublime Text</a></li>
@@ -1952,9 +2110,9 @@ switch (currentThemeValue) {
<li>and many <code>git</code> users use the <code>git</code> command line interface (CLI), which is fully text-based</li>
</ul>
<p>today we're going to talk about the <code>git</code> CLI... technically. But <strong>don't let that scare you</strong> - we'll talk about <em>concepts</em> and <em>actions</em> that can be applied to other <code>git</code> interfaces as well.</p>
<h4 id="what-is-a-cli">what is a CLI?</h4>
<h4 id="what-is-a-cli%3F">what is a CLI?</h4>
<p>a CLI a way to interact with your computer and with software in text-only form. Rather than using the mouse and clicking on things, you type in commands and see output.</p>
<h3 id="where-can-i-use-the-git-cli">where can I use the <code>git</code> CLI?</h3>
<h3 id="where-can-i-use-the-git-cli%3F">where can I use the <code>git</code> CLI?</h3>
<p>if you want to use the <code>git</code> CLI, you'll need a terminal. You've got a couple options here:</p>
<ul>
<li>on Linux or Mac, you should have one built in! This is the easy path, congrats :) Even better, <code>git</code> generally ships with these systems, so there's no installation required. Search for an application called 'Terminal' or similar
@@ -2069,7 +2227,7 @@ nothing to commit (create/copy files and use "git add" to track)</code></pre>
<p>let's dissect this.</p>
<h3 id="branch-main">branch main</h3>
<p><code>git</code> has a concept of <strong>branches</strong>, which are different paths our file history has taken. While branches are <em>incredibly</em> powerful, we're going to stay away from branches during this walkthrough and focus on working on a single branch - in this case, <code>main</code>.</p>
<h3 id="no-commits-nothing-to-commit">no commits / nothing to commit</h3>
<h3 id="no-commits-%2F-nothing-to-commit">no commits / nothing to commit</h3>
<p>&quot;no commits&quot; means that the project has no history whatsoever. &quot;Nothing to commit&quot; means we've made no changes. But what is a commit?</p>
<h2 id="commits-and-history">commits and history</h2>
<p>a <strong>commit</strong> is one set of changes made to our work. We get to choose which changes are part of any given commit, and we write a message describing the commit so that future-us knows what we did if for some reason we need to undo something.</p>
@@ -2177,13 +2335,13 @@ Date: Wed Jan 7 15:18:45 2026 -0800
<pre class="language-txt"><code class="language-txt">codeberg https://codeberg.org/inherentlee/git-intro.git (fetch)
codeberg https://codeberg.org/inherentlee/git-intro.git (push)</code></pre>
<p>cool! we have a remote set up. What does &quot;fetch&quot; and &quot;push&quot; mean?</p>
<h3 id="git-fetch-and-git-pull"><code>git fetch</code> (and <code>git pull</code>)</h3>
<h3 id="git-fetch-(and-git-pull)"><code>git fetch</code> (and <code>git pull</code>)</h3>
<p><code>git fetch</code> brings <strong>remote</strong> changes to our local machine. So does a command called <code>git pull</code>. Why are there two?</p>
<p><code>fetch</code> brings the remote changes down, but <em>doesn't combine them yet with our local work</em>. This gives us a chance to explore what those changes are before we actually integrate them into our work!</p>
<p>this may seem unhelpful if we're thinking about this project as something only we work on, but imagine there's a team of people all contributing to the project. What if we <em>and</em> another person both work on the same file? Our changes might overlap!</p>
<p>if we're working alone and <em>from one machine</em>, we'll pretty much never have to use <code>git fetch</code> or <code>git pull</code>! If we happen to do our work on multiple machines - for example, I do some work on my PC and some on my fruitpad (using an app called <a href="https://workingcopy.app/" target="_blank" rel="external">Working Copy</a>) - we'll probably update the remote from one machine, then need to pull that work down onto the other machine.</p>
<p>for our use case, we can pretty safely stick to <code>git pull</code> (if we ever even need to use it!), but if you're working in a larger collaborative project, <code>git fetch</code> is your friend!</p>
<h3 id="git-push-take-one"><code>git push</code>, take one</h3>
<h3 id="git-push%2C-take-one"><code>git push</code>, take one</h3>
<p><code>git push</code> is the opposite of <code>git pull</code> - it takes your local changes and adds them to the remote.</p>
<p>the first time we use it on any given branch, we'll want to set what's called the <strong>upstream</strong> - the remote branch that our local branch is connected to by default. We can do this with the following command:</p>
<pre class="language-sh"><code class="language-sh"><span class="token function">git</span> push --set-upstream codeberg main
@@ -2212,7 +2370,7 @@ codeberg https://codeberg.org/inherentlee/git-intro.git (push)</code></pre>
<p>running <code>ssh-keygen</code> will take us through a series of prompts. Assuming we don't already have an SSH key, the default file location is fine.</p>
<p>when you choose a passphrase, <em>write it down</em>. If you lose it, there is no recourse. You will have to generate a new SSH key.</p>
<p>after generation, we will have two files at the location specified by the tool (or the custom location we chose). Generally, that's the folder <code>.ssh</code> in our home directory. If we navigate to that directory (<code>cd $HOME/.ssh</code>) and look at the files (<code>ls</code>), we'll see files named <code>id_rsa</code> and <code>id_rsa.pub</code>. The one that ends with <code>.pub</code> is the <em>public</em> key.</p>
<h4 id="an-alias">an alias...</h4>
<h4 id="an-alias...">an alias...</h4>
<p>time for a little more terminal knowledge!</p>
<p>I have two handy pieces of tooling in my terminal that I use for SSH operations.</p>
<p>the first one is an <em>alias</em> - basically a simple shortcut for a command. I've written an alias for outputting my public key so that when I need it, I can get it without having to write out the path to the key. Laziness is a virtue, okay?</p>
@@ -2241,7 +2399,7 @@ codeberg https://codeberg.org/inherentlee/git-intro.git (push)</code></pre>
<pre class="language-sh"><code class="language-sh"><span class="token function">git</span> remote set-url codeberg <span class="token operator">&lt;</span>new-url<span class="token operator">></span></code></pre>
<p>we'll notice that the SSH URL starts with <code>git@</code>, whereas the HTTPS URL started with <code>https://</code>.</p>
<p>in order for all this to be useful, we need to tell Codeberg about our SSH key. In Codeberg, navigate to <a href="https://codeberg.org/user/settings/keys" target="_blank" rel="external">settings, then find the left-hand tab for SSH keys</a>. Choose 'Add key' and paste in the <strong>public</strong> key (if you set up that <code>sshcat</code> alias, use it now to output your key for ease of copying). Save and we'll now be set up to authenticate with SSH!</p>
<h3 id="git-push-take-two"><code>git push</code>, take two</h3>
<h3 id="git-push%2C-take-two"><code>git push</code>, take two</h3>
<p>we can now call <code>git push</code> again and again now without having to repeat our credentials every time. We can also call <code>git pull</code> for our private repositories.</p>
<h2 id="summary">summary</h2>
<p>let's talk about what we've done.</p>
@@ -2260,6 +2418,7 @@ codeberg https://codeberg.org/inherentlee/git-intro.git (push)</code></pre>
</ol>
<p>congratulations, and welcome to <code>git</code>!</p>
</article>
@@ -2297,26 +2456,28 @@ codeberg https://codeberg.org/inherentlee/git-intro.git (push)</code></pre>
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/backend-accessibility/">
<h2 data-ha-exclude="" id="backend-accessibility">backend accessibility </h2>
<a class="postlink" href="/designing-a-bag/">
<h2 data-ha-exclude="">designing a bag </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>software</li>
</ul>
<img src="/img/camelCase-print.jpg" alt="A carved stamp next to its print. The print reads &#39;#camelCase&#39; in a slightly formal-looking italic font." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
</a>
</li>
<li class="post">
<a class="postlink" href="/my-favorite-git-flag/">
<h2 data-ha-exclude="" id="my-favorite-git-flag">my favorite git flag </h2>
<h2 data-ha-exclude="">my favorite git flag </h2>
<ul class="postlist-tags">
@@ -2329,15 +2490,15 @@ codeberg https://codeberg.org/inherentlee/git-intro.git (push)</code></pre>
</li>
<li class="post">
<a class="postlink" href="/eleventy-lessons/">
<h2 data-ha-exclude="" id="eleventy-lessons">eleventy lessons </h2>
<a class="postlink" href="/screen-reader-optimizations/">
<h2 data-ha-exclude="">screen reader optimizations </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/hellebore.jpg" alt="Image unrelated to post. Close up on a pale green hellebore flower." loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/crow.jpg" alt="Image unrelated to post. A crow poses on driftwood against a whitish sky." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
@@ -2394,6 +2555,6 @@ codeberg https://codeberg.org/inherentlee/git-intro.git (push)</code></pre>
</footer>
<!-- This page `/an-intro-to-git/` was built on 2026-09-20T00:40:39.763Z -->
<!-- This page `/an-intro-to-git/` was built on 2026-09-20T22:08:14.587Z -->
</body>
</html>
anarchy-autism/index.html
+48 -41
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="anarchy-autism">anarchy autism</h1>
<h1>anarchy autism</h1>
<div class="post-metadata">
<p>
@@ -1904,12 +1905,52 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/foxgloves/">
<h2 data-ha-exclude="" id="foxgloves">foxgloves </h2>
<a class="postlink" href="/queer/">
<h2 data-ha-exclude="">queer </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>sticker</li>
<li>pin</li>
<li>gender</li>
</ul>
<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/pronoun-patches/">
<h2 data-ha-exclude="">pronoun patches </h2>
<ul class="postlist-tags">
<li>print</li>
<li>patch</li>
<li>gender</li>
</ul>
<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
<li class="post">
<a class="postlink" href="/big-pidge/">
<h2 data-ha-exclude="">big pidge </h2>
<ul class="postlist-tags">
@@ -1920,41 +1961,7 @@ switch (currentThemeValue) {
<li>shirt</li>
</ul>
<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/swallowtail-on-snowdrops/">
<h2 data-ha-exclude="" id="swallowtail-on-snowdrops">swallowtail on snowdrops </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>shirt</li>
</ul>
<img src="/img/swallowtail-on-snowdrops-print.jpg" alt="A block print of a tiger swallowtail butterfly dangling from Japanese snowdrops, a white drooping flower." loading="lazy" decoding="async" width="1000" height="1332">
</a>
</li>
<li class="post">
<a class="postlink" href="/artisans-cooperative-shirts/">
<h2 data-ha-exclude="" id="artisans-cooperative-shirts">artisans cooperative shirts </h2>
<ul class="postlist-tags">
<li>shirt</li>
<li>print</li>
</ul>
<img src="/img/artisans-coop-shirt.jpg" alt="A black tank top laid on a desk. In white ink it reads &#39;Artisans Cooperative&#39; with a print of some chickens and a quail." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -2011,6 +2018,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/anarchy-autism/` was built on 2026-09-20T00:40:39.724Z -->
<!-- This page `/anarchy-autism/` was built on 2026-09-20T22:08:14.562Z -->
</body>
</html>
art-shows-and-events/index.html
+7 -5
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="art-shows-and-events">art shows and events</h1>
<h1>art shows and events</h1>
<div class="post-metadata">
<p>
@@ -1837,11 +1838,12 @@ switch (currentThemeValue) {
<p>Listed by recency.</p>
<h2 id="2026">2026</h2>
<ul>
<li><a href="https://beall-greenhouses-market.pages.dev/events/2026-imbolc" target="_blank" rel="external">Imbolc Celebration &amp; Market at Beall Greenhouses</a> (vendor, web marketing)</li>
<li><a href="https://beall-greenhouses.com/events/2027-beltane" target="_blank" rel="external">Beltane Market at Beall Greenhouses</a> (vendor, web marketing)</li>
<li><a href="https://beall-greenhouses.com/events/2026-imbolc" target="_blank" rel="external">Imbolc Celebration &amp; Market at Beall Greenhouses</a> (vendor, web marketing)</li>
</ul>
<h2 id="2025">2025</h2>
<ul>
<li><a href="https://beall-greenhouses-market.pages.dev/events/2025-solstice" target="_blank" rel="external">Solstice Market at Beall Greenhouses</a> (vendor, web and print marketing)</li>
<li><a href="https://beall-greenhouses.com/events/2025-solstice" target="_blank" rel="external">Solstice Market at Beall Greenhouses</a> (vendor, web and print marketing)</li>
<li><a href="https://www.instagram.com/seattle.zine.fest" target="_blank" rel="external">Seattle Zine Fest</a> (vendor)</li>
<li><a href="https://vivartists.com/viva/events/spring-tour-2025/" target="_blank" rel="external">VIVA Spring Tour</a> (vendor)</li>
<li><a href="https://www.seaf.art" target="_blank" rel="external">Seattle Erotic Art Festival</a> (displayed artist)</li>
@@ -1943,6 +1945,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/art-shows-and-events/` was built on 2026-09-20T00:40:39.760Z -->
<!-- This page `/art-shows-and-events/` was built on 2026-09-20T22:08:14.541Z -->
</body>
</html>
artisans-cooperative-cards/index.html
+16 -19
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="artisans-cooperative-cards">artisans cooperative cards</h1>
<h1>artisans cooperative cards</h1>
<div class="post-metadata">
<p>
@@ -1889,12 +1890,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/congrats-on-the-gay/">
<h2 data-ha-exclude="" id="congrats-on-the-gay">congrats on the gay </h2>
<a class="postlink" href="/spotted-towhee/">
<h2 data-ha-exclude="">spotted towhee </h2>
<ul class="postlist-tags">
@@ -1902,44 +1903,40 @@ switch (currentThemeValue) {
<li>card</li>
<li>gender</li>
</ul>
<img src="/img/congrats-on-the-gay.jpg" alt="A greeting card reading, in black. &#39;Congrats on the,&#39; and then, in rainbow, &#39;Gay!&#39;" loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/spotted-towhee-print.jpg" alt="A block print of a spotted towhee mid-leap." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/slightly-weird-man-club/">
<h2 data-ha-exclude="" id="slightly-weird-man-club">slightly weird man club </h2>
<a class="postlink" href="/artisans-cooperative-shirts/">
<h2 data-ha-exclude="">artisans cooperative shirts </h2>
<ul class="postlist-tags">
<li>print</li>
<li>shirt</li>
<li>gender</li>
<li>print</li>
</ul>
<img src="/img/slightly-weird-man-club-print.jpg" alt="A print that reads &#39;slightly weird man club&#39; in a nonbinary flag colored gradient" loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/artisans-coop-shirt.jpg" alt="A black tank top laid on a desk. In white ink it reads &#39;Artisans Cooperative&#39; with a print of some chickens and a quail." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
<li class="post">
<a class="postlink" href="/iris/">
<h2 data-ha-exclude="" id="iris">iris </h2>
<a class="postlink" href="/rope-one/">
<h2 data-ha-exclude="">rope (one) (mature)</h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>gender</li>
</ul>
<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
<img src="/img/rope-print-1.jpg" alt="A print of a nude trans woman in an asymmetrical rope harness." class="blur" loading="lazy" decoding="async" width="1000" height="1242">
</a>
</li>
@@ -1996,6 +1993,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/artisans-cooperative-cards/` was built on 2026-09-20T00:40:39.722Z -->
<!-- This page `/artisans-cooperative-cards/` was built on 2026-09-20T22:08:14.561Z -->
</body>
</html>
artisans-cooperative-shirts/index.html
+34 -13
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="artisans-cooperative-shirts">artisans cooperative shirts</h1>
<h1>artisans cooperative shirts</h1>
<div class="post-metadata">
<p>
@@ -1890,47 +1891,67 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/euphorbia/">
<h2 data-ha-exclude="" id="euphorbia">euphorbia </h2>
<a class="postlink" href="/trans-wrongs-skull/">
<h2 data-ha-exclude="">trans wrongs skull </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>sticker</li>
<li>pin</li>
<li>gender</li>
</ul>
<img src="/img/euphorbia-print.jpg" alt="A print in black ink on brown paper. It depicts a stem of euphorbia, a plant with long, thin leaves and many clustered flowers." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/trans-wrongs-print.jpg" alt="A smiling skull with devil horns and a little spiked tail, and a speech bubble reading &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/become-unbutterable/">
<h2 data-ha-exclude="" id="become-unbutterable">become unbutterable </h2>
<a class="postlink" href="/happy-bihrtday/">
<h2 data-ha-exclude="">happy biHRTday </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>gender</li>
</ul>
<img src="/img/become-unbutterable.jpg" alt="3 copies of the same stamp in orange ink are spread out next to the hand carved rubber stamp they were made from. They show a cat lying on his back with paws curled, holding a butter knife in his mouth. Text around the cat reads, in all caps, &#39;become unbutterable.&#39;" loading="lazy" decoding="async" width="1000" height="562">
<img src="/img/happy-bihrtday-card-print.jpg" alt="A card and print in the same design - a bouncy, cheery font reading &#39;happy biHRTday&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/brown-creeper/">
<h2 data-ha-exclude="" id="brown-creeper">brown creeper </h2>
<a class="postlink" href="/queer/">
<h2 data-ha-exclude="">queer </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>sticker</li>
<li>pin</li>
<li>gender</li>
</ul>
<img src="/img/brown-creeper-print.jpg" alt="2 copies of the same print side by side. In yellow, black, and purple ink, a brown creeper, a small bird, is depicted, well camouflaged against a tree trunk." loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1987,6 +2008,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/artisans-cooperative-shirts/` was built on 2026-09-20T00:40:39.724Z -->
<!-- This page `/artisans-cooperative-shirts/` was built on 2026-09-20T22:08:14.562Z -->
</body>
</html>
artists-conk/index.html
+4 -3
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="artists-conk">artists conk!</h1>
<h1>artists conk!</h1>
<div class="post-metadata">
<p>
@@ -1920,6 +1921,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/artists-conk/` was built on 2026-09-20T00:40:39.727Z -->
<!-- This page `/artists-conk/` was built on 2026-09-20T22:08:14.564Z -->
</body>
</html>
azure-locations-and-file-crawling/index.html
+180 -27
View File
@@ -40,7 +40,80 @@
<style>.post-metadata {
<style>#toc {
float: right;
margin: 1rem 0 1.5rem 1.5rem;
width: min(calc(100% - 1.5rem), 23rem);
/* 23rem is the width of the words 'table of contents' in my header font */
/* yes, it's a bit hacky */
}
@media (max-width: 850px) {
#toc {
float: unset;
margin-top: 2rem;
margin-left: .5rem;
width: calc(100% - .5rem);
}
}
#toc details {
border: thick solid var(--color-pink);
border-radius: 1rem;
margin-top: 1rem;
}
#toc summary {
position: relative;
top: -1.5rem;
left: -.75rem;
width: fit-content;
background: var(--color-bg);
border-radius: .5rem;
}
#toc summary:focus-visible {
outline: .15rem solid var(--color-teal);
}
#toc summary::marker {
font-size: 2.35rem;
}
#toc h2 {
margin-top: 0;
display: inline;
line-height: normal;
}
#toc nav {
position: relative;
top: -1.25rem;
}
#toc li {
margin-block: .45rem 0;
}
@media (max-width: 650px) {
#toc nav > ol {
margin-left: .5rem;
}
}
/* basically we want to style this `ol` as a `ul` */
#toc ol > li {
list-style: disc;
}
#toc ol > li > ol > li {
list-style: circle;
}
#toc ol > li > ol > li > ol > li {
list-style: square;
}
.post-metadata {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
@@ -438,6 +511,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +571,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1888,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="azure-locations-and-file-crawling">azure locations and file crawling</h1>
<h1>azure locations and file crawling</h1>
<div class="post-metadata">
<p>
@@ -1848,7 +1922,85 @@ switch (currentThemeValue) {
<img class="hero" src="/img/azure-locations.jpg" alt="A Linux terminal. There is a fun rainbow flag in ascii art at the top, and then the user has called a command asking Azure for a list of locations applicable to a specific resource type. The output is lengthy." loading="lazy" decoding="async" width="1000" height="827">
<h2 id="context">context</h2>
<aside id="toc">
<details>
<summary><h2>table of contents</h2></summary>
<nav class="toc">
<ol>
<li><a href="#context">context</a>
<ol>
<li><a href="#bicep">bicep</a>
<ol>
<li><a href="#nesting">nesting</a>
</li>
</ol>
</li>
</ol>
</li>
<li><a href="#finding-all-resources">finding all resources</a>
<ol>
<li><a href="#grep">grep</a>
</li>
<li><a href="#cut">cut</a>
</li>
<li><a href="#mapfile">mapfile</a>
</li>
<li><a href="#dirname-(%26-more)">dirname (& more)</a>
</li>
<li><a href="#the-get_resources-function">the get_resources function</a>
</li>
</ol>
</li>
<li><a href="#finding-locations">finding locations</a>
<ol>
<li><a href="#sort">sort</a>
</li>
<li><a href="#az">az</a>
</li>
<li><a href="#cut-(again)">cut (again)</a>
</li>
<li><a href="#comm">comm</a>
</li>
<li><a href="#catching-errors">catching errors</a>
</li>
<li><a href="#tee">tee</a>
</li>
<li><a href="#the-location-code">the location code</a>
</li>
</ol>
</li>
<li><a href="#summary">summary</a>
</li>
</ol>
</nav>
</details>
</aside>
<h2 id="context">context</h2>
<p>Azure is Microsoft's cloud offering. Each possible resource that can be deployed in Azure has a location it's deployed in, such as &quot;East US&quot; or &quot;Italy.&quot; While some resources can be deployed in all locations, other resources have location constraints.</p>
<p>It's common, when deploying, to have a whole ecosystem of resources that will work together. However, this introduces a problem: which locations work for all resources in a deployment?</p>
<p>Let's dig in. (Want just the outcome? Check the <a href="#summary">summary</a>.)</p>
@@ -1923,7 +2075,7 @@ switch (currentThemeValue) {
<span class="token operator">|</span> <span class="token function">cut</span> <span class="token parameter variable">-d</span> <span class="token string">"@"</span> <span class="token parameter variable">-f</span> <span class="token number">1</span> -<span class="token punctuation">)</span>
<span class="token builtin class-name">mapfile</span> <span class="token parameter variable">-t</span> modules <span class="token operator">&lt;</span> <span class="token operator">&lt;</span><span class="token punctuation">(</span><span class="token function">grep</span> <span class="token parameter variable">-E</span> <span class="token string">"^module "</span> <span class="token string">"<span class="token variable">$file</span>"</span> <span class="token punctuation">\</span>
<span class="token operator">|</span> <span class="token function">cut</span> <span class="token parameter variable">-d</span> <span class="token string">"'"</span> <span class="token parameter variable">-f</span> <span class="token number">2</span> -<span class="token punctuation">)</span></code></pre>
<h3 id="dirname-and-more"><code>dirname</code> (&amp; more)</h3>
<h3 id="dirname-(%26-more)"><code>dirname</code> (&amp; more)</h3>
<p>We can't just stop there. We need to search each module in turn. Using <code>dirname</code>, we can get the directory of the file we're searching, then append the relative module path.</p>
<pre class="language-sh"><code class="language-sh"><span class="token function-name function">get_resources</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token comment"># ... grep, cut, etc ...</span>
@@ -1938,7 +2090,7 @@ switch (currentThemeValue) {
<p>A lot just happened there besides <code>dirname</code>. <code>{modules[@]}</code> is all the array elements (as opposed to just <code>$modules</code>, which evaluates to the first element). <code>${#modules[@]}</code>, on the other hand - note the pound sign - is the number of elements in the array.</p>
<p>Additionally, <code>mapfile</code> usually writes from index 0 onwards. But with the <code>-O</code> argument, we can specify an <strong>origin</strong>. By setting the starting point to the length of the array, we append to the array rather than writing over existing data.</p>
<p>Finally, we got some recursion going! <code>get_resources</code> calls <code>get_resources</code> for every module found.</p>
<h3 id="the-get-resources-function">the <code>get_resources</code> function</h3>
<h3 id="the-get_resources-function">the <code>get_resources</code> function</h3>
<p>So far, our code looks like this:</p>
<pre class="language-sh"><code class="language-sh"><span class="token function-name function">get_resources</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token builtin class-name">mapfile</span> <span class="token parameter variable">-t</span> resources <span class="token operator">&lt;</span> <span class="token operator">&lt;</span><span class="token punctuation">(</span><span class="token function">grep</span> <span class="token parameter variable">-E</span> <span class="token string">"^resource "</span> <span class="token string">"<span class="token variable">$file</span>"</span> <span class="token punctuation">\</span>
@@ -1973,7 +2125,7 @@ switch (currentThemeValue) {
<span class="token parameter variable">--query</span> <span class="token string">"resourceTypes[?resourceType=='<span class="token variable">$resourceType</span>'].locations | [0]"</span> <span class="token punctuation">\</span>
<span class="token parameter variable">--out</span> tsv<span class="token punctuation">)</span></code></pre>
<p><code>--out tsv</code> means we will get a list with no decoration whatsoever - it's vital for programmatic handling of <code>az</code> command output.</p>
<h3 id="cut-again"><code>cut</code> (again)</h3>
<h3 id="cut-(again)"><code>cut</code> (again)</h3>
<p>We'll need to get those <code>$namespace</code> and <code>$resourceType</code> variables. <code>cut</code> comes back in handy:</p>
<pre class="language-sh"><code class="language-sh"><span class="token comment"># remember, $resource is something like Microsoft.Resources/resourceGroups</span>
@@ -2076,6 +2228,7 @@ switch (currentThemeValue) {
<span class="token keyword">for</span> <span class="token for-or-select variable">location</span> <span class="token keyword">in</span> <span class="token string">"<span class="token variable">${locations<span class="token punctuation">[</span>@<span class="token punctuation">]</span>}</span>"</span><span class="token punctuation">;</span> <span class="token keyword">do</span> <span class="token builtin class-name">echo</span> <span class="token string">"<span class="token variable">$location</span>"</span><span class="token punctuation">;</span> <span class="token keyword">done</span> <span class="token operator">|</span> <span class="token function">tee</span> locations.txt</code></pre>
</article>
@@ -2113,12 +2266,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/framer-accessibility/">
<h2 data-ha-exclude="" id="framer-accessibility">framer accessibility </h2>
<h2 data-ha-exclude="">framer accessibility </h2>
<ul class="postlist-tags">
@@ -2131,29 +2284,29 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/happy-solstice-2025/">
<h2 data-ha-exclude="" id="happy-solstice-2025">happy solstice 2025 </h2>
<ul class="postlist-tags">
<li>highlight</li>
</ul>
<img src="/img/solstice-2025.jpg" alt="front and back of our solstice card from this year, designed in postcard format. long alt incoming... front - 4 picture collage. 1 - i&#39;m standing in the woods, looking to one side, wearing an elaborate knit scarf. 2 - silhouetted thistle-like flowers in front of a pink-purple sky. 3 - my wife brooke crouches down to draw a heart in charcoal on a beach log, with &#39;L + B&#39; written inside. 4 - brooke stands on a driftwood-covered beach looking hella cool in mirrored shades. our dog kes stands in front of her and looks off to one side eagerly. overlaid is the words &#39;happy solstice&#39; in cursive. back - split down the center like the back of a postcard. on the left side, a 5 picture collage. 1 - i stand on a rock at the edge of a calm alpine lake. overlaid is the words &#39;lee, brooke, kestrel, &amp; the flock&#39; in print lettering. 2 - an early spring fern curl. 3 - our six ducks, all facing to the left, not in a row but still very organized. 4 - brooke grins at the camera while hugging kestrel&#39;s head. kestrel looks maybe a bit distraught. 5 - silhouette of a heron in flight across an early morning blue sky. on the address side, i&#39;ve added a dahlia to represent the stamp, and written &#39;you!&#39; in the field that would normally hold the mailing address." loading="lazy" decoding="async" width="1000" height="1346">
</a>
</li>
<li class="post">
<a class="postlink" href="/eleventy-lessons/">
<h2 data-ha-exclude="" id="eleventy-lessons">eleventy lessons </h2>
<a class="postlink" href="/comparing-text-editors/">
<h2 data-ha-exclude="">comparing text editors </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/hellebore.jpg" alt="Image unrelated to post. Close up on a pale green hellebore flower." loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/horsetail.jpg" alt="Image unrelated to post. Close up on a horsetail plant&#39;s stem, with many small needle-like leaves emerging from all sides of the circular stem at each segmented joint." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/an-intro-to-git/">
<h2 data-ha-exclude="">an intro to git </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/goldeneye-tail.jpg" alt="Image unrelated to post. The tail of a diving duck pokes out from the water with a small splash." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
@@ -2210,6 +2363,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/azure-locations-and-file-crawling/` was built on 2026-09-20T00:40:39.760Z -->
<!-- This page `/azure-locations-and-file-crawling/` was built on 2026-09-20T22:08:14.586Z -->
</body>
</html>
backend-accessibility/index.html
+137 -16
View File
@@ -40,7 +40,80 @@
<style>.post-metadata {
<style>#toc {
float: right;
margin: 1rem 0 1.5rem 1.5rem;
width: min(calc(100% - 1.5rem), 23rem);
/* 23rem is the width of the words 'table of contents' in my header font */
/* yes, it's a bit hacky */
}
@media (max-width: 850px) {
#toc {
float: unset;
margin-top: 2rem;
margin-left: .5rem;
width: calc(100% - .5rem);
}
}
#toc details {
border: thick solid var(--color-pink);
border-radius: 1rem;
margin-top: 1rem;
}
#toc summary {
position: relative;
top: -1.5rem;
left: -.75rem;
width: fit-content;
background: var(--color-bg);
border-radius: .5rem;
}
#toc summary:focus-visible {
outline: .15rem solid var(--color-teal);
}
#toc summary::marker {
font-size: 2.35rem;
}
#toc h2 {
margin-top: 0;
display: inline;
line-height: normal;
}
#toc nav {
position: relative;
top: -1.25rem;
}
#toc li {
margin-block: .45rem 0;
}
@media (max-width: 650px) {
#toc nav > ol {
margin-left: .5rem;
}
}
/* basically we want to style this `ol` as a `ul` */
#toc ol > li {
list-style: disc;
}
#toc ol > li > ol > li {
list-style: circle;
}
#toc ol > li > ol > li > ol > li {
list-style: square;
}
.post-metadata {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
@@ -438,6 +511,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +571,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1888,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="backend-accessibility">backend accessibility</h1>
<h1>backend accessibility</h1>
<div class="post-metadata">
<p>
@@ -1843,16 +1917,62 @@ switch (currentThemeValue) {
<img class="hero" src="/img/camelCase-print.jpg" alt="A carved stamp next to its print. The print reads &#39;#camelCase&#39; in a slightly formal-looking italic font." loading="lazy" decoding="async" width="1000" height="750">
<blockquote>
<aside id="toc">
<details>
<summary><h2>table of contents</h2></summary>
<nav class="toc">
<ol>
<li><a href="#documentation">Documentation</a>
</li>
<li><a href="#rely-on-standards">Rely on standards</a>
</li>
<li><a href="#user-stories">User stories</a>
<ol>
<li><a href="#i-want-to-understand-new-terms-as-they're-introduced">I want to understand new terms as they're introduced</a>
</li>
<li><a href="#i-want-to-quickly-scan-a-page-for-the-information-i-need">I want to quickly scan a page for the information I need</a>
</li>
<li><a href="#i-want-to-be-aware-of-and-able-to-understand-all-content-on-the-page">I want to be aware of and able to understand all content on the page</a>
</li>
</ol>
</li>
<li><a href="#todo-notes">todo notes</a>
</li>
<li><a href="#references">References</a>
<ol>
<li><a href="#alt-text%2Fimage-descriptions">Alt text/image descriptions</a>
</li>
<li><a href="#other-specific-topics">Other specific topics</a>
</li>
</ol>
</li>
</ol>
</nav>
</details>
</aside>
<p>These notes are from a talk I gave at work. If you think something is missing or incorrect, please let me know!</p>
</blockquote>
<p>Backend developers still have users: other developers. We're all human, with human limitations and differences. Design for those limitations and you'll find you improve the end result for everyone.</p>
<h2 id="documentation">Documentation</h2>
<p>The first thing you can do: document. By this I don't just mean standalone text documentation; I also include code comments, clear variable and file naming, and pipeline or script outputs that report success or failure <em>and give details</em>.</p>
<h2 id="rely-on-standards">Rely on standards</h2>
<p>Rely on existing standards where possible. Style guides, spell checkers, linters, and formatters are all great. Make standards easy to follow with linter, editor, etc. config files in your repo, or add a devcontainer so others can easily get started with the project. When there's no standard, create one; for example, set up github issue and PR templates. And whenever you can, automate tests <em>and fixes</em>.</p>
<h2 id="user-stories">User stories</h2>
<h3 id="i-want-to-understand-new-terms-as-they-re-introduced">I want to understand new terms as they're introduced</h3>
<h3 id="i-want-to-understand-new-terms-as-they're-introduced">I want to understand new terms as they're introduced</h3>
<ul>
<li>Abbreviations/initialisms: can stall anyone unfamiliar with them. Spell them out when they're first introduced, and add the abbreviation in parentheses.</li>
<li>Jargon: avoid it as much as possible. Keep a friendly tone.</li>
@@ -1890,7 +2010,7 @@ switch (currentThemeValue) {
<li><a href="https://marconius.com/a11yLinks/" target="_blank" rel="external">Collected accessibility resources — Marco Salsiccia</a></li>
<li><a href="https://a11y.coffee/start-testing/" target="_blank" rel="external">A11y coffee</a> [note: spell out 'accessibility' rather than shortening to 'a11y'!]</li>
</ul>
<h3 id="alt-text-image-descriptions">Alt text/image descriptions</h3>
<h3 id="alt-text%2Fimage-descriptions">Alt text/image descriptions</h3>
<ul>
<li><a href="https://uxdesign.cc/how-to-write-an-image-description-2f30d3bf5546" target="_blank" rel="external">How to write an image description</a></li>
<li><a href="https://www.perkins.org/resource/how-write-alt-text-and-image-descriptions-visually-impaired/" target="_blank" rel="external">How to write alt text and image descriptions for the visually impaired — Perkins School for the Blind</a></li>
@@ -1906,6 +2026,7 @@ switch (currentThemeValue) {
<li><a href="https://chartability.fizz.studio" target="_blank" rel="external">Chartability</a> (data visualization)</li>
</ul>
</article>
@@ -1943,26 +2064,26 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/comparing-text-editors/">
<h2 data-ha-exclude="" id="comparing-text-editors">comparing text editors </h2>
<a class="postlink" href="/an-intro-to-git/">
<h2 data-ha-exclude="">an intro to git </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/horsetail.jpg" alt="Image unrelated to post. Close up on a horsetail plant&#39;s stem, with many small needle-like leaves emerging from all sides of the circular stem at each segmented joint." loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/goldeneye-tail.jpg" alt="Image unrelated to post. The tail of a diving duck pokes out from the water with a small splash." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/eleventy-lessons/">
<h2 data-ha-exclude="" id="eleventy-lessons">eleventy lessons </h2>
<h2 data-ha-exclude="">eleventy lessons </h2>
<ul class="postlist-tags">
@@ -1975,15 +2096,15 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/intro-to-wireframing/">
<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
<a class="postlink" href="/domain-and-site-setup/">
<h2 data-ha-exclude="">domain and site setup </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
<img src="/img/crinkly-mushrooms.jpg" alt="Picture unrelated to post. Some crinkly brown-orange mushrooms in vibrant green grass." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -2040,6 +2161,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/backend-accessibility/` was built on 2026-09-20T00:40:39.715Z -->
<!-- This page `/backend-accessibility/` was built on 2026-09-20T22:08:14.587Z -->
</body>
</html>
bag-strap/index.html
+16 -13
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="bag-strap">bag strap</h1>
<h1>bag strap</h1>
<div class="post-metadata">
<p>
@@ -1882,47 +1883,49 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/rachels-bracelets/">
<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
<a class="postlink" href="/leaf-patches/">
<h2 data-ha-exclude="">leaf patches </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/rachel-bracelets.jpg" alt="Two pink leather bracelets with stainless steel hardware and aqua stitching." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/leaf-patches-oak.jpg" alt="Several oak-leaf-shaped leather patches with stitching holes punched around the edges." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/gradient-purse-strap/">
<h2 data-ha-exclude="" id="gradient-purse-strap">gradient purse strap </h2>
<a class="postlink" href="/pinatex-wallet-with-zipper/">
<h2 data-ha-exclude="">piñatex wallet with zipper </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/gradient-purse-strap.jpg" alt="a coiled up purse strap in gradient cool colors - we can see green, teal, indigo, and a slightly pinkish purple. It has brass hardware and is stiched along its length with cream stitches." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/pinatex-ten-pocket-bifold.jpg" alt="A two-picture collage showing the inside and outside of a wallet made with piñatex, a leather alternative made from pineapple leaves. It is two tone blue with a pink accent and has a zippered pocket built in." loading="lazy" decoding="async" width="1000" height="1331">
</a>
</li>
<li class="post">
<a class="postlink" href="/eight-pocket-bifold/">
<h2 data-ha-exclude="" id="eight-pocket-bifold">eight pocket bifold </h2>
<a class="postlink" href="/patchwork-wallet/">
<h2 data-ha-exclude="">patchwork wallet </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>highlight</li>
</ul>
<img src="/img/eight-pocket-bifold.jpg" alt="A 3-picture collage showing a hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a asymmetrical interior with a hidden pocket and 3 card pockets on the right, and a hidden pocket and 2 card pockets on the left. The left front pocket has a small naturally occuring hole." loading="lazy" decoding="async" width="1000" height="1777">
<img src="/img/patchwork-wallet.jpg" alt="A collage showing a wallet in a patchwork style, with different colors of leather all stitched together to make up the exterior and the top interior pockets. Other pockets inside are dyed various colors." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
@@ -1979,6 +1982,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/bag-strap/` was built on 2026-09-20T00:40:39.727Z -->
<!-- This page `/bag-strap/` was built on 2026-09-20T22:08:14.564Z -->
</body>
</html>
baseball-journal/index.html
+17 -14
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="baseball-journal">baseball journal</h1>
<h1>baseball journal</h1>
<div class="post-metadata">
<p>
@@ -1892,49 +1893,51 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/flocked-notebook/">
<h2 data-ha-exclude="" id="flocked-notebook">flocked notebook </h2>
<a class="postlink" href="/leather-long-stitch-journals/">
<h2 data-ha-exclude="">leather long-stitch journals </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>book</li>
</ul>
<img src="/img/flocked-notebook.jpg" alt="A two panel collage showing the cover and endpapers of a thick notebook." loading="lazy" decoding="async" width="1000" height="1331">
<img src="/img/long-stitch-journals.jpg" alt="A stack of hand-bound journals showing long stitches aligned with the spines. They are leather bound and have tie closures." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
<li class="post">
<a class="postlink" href="/brookes-notebook/">
<h2 data-ha-exclude="" id="brookes-notebook">brooke&#39;s notebook </h2>
<a class="postlink" href="/black-and-red-journal/">
<h2 data-ha-exclude="">black and red journal </h2>
<ul class="postlist-tags">
<li>book</li>
<li>highlight</li>
<li>leather</li>
</ul>
<img src="/img/brooke-notebook.jpg" alt="A six panel collage showing the covers, endpapers, and some of the pages of a notebook." loading="lazy" decoding="async" width="1000" height="1500">
<img src="/img/black-red-journal.jpg" alt="3 image collage showing a leather-bound journal. The cover is black, with long red vertical stitches along the spine and a red leather strap for a closure. On the back in one lower corner is stamped LEE CAT ART" loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/square-watercolor-pad/">
<h2 data-ha-exclude="" id="square-watercolor-pad">square watercolor pad </h2>
<a class="postlink" href="/acadia-coloring-journal/">
<h2 data-ha-exclude="">Acadia coloring journal </h2>
<ul class="postlist-tags">
<li>book</li>
</ul>
<img src="/img/square-watercolor-pad.jpg" alt="A two panel collage showing a square book with a tan cover and blue and gold endpapers." loading="lazy" decoding="async" width="1000" height="1331">
<img src="/img/acadia-coloring-journal.jpg" alt="A five panel collage showcasing a book that is part graph papers of various sizes, and part coloring pages based on Acadia National Park." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
@@ -1991,6 +1994,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/baseball-journal/` was built on 2026-09-20T00:40:39.721Z -->
<!-- This page `/baseball-journal/` was built on 2026-09-20T22:08:14.558Z -->
</body>
</html>
become-unbutterable/index.html
+22 -15
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="become-unbutterable">become unbutterable</h1>
<h1>become unbutterable</h1>
<div class="post-metadata">
<p>
@@ -1889,26 +1890,32 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/crow/">
<h2 data-ha-exclude="" id="crow">crow </h2>
<a class="postlink" href="/anarchy-autism/">
<h2 data-ha-exclude="">anarchy autism </h2>
<ul class="postlist-tags">
<li>print</li>
<li>sticker</li>
<li>shirt</li>
<li>pin</li>
</ul>
<img src="/img/crow-print.jpg" alt="a block print in dark indigo ink on white paper depicting a perched crow looking over one shoulder. one side of the crow is lit with fine feather detail, and the other side is almost entirely in shadow." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/anarchy-autism-rainbow-print.jpg" alt="A print in rainbow ink that says autism with the anarchy A." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/coming-out/">
<h2 data-ha-exclude="" id="coming-out">coming out </h2>
<a class="postlink" href="/spotted-towhee/">
<h2 data-ha-exclude="">spotted towhee </h2>
<ul class="postlist-tags">
@@ -1916,24 +1923,24 @@ switch (currentThemeValue) {
<li>card</li>
<li>gender</li>
</ul>
<img src="/img/coming-out-card-print.jpg" alt="A card and print in the same design - a chick and a broken eggshell, and a simple font reading &#39;congrats on coming out of your shell&#39;" loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/spotted-towhee-print.jpg" alt="A block print of a spotted towhee mid-leap." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/loon/">
<h2 data-ha-exclude="" id="loon">loon </h2>
<a class="postlink" href="/not-a-drill/">
<h2 data-ha-exclude="">not a drill </h2>
<ul class="postlist-tags">
<li>print</li>
<li>shirt</li>
</ul>
<img src="/img/loon-print.jpg" alt="A print of a loon rearing up with wings spread" loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/not-a-drill-print.jpg" alt="A print in dark teal ink depicting a power drill with text in cursive below that reads &#39;ceci n&#39;est pas un exercice&#39; or &#39;this is not a drill&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1990,6 +1997,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/become-unbutterable/` was built on 2026-09-20T00:40:39.710Z -->
<!-- This page `/become-unbutterable/` was built on 2026-09-20T22:08:14.532Z -->
</body>
</html>
bfl-silk-handspun/index.html
+23 -22
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="bfl-silk-handspun">BFL/silk handspun</h1>
<h1>BFL/silk handspun</h1>
<div class="post-metadata">
<p>
@@ -1882,26 +1883,40 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/petrichor-handspun/">
<h2 data-ha-exclude="" id="petrichor-handspun">petrichor handspun </h2>
<a class="postlink" href="/spinners-dream-handspun/">
<h2 data-ha-exclude="">spinner&#39;s dream handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/petrichor-handspun.jpg" alt="3 skeins of handspun yarn, 2 large and 1 small. the large ones are a rich earth-tone blend of reds, pinks, browns, and hints of green and gold. the smaller skein is similar but with a decidedly greener hue" loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/spinners-dream-handspun.jpg" alt="a skein of a lightly variegated grey yarn in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/orion-handspun/">
<h2 data-ha-exclude="">orion handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/orion-handspun.jpg" alt="3 skeins of handspun yarn, 1 large and 2 small. One of the small skeins is a little more inconsistent weight than the other two - this one was spun on drop spindle about 2 years ago. The other two are about a sport or maybe a DK weight. All three are a gold colorway with tiny hints of orange and a pale light green." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
<h2 data-ha-exclude="">handspun yarn in party mix and orange-gold </h2>
<ul class="postlist-tags">
@@ -1913,20 +1928,6 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/fire-and-ice-handspun/">
<h2 data-ha-exclude="" id="fire-and-ice-handspun">fire &amp; ice handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/fire-ice-handspun.jpg" alt="2 skeins, one large and one small, of a heathered orange yarn with hints of blue in about a DK or worsted weight." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
</ol>
</section>
@@ -1979,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/bfl-silk-handspun/` was built on 2026-09-20T00:40:39.764Z -->
<!-- This page `/bfl-silk-handspun/` was built on 2026-09-20T22:08:14.567Z -->
</body>
</html>
big-pidge/index.html
+39 -24
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="big-pidge">big pidge</h1>
<h1>big pidge</h1>
<div class="post-metadata">
<p>
@@ -1899,12 +1900,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/congrats-on-the-autism-adhd/">
<h2 data-ha-exclude="" id="congrats-on-the-autism-adhd">congrats on the autism/adhd </h2>
<a class="postlink" href="/trans-wrongs-skull/">
<h2 data-ha-exclude="">trans wrongs skull </h2>
<ul class="postlist-tags">
@@ -1912,15 +1913,43 @@ switch (currentThemeValue) {
<li>card</li>
<li>sticker</li>
<li>pin</li>
<li>gender</li>
</ul>
<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
<img src="/img/trans-wrongs-print.jpg" alt="A smiling skull with devil horns and a little spiked tail, and a speech bubble reading &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/stellars-jay/">
<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
<a class="postlink" href="/trans-rights-skull/">
<h2 data-ha-exclude="">trans rights skull </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>sticker</li>
<li>pin</li>
<li>gender</li>
</ul>
<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/foxgloves/">
<h2 data-ha-exclude="">foxgloves </h2>
<ul class="postlist-tags">
@@ -1931,21 +1960,7 @@ switch (currentThemeValue) {
<li>shirt</li>
</ul>
<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/block-printing-transfer-method/">
<h2 data-ha-exclude="" id="block-printing-transfer-method">block printing transfer method </h2>
<ul class="postlist-tags">
<li>print</li>
</ul>
<img src="/img/transfer-wip.jpg" alt="A pink block of carving material with a printed design of a bird attached to it. The paper has been partially rubbed away (process described in this post) to reveal the inked design on the carving material." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -2002,6 +2017,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/big-pidge/` was built on 2026-09-20T00:40:39.715Z -->
<!-- This page `/big-pidge/` was built on 2026-09-20T22:08:14.557Z -->
</body>
</html>
black-and-red-journal/index.html
+14 -13
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="black-and-red-journal">black and red journal</h1>
<h1>black and red journal</h1>
<div class="post-metadata">
<p>
@@ -1886,47 +1887,47 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/soras-collar/">
<h2 data-ha-exclude="" id="soras-collar">sora&#39;s collar </h2>
<a class="postlink" href="/stephanie-collar/">
<h2 data-ha-exclude="">stephanie collar </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/sora-collar.jpg" alt="A collage showing a red and black leather dog collar tooled with roses and the name Sora. It&#39;s fully stitched with dark red stitching and has brass hardware." loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/stephanie-collar.jpg" alt="A white woman with a shaved side cut wearing a black leather collar with a large dangling o-ring." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
<li class="post">
<a class="postlink" href="/vix-collar/">
<h2 data-ha-exclude="" id="vix-collar">vix collar </h2>
<a class="postlink" href="/x-acto-knife-sheath/">
<h2 data-ha-exclude="">x-acto knife sheath </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/vix-collar.jpg" alt="A collar rests on a leather-wrapped lighter. It is lined with shearling and built of two other layers of leather - a wider mustard yellow layer and a thinner teal layer over that. the teal layer holds a heart shaped o-ring in place." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/knife-sheaths.jpg" alt="Several blades with leather sheaths, and a few extra sheaths. There&#39;s a #2 blade with an orange sheath with yellow stitching, a #11 blade with a blue sheath with light grey stitching, and a skiving knife with a plum sheath and pink stitching." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/lobstah/">
<h2 data-ha-exclude="" id="lobstah">lobstah </h2>
<a class="postlink" href="/vertical-zipper-card-wallet/">
<h2 data-ha-exclude="">vertical zipper card wallet </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/vertical-zipper-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets, a hidden pocket, and a zippered coin pouch." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
@@ -1983,6 +1984,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/black-and-red-journal/` was built on 2026-09-20T00:40:39.766Z -->
<!-- This page `/black-and-red-journal/` was built on 2026-09-20T22:08:14.569Z -->
</body>
</html>
block-printing-transfer-method/index.html
+19 -14
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="block-printing-transfer-method">block printing transfer method</h1>
<h1>block printing transfer method</h1>
<div class="post-metadata">
<p>
@@ -1922,12 +1923,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/heron/">
<h2 data-ha-exclude="" id="heron">heron </h2>
<a class="postlink" href="/coming-out/">
<h2 data-ha-exclude="">coming out </h2>
<ul class="postlist-tags">
@@ -1935,17 +1936,17 @@ switch (currentThemeValue) {
<li>card</li>
<li>shirt</li>
<li>gender</li>
</ul>
<img src="/img/heron-print.jpg" alt="A print in black ink of a great blue heron, leaning downwards so that eir beak is level with eir feet." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/coming-out-card-print.jpg" alt="A card and print in the same design - a chick and a broken eggshell, and a simple font reading &#39;congrats on coming out of your shell&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/iris/">
<h2 data-ha-exclude="" id="iris">iris </h2>
<a class="postlink" href="/chanterelle/">
<h2 data-ha-exclude="">chanterelle </h2>
<ul class="postlist-tags">
@@ -1954,21 +1955,25 @@ switch (currentThemeValue) {
<li>card</li>
</ul>
<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
<img src="/img/chanterelle-print.jpg" alt="A print of two chanterelle mushrooms inked in a dark-to-light yellow gradient." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
<li class="post">
<a class="postlink" href="/fix-your-hearts/">
<h2 data-ha-exclude="" id="fix-your-hearts">fix your hearts </h2>
<a class="postlink" href="/greeting-loons/">
<h2 data-ha-exclude="">greeting loons </h2>
<ul class="postlist-tags">
<li>card</li>
<li>print</li>
<li>highlight</li>
</ul>
<img src="/img/fix-your-hearts-print.jpg" alt="2 copies of the same print, one in black ink and one in dark teal. The print is text that reads &#39;fix your hearts or die&#39;, with the text shaped into a somewhat long and narrow heart." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -2025,6 +2030,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/block-printing-transfer-method/` was built on 2026-09-20T00:40:39.714Z -->
<!-- This page `/block-printing-transfer-method/` was built on 2026-09-20T22:08:14.556Z -->
</body>
</html>
blue-and-brown-leather-journal/index.html
+12 -13
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="blue-and-brown-leather-journal">blue and brown leather journal</h1>
<h1>blue and brown leather journal</h1>
<div class="post-metadata">
<p>
@@ -1898,26 +1899,26 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/leather-strap-journal/">
<h2 data-ha-exclude="" id="leather-strap-journal">leather strap journal </h2>
<a class="postlink" href="/baseball-journal/">
<h2 data-ha-exclude="">baseball journal </h2>
<ul class="postlist-tags">
<li>book</li>
</ul>
<img src="/img/leather-strap-journal.jpg" alt="A 3-part collage showing a blue journal with leather straps woven into the covers." loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/baseball-journal.jpg" alt="A 3-part collage of a leather-covered book with baseball-style stitching across the spine." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/stampede-journal/">
<h2 data-ha-exclude="" id="stampede-journal">stampede journal </h2>
<h2 data-ha-exclude="">stampede journal </h2>
<ul class="postlist-tags">
@@ -1930,17 +1931,15 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/leather-long-stitch-journals/">
<h2 data-ha-exclude="" id="leather-long-stitch-journals">leather long-stitch journals </h2>
<a class="postlink" href="/square-watercolor-pad/">
<h2 data-ha-exclude="">square watercolor pad </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>book</li>
</ul>
<img src="/img/long-stitch-journals.jpg" alt="A stack of hand-bound journals showing long stitches aligned with the spines. They are leather bound and have tie closures." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/square-watercolor-pad.jpg" alt="A two panel collage showing a square book with a tan cover and blue and gold endpapers." loading="lazy" decoding="async" width="1000" height="1331">
</a>
</li>
@@ -1997,6 +1996,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/blue-and-brown-leather-journal/` was built on 2026-09-20T00:40:39.710Z -->
<!-- This page `/blue-and-brown-leather-journal/` was built on 2026-09-20T22:08:14.533Z -->
</body>
</html>
booby-congrats-on-the-top-surgery/index.html
+29 -26
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="booby-congrats-on-the-top-surgery">booby (congrats on the top surgery)</h1>
<h1>booby (congrats on the top surgery)</h1>
<div class="post-metadata">
<p>
@@ -1892,28 +1893,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/seedling/">
<h2 data-ha-exclude="" id="seedling">seedling </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
</ul>
<img src="/img/seedling-print.jpg" alt="A print of a 3-stage design of a green seedling barely open, starting to straighten up, and growing strong, with little piles of dirt beneath each one." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
<li class="post">
<a class="postlink" href="/trans-wrongs-skull/">
<h2 data-ha-exclude="" id="trans-wrongs-skull">trans wrongs skull </h2>
<a class="postlink" href="/trans-rights-skull/">
<h2 data-ha-exclude="">trans rights skull </h2>
<ul class="postlist-tags">
@@ -1928,14 +1913,32 @@ switch (currentThemeValue) {
<li>gender</li>
</ul>
<img src="/img/trans-wrongs-print.jpg" alt="A smiling skull with devil horns and a little spiked tail, and a speech bubble reading &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/chanterelle/">
<h2 data-ha-exclude="" id="chanterelle">chanterelle </h2>
<a class="postlink" href="/big-pidge/">
<h2 data-ha-exclude="">big pidge </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>shirt</li>
</ul>
<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/congrats-on-the-autism-adhd/">
<h2 data-ha-exclude="">congrats on the autism/adhd </h2>
<ul class="postlist-tags">
@@ -1944,7 +1947,7 @@ switch (currentThemeValue) {
<li>card</li>
</ul>
<img src="/img/chanterelle-print.jpg" alt="A print of two chanterelle mushrooms inked in a dark-to-light yellow gradient." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
@@ -2001,6 +2004,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/booby-congrats-on-the-top-surgery/` was built on 2026-09-20T00:40:39.738Z -->
<!-- This page `/booby-congrats-on-the-top-surgery/` was built on 2026-09-20T22:08:14.539Z -->
</body>
</html>
bottom-growth/index.html
+29 -26
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="bottom-growth">bottom growth</h1>
<h1>bottom growth</h1>
<div class="post-metadata">
<p>
@@ -1887,49 +1888,51 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/squarsh/">
<h2 data-ha-exclude="" id="squarsh">squarsh </h2>
<a class="postlink" href="/on-the-ubiquity-of-enby/">
<h2 data-ha-exclude="">on the ubiquity of &#39;enby&#39; </h2>
<ul class="postlist-tags">
<li>print</li>
</ul>
<img src="/img/squarsh-prints.jpg" alt="Two identical prints of a delicata squash. The body of the squash is cornsilk (muted yellow), the stem and stripes in mint green, and the shadows in lilac." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/hair/">
<h2 data-ha-exclude="" id="hair">hair </h2>
<ul class="postlist-tags">
<li>print</li>
<li>gender</li>
</ul>
<img src="/img/hair-print.jpg" alt="A print in black ink of belly hair." loading="lazy" decoding="async" width="1000" height="710">
<img src="/img/gender-census.jpg" alt="A screenshot of part of the Gender Census reports page, showing the header bar and a title that reads &#39;Gender Census 2023 Worldwide Report&#39;" loading="lazy" decoding="async" width="1000" height="364">
</a>
</li>
<li class="post">
<a class="postlink" href="/fix-your-hearts/">
<h2 data-ha-exclude="" id="fix-your-hearts">fix your hearts </h2>
<a class="postlink" href="/become-unbutterable/">
<h2 data-ha-exclude="">become unbutterable </h2>
<ul class="postlist-tags">
<li>print</li>
</ul>
<img src="/img/fix-your-hearts-print.jpg" alt="2 copies of the same print, one in black ink and one in dark teal. The print is text that reads &#39;fix your hearts or die&#39;, with the text shaped into a somewhat long and narrow heart." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/become-unbutterable.jpg" alt="3 copies of the same stamp in orange ink are spread out next to the hand carved rubber stamp they were made from. They show a cat lying on his back with paws curled, holding a butter knife in his mouth. Text around the cat reads, in all caps, &#39;become unbutterable.&#39;" loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
<li class="post">
<a class="postlink" href="/pronoun-patches/">
<h2 data-ha-exclude="">pronoun patches </h2>
<ul class="postlist-tags">
<li>print</li>
<li>patch</li>
<li>gender</li>
</ul>
<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
@@ -1986,6 +1989,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/bottom-growth/` was built on 2026-09-20T00:40:39.736Z -->
<!-- This page `/bottom-growth/` was built on 2026-09-20T22:08:14.536Z -->
</body>
</html>
bowtie/index.html
+23 -22
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="bowtie">bowtie</h1>
<h1>bowtie</h1>
<div class="post-metadata">
<p>
@@ -1882,26 +1883,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/leather-lighter-case/">
<h2 data-ha-exclude="" id="leather-lighter-case">leather lighter case </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/leather-lighter-case.jpg" alt="A bic lighter wrapped in leather and hand-stitched up one side." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/foldy-wallet/">
<h2 data-ha-exclude="" id="foldy-wallet">foldy wallet </h2>
<h2 data-ha-exclude="">foldy wallet </h2>
<ul class="postlist-tags">
@@ -1914,15 +1901,29 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/rachels-bracelets/">
<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
<a class="postlink" href="/stephanie-collar/">
<h2 data-ha-exclude="">stephanie collar </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/rachel-bracelets.jpg" alt="Two pink leather bracelets with stainless steel hardware and aqua stitching." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/stephanie-collar.jpg" alt="A white woman with a shaved side cut wearing a black leather collar with a large dangling o-ring." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
<li class="post">
<a class="postlink" href="/zipper-bifold-green/">
<h2 data-ha-exclude="">zipper bifold (green) </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/zipper-bifold-green.jpg" alt="A collage showing a green leather wallet with a zippered pocket built into one external side." loading="lazy" decoding="async" width="1000" height="1332">
</a>
</li>
@@ -1979,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/bowtie/` was built on 2026-09-20T00:40:39.736Z -->
<!-- This page `/bowtie/` was built on 2026-09-20T22:08:14.537Z -->
</body>
</html>
boypussy/index.html
+30 -25
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="boypussy">boypussy</h1>
<h1>boypussy</h1>
<div class="post-metadata">
<p>
@@ -1909,12 +1910,28 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/congrats-on-the-autism-adhd/">
<h2 data-ha-exclude="" id="congrats-on-the-autism-adhd">congrats on the autism/adhd </h2>
<a class="postlink" href="/proud-dad-wallet/">
<h2 data-ha-exclude="">proud dad wallet </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>gender</li>
</ul>
<img src="/img/proud-dad-wallet.jpg" alt="A brown leather wallet with a subtle trans flag stitching across the top." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/artisans-cooperative-cards/">
<h2 data-ha-exclude="">artisans cooperative cards </h2>
<ul class="postlist-tags">
@@ -1923,35 +1940,23 @@ switch (currentThemeValue) {
<li>card</li>
</ul>
<img src="/img/congrats-on-the.jpg" alt="4 greeting cards propped up on a keyboard. On the right hand side, two cards read &#39;Congrats on the Autism&#39;; one in rainbow ink and one in black ink with a glittery gold shadow. On the left, two cards read &#39;Congrats on the ADHD&#39;; one in red and one in black, both with glittery pink shadows." loading="lazy" decoding="async" width="1000" height="562">
<img src="/img/artisans-coop-cards.jpg" alt="2 white greeting cards with the Artisans Cooperative logo, a chicken. One card has a single print of the chicken in black ink, and the other has two overlapping prints in blue and red ink" loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/give-to-trans-orgs-and-people/">
<h2 data-ha-exclude="" id="give-to-trans-orgs-and-people">give to trans orgs and people </h2>
<a class="postlink" href="/flatfish/">
<h2 data-ha-exclude="">flatfish </h2>
<ul class="postlist-tags">
<li>gender</li>
<li>print</li>
<li>card</li>
</ul>
<img src="/img/bouquet.jpg" alt="Image unrelated to post. A close up on a flower bouquet in shades of purple, pink, and white. Centered is a large, almost soft-looking pink flower that is still partially closed up." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/fd-signifier-and-oppositional-sexism/">
<h2 data-ha-exclude="" id="fd-signifier-and-oppositional-sexism">fd signifier &amp; oppositional sexism </h2>
<ul class="postlist-tags">
<li>gender</li>
</ul>
<img src="/img/sheep.jpg" alt="Image unrelated to post. A mama sheep with two babies curled up next to her in a grassy field." loading="lazy" decoding="async" width="1000" height="450">
<img src="/img/flatfish-print.jpg" alt="A print of a simple flatfish design inked in sepia." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
@@ -2008,6 +2013,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/boypussy/` was built on 2026-09-20T00:40:39.723Z -->
<!-- This page `/boypussy/` was built on 2026-09-20T22:08:14.561Z -->
</body>
</html>
brookes-collar/index.html
+16 -15
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="brookes-collar">brooke&#39;s collar</h1>
<h1>brooke&#39;s collar</h1>
<div class="post-metadata">
<p>
@@ -1882,49 +1883,49 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/fishhook-pride-keychains/">
<h2 data-ha-exclude="" id="fishhook-pride-keychains">fishhook pride keychains </h2>
<a class="postlink" href="/foldy-wallet-with-thumb-slide/">
<h2 data-ha-exclude="">foldy wallet with thumb slide </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>gender</li>
</ul>
<img src="/img/fishhook-keychain-nonbinary.jpg" alt="a keychain with an iridescent fishhook style attachment linked via leather to an iridescent keyring. the leather is stitched with nonbinary flag colors." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/foldy-thumb-slide.jpg" alt="A card wallet with one main pocket and one quick access slot with a thumb slide. The cover of the main pocket curves around the thumb slide." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/leatherworking-favorites/">
<h2 data-ha-exclude="" id="leatherworking-favorites">leatherworking favorites </h2>
<a class="postlink" href="/dragon-mask/">
<h2 data-ha-exclude="">dragon mask </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>highlight</li>
</ul>
<img src="/img/leather-harness-wip.jpg" alt="two pieces of a chest harness sitting on a messy workbench. both pieces are about 8 inches long total and consist of two large o-rings joined by a dark teal leather strap. the o rings and rivets are matte black." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/dragon-mask.jpg" alt="lee (a white person with glasses and a side shave) holds up a leather dragon mask in black and dark green. ze sticks hir tongue out at it." loading="lazy" decoding="async" width="1000" height="746">
</a>
</li>
<li class="post">
<a class="postlink" href="/mousie/">
<h2 data-ha-exclude="" id="mousie">mousie </h2>
<a class="postlink" href="/swoop-wallet/">
<h2 data-ha-exclude="">swoop wallet </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/mousie.jpg" alt="A cat in a sunbeam snuggles a little leather mouse-shaped cat toy." loading="lazy" decoding="async" width="1000" height="1499">
<img src="/img/swoop-wallet.jpg" alt="A collage showing 3 pictures of a red and brown leather card wallet. The red pocket separator folds around to the back to become a fetching curlicue." loading="lazy" decoding="async" width="900" height="1200">
</a>
</li>
@@ -1981,6 +1982,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/brookes-collar/` was built on 2026-09-20T00:40:39.727Z -->
<!-- This page `/brookes-collar/` was built on 2026-09-20T22:08:14.564Z -->
</body>
</html>
brookes-cuff-bracelets/index.html
+16 -15
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="brookes-cuff-bracelets">brooke&#39;s cuff bracelets</h1>
<h1>brooke&#39;s cuff bracelets</h1>
<div class="post-metadata">
<p>
@@ -1882,49 +1883,49 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/wrap-bracelets/">
<h2 data-ha-exclude="" id="wrap-bracelets">wrap bracelets </h2>
<a class="postlink" href="/dragon-mask/">
<h2 data-ha-exclude="">dragon mask </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>highlight</li>
</ul>
<img src="/img/leather-wrap-bracelets.jpg" alt="two wrists, each wearing a black leather wrap bracelet. the upper bracelet is a thin strap wrapped 3 times around the wrist. the lower bracelet wraps twice, with a thicker strap, and has carefully placed spikes that avoid the wrap spots." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/dragon-mask.jpg" alt="lee (a white person with glasses and a side shave) holds up a leather dragon mask in black and dark green. ze sticks hir tongue out at it." loading="lazy" decoding="async" width="1000" height="746">
</a>
</li>
<li class="post">
<a class="postlink" href="/proud-dad-wallet/">
<h2 data-ha-exclude="" id="proud-dad-wallet">proud dad wallet </h2>
<a class="postlink" href="/lobstah/">
<h2 data-ha-exclude="">lobstah </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>gender</li>
</ul>
<img src="/img/proud-dad-wallet.jpg" alt="A brown leather wallet with a subtle trans flag stitching across the top." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/long-zipper-bifold/">
<h2 data-ha-exclude="" id="long-zipper-bifold">long zipper bifold </h2>
<a class="postlink" href="/pinatex-wallet-with-zipper/">
<h2 data-ha-exclude="">piñatex wallet with zipper </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/long-zipper-bifold.jpg" alt="A collage showing an orange leather wallet with a long zipper running the length of the outside." loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/pinatex-ten-pocket-bifold.jpg" alt="A two-picture collage showing the inside and outside of a wallet made with piñatex, a leather alternative made from pineapple leaves. It is two tone blue with a pink accent and has a zippered pocket built in." loading="lazy" decoding="async" width="1000" height="1331">
</a>
</li>
@@ -1981,6 +1982,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/brookes-cuff-bracelets/` was built on 2026-09-20T00:40:39.735Z -->
<!-- This page `/brookes-cuff-bracelets/` was built on 2026-09-20T22:08:14.536Z -->
</body>
</html>
brookes-notebook/index.html
+17 -16
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="brookes-notebook">brooke&#39;s notebook</h1>
<h1>brooke&#39;s notebook</h1>
<div class="post-metadata">
<p>
@@ -1897,51 +1898,51 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/leather-long-stitch-journals/">
<h2 data-ha-exclude="" id="leather-long-stitch-journals">leather long-stitch journals </h2>
<a class="postlink" href="/stampede-journal/">
<h2 data-ha-exclude="">stampede journal </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>book</li>
</ul>
<img src="/img/long-stitch-journals.jpg" alt="A stack of hand-bound journals showing long stitches aligned with the spines. They are leather bound and have tie closures." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/stampede-journal.jpg" alt="A 4-part collage of a hardcover book, showing a coloring page with &#39;stampede!&#39; written across it." loading="lazy" decoding="async" width="1000" height="1777">
</a>
</li>
<li class="post">
<a class="postlink" href="/butch-hands-pattern/">
<h2 data-ha-exclude="" id="butch-hands-pattern">butch hands pattern </h2>
<a class="postlink" href="/quorbs/">
<h2 data-ha-exclude="">quorbs </h2>
<ul class="postlist-tags">
<li>knit</li>
<li>print</li>
<li>highlight</li>
</ul>
<img src="/img/butch-hands.jpg" alt="Hands wearing a pair of pink and grey gloves with convertable mitten tops." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/lined-notebook/">
<h2 data-ha-exclude="" id="lined-notebook">lined notebook </h2>
<a class="postlink" href="/black-and-red-journal/">
<h2 data-ha-exclude="">black and red journal </h2>
<ul class="postlist-tags">
<li>book</li>
<li>leather</li>
</ul>
<img src="/img/lined-notebook.jpg" alt="A three panel collage showing a the endpapers, cover, and pages of a small hardbound notebook." loading="lazy" decoding="async" width="1000" height="1776">
<img src="/img/black-red-journal.jpg" alt="3 image collage showing a leather-bound journal. The cover is black, with long red vertical stitches along the spine and a red leather strap for a closure. On the back in one lower corner is stamped LEE CAT ART" loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
@@ -1998,6 +1999,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/brookes-notebook/` was built on 2026-09-20T00:40:39.712Z -->
<!-- This page `/brookes-notebook/` was built on 2026-09-20T22:08:14.534Z -->
</body>
</html>
brookes-scarf/index.html
+24 -23
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="brookes-scarf">brooke&#39;s scarf</h1>
<h1>brooke&#39;s scarf</h1>
<div class="post-metadata">
<p>
@@ -1889,26 +1890,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/knit-shrimp/">
<h2 data-ha-exclude="" id="knit-shrimp">knit shrimp </h2>
<ul class="postlist-tags">
<li>knit</li>
</ul>
<img src="/img/knit-shrimp.jpg" alt="Four knitted shrimp in various shades of pink. They are all somewhere around hand-sized, and have little yarn antennae and leggies." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/butch-hands-pattern/">
<h2 data-ha-exclude="" id="butch-hands-pattern">butch hands pattern </h2>
<h2 data-ha-exclude="">butch hands pattern </h2>
<ul class="postlist-tags">
@@ -1923,17 +1910,31 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/textures-unite/">
<h2 data-ha-exclude="" id="textures-unite">textures unite </h2>
<a class="postlink" href="/pride-dice-bags/">
<h2 data-ha-exclude="">pride dice bags </h2>
<ul class="postlist-tags">
<li>knit</li>
<li>highlight</li>
<li>gender</li>
</ul>
<img src="/img/textures-unite.jpg" alt="a largely unseen person holds up an expansive knitted shawl, built in 6 sections of different textures and colors. in the background, trees and dappled sunlight." loading="lazy" decoding="async" width="1000" height="1334">
<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
</a>
</li>
<li class="post">
<a class="postlink" href="/keffiyah-fishing-net-pattern/">
<h2 data-ha-exclude="">keffiyah fishing net pattern </h2>
<ul class="postlist-tags">
<li>knit</li>
</ul>
<img src="/img/keffiyah-nets.jpg" alt="a knitted swatch. it&#39;s mostly white yarn, but a grid of dark red- purple- green yarn that looks like a chain link fence is built into it. the diagonal lines are achieved with floats of yarn from one row, then picked up and knit into several rows later." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1990,6 +1991,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/brookes-scarf/` was built on 2026-09-20T00:40:39.762Z -->
<!-- This page `/brookes-scarf/` was built on 2026-09-20T22:08:14.543Z -->
</body>
</html>
brookes-socks/index.html
+34 -37
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="brookes-socks">brooke&#39;s socks</h1>
<h1>brooke&#39;s socks</h1>
<div class="post-metadata">
<p>
@@ -1882,44 +1883,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/textures-unite/">
<h2 data-ha-exclude="" id="textures-unite">textures unite </h2>
<ul class="postlist-tags">
<li>knit</li>
<li>highlight</li>
</ul>
<img src="/img/textures-unite.jpg" alt="a largely unseen person holds up an expansive knitted shawl, built in 6 sections of different textures and colors. in the background, trees and dappled sunlight." loading="lazy" decoding="async" width="1000" height="1334">
</a>
</li>
<li class="post">
<a class="postlink" href="/butch-hands-pattern/">
<h2 data-ha-exclude="" id="butch-hands-pattern">butch hands pattern </h2>
<ul class="postlist-tags">
<li>knit</li>
<li>highlight</li>
</ul>
<img src="/img/butch-hands.jpg" alt="Hands wearing a pair of pink and grey gloves with convertable mitten tops." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/acadia-mitts/">
<h2 data-ha-exclude="" id="acadia-mitts">acadia mitts </h2>
<h2 data-ha-exclude="">acadia mitts </h2>
<ul class="postlist-tags">
@@ -1931,6 +1900,34 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/keffiyah-fishing-net-pattern/">
<h2 data-ha-exclude="">keffiyah fishing net pattern </h2>
<ul class="postlist-tags">
<li>knit</li>
</ul>
<img src="/img/keffiyah-nets.jpg" alt="a knitted swatch. it&#39;s mostly white yarn, but a grid of dark red- purple- green yarn that looks like a chain link fence is built into it. the diagonal lines are achieved with floats of yarn from one row, then picked up and knit into several rows later." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/brookes-scarf/">
<h2 data-ha-exclude="">brooke&#39;s scarf </h2>
<ul class="postlist-tags">
<li>knit</li>
</ul>
<img src="/img/brooke-scarf.jpg" alt="A diaphanous knit lacework scarf draped over the back of a chair. It is split down the long way into two colors - one tinted orange and one tinted mint blue. Both colors, the orange and the blue, are held double with the same variegated gray, making the piece more cohesive. The yarn overs in the lacework create airy repeating holes." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
</ol>
</section>
@@ -1983,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/brookes-socks/` was built on 2026-09-20T00:40:39.711Z -->
<!-- This page `/brookes-socks/` was built on 2026-09-20T22:08:14.534Z -->
</body>
</html>
brookes-suspenders/index.html
+14 -13
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="brookes-suspenders">brooke&#39;s suspenders</h1>
<h1>brooke&#39;s suspenders</h1>
<div class="post-metadata">
<p>
@@ -1882,47 +1883,47 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/vertical-card-wallet/">
<h2 data-ha-exclude="" id="vertical-card-wallet">vertical card wallet </h2>
<a class="postlink" href="/foldy-wallet/">
<h2 data-ha-exclude="">foldy wallet </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/vertical-card-wallet.jpg" alt="A collage showing a hand-stitched leather card wallet with 3 card pockets and 1 interior pocket." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/foldy-wallet.jpg" alt="A four part collage showing a single piece of deep red leather folding up to become a card wallet." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/gradient-purse-strap/">
<h2 data-ha-exclude="" id="gradient-purse-strap">gradient purse strap </h2>
<a class="postlink" href="/brookes-collar/">
<h2 data-ha-exclude="">brooke&#39;s collar </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/gradient-purse-strap.jpg" alt="a coiled up purse strap in gradient cool colors - we can see green, teal, indigo, and a slightly pinkish purple. It has brass hardware and is stiched along its length with cream stitches." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/lined-shearling-collar.jpg" alt="A green leather collar lined with brown/grey shearling and fitted with two sizes of silver-toned spikes." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/vertical-bifold/">
<h2 data-ha-exclude="" id="vertical-bifold">vertical bifold </h2>
<a class="postlink" href="/leaf-patches/">
<h2 data-ha-exclude="">leaf patches </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/vertical-bifold.jpg" alt="A collage showing a hand-stitched leather vertical bifold wallet with 6 card pockets, 2 hidden pockets, and 1 bill pocket." loading="lazy" decoding="async" width="1000" height="1777">
<img src="/img/leaf-patches-oak.jpg" alt="Several oak-leaf-shaped leather patches with stitching holes punched around the edges." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1979,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/brookes-suspenders/` was built on 2026-09-20T00:40:39.761Z -->
<!-- This page `/brookes-suspenders/` was built on 2026-09-20T22:08:14.543Z -->
</body>
</html>
brown-creeper/index.html
+30 -27
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="brown-creeper">brown creeper</h1>
<h1>brown creeper</h1>
<div class="post-metadata">
<p>
@@ -1883,12 +1884,30 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/heron/">
<h2 data-ha-exclude="" id="heron">heron </h2>
<a class="postlink" href="/pronoun-patches/">
<h2 data-ha-exclude="">pronoun patches </h2>
<ul class="postlist-tags">
<li>print</li>
<li>patch</li>
<li>gender</li>
</ul>
<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
<li class="post">
<a class="postlink" href="/hummingbird-become-ungovernable/">
<h2 data-ha-exclude="">hummingbird become ungovernable </h2>
<ul class="postlist-tags">
@@ -1899,39 +1918,23 @@ switch (currentThemeValue) {
<li>shirt</li>
</ul>
<img src="/img/heron-print.jpg" alt="A print in black ink of a great blue heron, leaning downwards so that eir beak is level with eir feet." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/hummingbird-ungovernable-print.jpg" alt="A block print in black and orange ink of a rufous hummingbird, tail flared, hovering in midair. Clutched in eir tiny claws is a banner that waves in the wind and reads &#39;become ungovernable&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/booby-congrats-on-the-top-surgery/">
<h2 data-ha-exclude="" id="booby-congrats-on-the-top-surgery">booby (congrats on the top surgery) </h2>
<a class="postlink" href="/not-a-drill/">
<h2 data-ha-exclude="">not a drill </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>gender</li>
<li>shirt</li>
</ul>
<img src="/img/booby-card.jpg" alt="A landscape-oriented white card with a two-color print of a blue-footed booby." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/kniphofia/">
<h2 data-ha-exclude="" id="kniphofia">kniphofia </h2>
<ul class="postlist-tags">
<li>print</li>
</ul>
<img src="/img/kniphofia-print.jpg" alt="A print of a brightly colored flower in 4 layers of color" loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/not-a-drill-print.jpg" alt="A print in dark teal ink depicting a power drill with text in cursive below that reads &#39;ceci n&#39;est pas un exercice&#39; or &#39;this is not a drill&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1988,6 +1991,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/brown-creeper/` was built on 2026-09-20T00:40:39.740Z -->
<!-- This page `/brown-creeper/` was built on 2026-09-20T22:08:14.540Z -->
</body>
</html>
butch-hands-pattern/index.html
+143 -19
View File
@@ -40,7 +40,80 @@
<style>.post-metadata {
<style>#toc {
float: right;
margin: 1rem 0 1.5rem 1.5rem;
width: min(calc(100% - 1.5rem), 23rem);
/* 23rem is the width of the words 'table of contents' in my header font */
/* yes, it's a bit hacky */
}
@media (max-width: 850px) {
#toc {
float: unset;
margin-top: 2rem;
margin-left: .5rem;
width: calc(100% - .5rem);
}
}
#toc details {
border: thick solid var(--color-pink);
border-radius: 1rem;
margin-top: 1rem;
}
#toc summary {
position: relative;
top: -1.5rem;
left: -.75rem;
width: fit-content;
background: var(--color-bg);
border-radius: .5rem;
}
#toc summary:focus-visible {
outline: .15rem solid var(--color-teal);
}
#toc summary::marker {
font-size: 2.35rem;
}
#toc h2 {
margin-top: 0;
display: inline;
line-height: normal;
}
#toc nav {
position: relative;
top: -1.25rem;
}
#toc li {
margin-block: .45rem 0;
}
@media (max-width: 650px) {
#toc nav > ol {
margin-left: .5rem;
}
}
/* basically we want to style this `ol` as a `ul` */
#toc ol > li {
list-style: disc;
}
#toc ol > li > ol > li {
list-style: circle;
}
#toc ol > li > ol > li > ol > li {
list-style: square;
}
.post-metadata {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
@@ -438,6 +511,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +571,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1888,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="butch-hands-pattern">butch hands pattern</h1>
<h1>butch hands pattern</h1>
<div class="post-metadata">
<p>
@@ -1848,7 +1922,58 @@ switch (currentThemeValue) {
<img class="hero" src="/img/butch-hands.jpg" alt="Hands wearing a pair of pink and grey gloves with convertable mitten tops." loading="lazy" decoding="async" width="1000" height="750">
<p>This pattern is a <strong>Work in Progress</strong> and will be updated with more information as I make a second pair of these.</p>
<aside id="toc">
<details>
<summary><h2>table of contents</h2></summary>
<nav class="toc">
<ol>
<li><a href="#authorship-and-attribution">Authorship and attribution</a>
</li>
<li><a href="#materials-and-tools">Materials and tools</a>
</li>
<li><a href="#outline">Outline</a>
</li>
<li><a href="#directions">Directions</a>
<ol>
<li><a href="#cuff">Cuff</a>
</li>
<li><a href="#back-of-hand">Back of hand</a>
</li>
<li><a href="#mitten-top">Mitten top</a>
</li>
<li><a href="#establishing-the-palm">Establishing the palm</a>
</li>
<li><a href="#thumb-gusset">Thumb gusset</a>
<ol>
<li><a href="#right-hand-thumb">Right hand thumb</a>
</li>
<li><a href="#left-hand-thumb">Left hand thumb</a>
</li>
</ol>
</li>
</ol>
</li>
</ol>
</nav>
</details>
</aside>
<p>This pattern is a <strong>Work in Progress</strong> and will be updated with more information as I make a second pair of these.</p>
<h2 id="authorship-and-attribution">Authorship and attribution</h2>
<ul>
<li>Created: 12 March 2021</li>
@@ -1927,6 +2052,7 @@ switch (currentThemeValue) {
<h4 id="left-hand-thumb">Left hand thumb</h4>
<p>To be continued...</p>
</article>
@@ -1964,51 +2090,49 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/brookes-scarf/">
<h2 data-ha-exclude="" id="brookes-scarf">brooke&#39;s scarf </h2>
<a class="postlink" href="/on-the-shoulders-of-giants/">
<h2 data-ha-exclude="">on the shoulders of giants </h2>
<ul class="postlist-tags">
<li>zine</li>
<li>knit</li>
</ul>
<img src="/img/brooke-scarf.jpg" alt="A diaphanous knit lacework scarf draped over the back of a chair. It is split down the long way into two colors - one tinted orange and one tinted mint blue. Both colors, the orange and the blue, are held double with the same variegated gray, making the piece more cohesive. The yarn overs in the lacework create airy repeating holes." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/on-the-shoulders.jpg" alt="ok so. five image collage showing the front, 3 inner spreads, and back of a riso-printed zine in green and light blue. it&#39;s called &#39;on the shoulders of giants&#39; and it&#39;s about a knitting technique I learned from Stephen west and how I built on that technique. it talks about joining two adjacent panels without seaming, instead knitting the second panel onto the selvedge of the first. then it uses that technique to approach two panels knit with significantly different weights of yarn" loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/brookes-notebook/">
<h2 data-ha-exclude="" id="brookes-notebook">brooke&#39;s notebook </h2>
<a class="postlink" href="/happy-solstice-2025/">
<h2 data-ha-exclude="">happy solstice 2025 </h2>
<ul class="postlist-tags">
<li>book</li>
<li>highlight</li>
</ul>
<img src="/img/brooke-notebook.jpg" alt="A six panel collage showing the covers, endpapers, and some of the pages of a notebook." loading="lazy" decoding="async" width="1000" height="1500">
<img src="/img/solstice-2025.jpg" alt="front and back of our solstice card from this year, designed in postcard format. long alt incoming... front - 4 picture collage. 1 - i&#39;m standing in the woods, looking to one side, wearing an elaborate knit scarf. 2 - silhouetted thistle-like flowers in front of a pink-purple sky. 3 - my wife brooke crouches down to draw a heart in charcoal on a beach log, with &#39;L + B&#39; written inside. 4 - brooke stands on a driftwood-covered beach looking hella cool in mirrored shades. our dog kes stands in front of her and looks off to one side eagerly. overlaid is the words &#39;happy solstice&#39; in cursive. back - split down the center like the back of a postcard. on the left side, a 5 picture collage. 1 - i stand on a rock at the edge of a calm alpine lake. overlaid is the words &#39;lee, brooke, kestrel, &amp; the flock&#39; in print lettering. 2 - an early spring fern curl. 3 - our six ducks, all facing to the left, not in a row but still very organized. 4 - brooke grins at the camera while hugging kestrel&#39;s head. kestrel looks maybe a bit distraught. 5 - silhouette of a heron in flight across an early morning blue sky. on the address side, i&#39;ve added a dahlia to represent the stamp, and written &#39;you!&#39; in the field that would normally hold the mailing address." loading="lazy" decoding="async" width="1000" height="1346">
</a>
</li>
<li class="post">
<a class="postlink" href="/pride-dice-bags/">
<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
<a class="postlink" href="/pink-socks/">
<h2 data-ha-exclude="">pink socks </h2>
<ul class="postlist-tags">
<li>knit</li>
<li>gender</li>
</ul>
<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
<img src="/img/pink-socks.jpg" alt="Feet propped up on a car dashboard, with a desert landscape beyond. The feet are in salmon-colored socks with black flecks, and decorative lines running down the socks." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
@@ -2065,6 +2189,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/butch-hands-pattern/` was built on 2026-09-20T00:40:39.713Z -->
<!-- This page `/butch-hands-pattern/` was built on 2026-09-20T22:08:14.586Z -->
</body>
</html>
chanterelle/index.html
+27 -26
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="chanterelle">chanterelle</h1>
<h1>chanterelle</h1>
<div class="post-metadata">
<p>
@@ -1894,30 +1895,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/nonbinary-flag/">
<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>gender</li>
</ul>
<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/seedling/">
<h2 data-ha-exclude="" id="seedling">seedling </h2>
<a class="postlink" href="/junco/">
<h2 data-ha-exclude="">junco </h2>
<ul class="postlist-tags">
@@ -1926,14 +1909,14 @@ switch (currentThemeValue) {
<li>card</li>
</ul>
<img src="/img/seedling-print.jpg" alt="A print of a 3-stage design of a green seedling barely open, starting to straighten up, and growing strong, with little piles of dirt beneath each one." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/junco-print.jpg" alt="A print of a junco mid-takeoff from a branch. Eir head is inked in black, body in gray, and the branch in sepia." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
<li class="post">
<a class="postlink" href="/brown-creeper/">
<h2 data-ha-exclude="" id="brown-creeper">brown creeper </h2>
<h2 data-ha-exclude="">brown creeper </h2>
<ul class="postlist-tags">
@@ -1945,6 +1928,24 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/foxgloves/">
<h2 data-ha-exclude="">foxgloves </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>shirt</li>
</ul>
<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
</ol>
</section>
@@ -1997,6 +1998,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/chanterelle/` was built on 2026-09-20T00:40:39.713Z -->
<!-- This page `/chanterelle/` was built on 2026-09-20T22:08:14.545Z -->
</body>
</html>
charlie-the-alpaca-handspun/index.html
+14 -15
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="charlie-the-alpaca-handspun">charlie the alpaca handspun</h1>
<h1>charlie the alpaca handspun</h1>
<div class="post-metadata">
<p>
@@ -1882,49 +1883,47 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/hand-dyed-gold-handspun/">
<h2 data-ha-exclude="" id="hand-dyed-gold-handspun">hand-dyed gold handspun </h2>
<a class="postlink" href="/fire-and-ice-handspun/">
<h2 data-ha-exclude="">fire &amp; ice handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/gold-handspun.jpg" alt="3 skeins, one small and two large, of a rich golden-orange handspun with light tonal effects, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/fire-ice-handspun.jpg" alt="2 skeins, one large and one small, of a heathered orange yarn with hints of blue in about a DK or worsted weight." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/rambouillet-handspun/">
<h2 data-ha-exclude="" id="rambouillet-handspun">rambouillet handspun </h2>
<a class="postlink" href="/spinners-dream-handspun/">
<h2 data-ha-exclude="">spinner&#39;s dream handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
<li>highlight</li>
</ul>
<img src="/img/rambouillet-handspun.jpg" alt="1 large and 2 small skeins of handspun yarn in a sport or DK weight that has been dyed in light and dark teal, green, and rusty green-gold." loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/spinners-dream-handspun.jpg" alt="a skein of a lightly variegated grey yarn in about a sport or DK weight." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/dyeing-fiber/">
<h2 data-ha-exclude="" id="dyeing-fiber">dyeing fiber </h2>
<a class="postlink" href="/handcombed-jacobs-handspun/">
<h2 data-ha-exclude="">handcombed jacobs handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/dyed-fiber.jpg" alt="4oz of yarn and a pound of wool, chunked out, drying on a drying rack outdoors. the yarn and half the wool is a mix of teals and greens; the other half of the wool is a beautiful orange-gold." loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/handcombed-jacobs.jpg" alt="a skein of dark grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
@@ -1981,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/charlie-the-alpaca-handspun/` was built on 2026-09-20T00:40:39.765Z -->
<!-- This page `/charlie-the-alpaca-handspun/` was built on 2026-09-20T22:08:14.568Z -->
</body>
</html>
circle-bag/index.html
+34 -33
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="circle-bag">circle bag</h1>
<h1>circle bag</h1>
<div class="post-metadata">
<p>
@@ -1882,12 +1883,40 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/foldy-wallet-with-thumb-slide/">
<h2 data-ha-exclude="">foldy wallet with thumb slide </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/foldy-thumb-slide.jpg" alt="A card wallet with one main pocket and one quick access slot with a thumb slide. The cover of the main pocket curves around the thumb slide." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/o-ring-bracelet/">
<h2 data-ha-exclude="">o-ring bracelet </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/oring-bracelet.jpg" alt="A green leather bracelet, stitched along the edges with dark blue thread, holds an ouroborous o-ring in place with two black snaps." loading="lazy" decoding="async" width="900" height="1200">
</a>
</li>
<li class="post">
<a class="postlink" href="/pinatex-wallet-with-zipper/">
<h2 data-ha-exclude="" id="pinatex-wallet-with-zipper">piñatex wallet with zipper </h2>
<h2 data-ha-exclude="">piñatex wallet with zipper </h2>
<ul class="postlist-tags">
@@ -1899,34 +1928,6 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/rachels-bracelets/">
<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/rachel-bracelets.jpg" alt="Two pink leather bracelets with stainless steel hardware and aqua stitching." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/leather-chest-harness/">
<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
</ol>
</section>
@@ -1979,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/circle-bag/` was built on 2026-09-20T00:40:39.733Z -->
<!-- This page `/circle-bag/` was built on 2026-09-20T22:08:14.565Z -->
</body>
</html>
colophon/index.html
+4 -3
View File
@@ -51,6 +51,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -109,7 +111,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>" data-pagefind-body="">
<h1 id="colophon">colophon</h1>
<h1>colophon</h1>
<p>This is v2 of my personal website, built with <a href="https://www.11ty.dev/" target="_blank" rel="external">Eleventy v3.1.2</a> and hosted by <a href="https://heckin.technology/" target="_blank" rel="external">heckin' technology</a>. It's been hand-coded from the ground up.</p>
<p>v1 of this site began in 2022 and was based on <a href="https://lenpaul.github.io/Millennial/" target="_blank" rel="external">Millennial</a>, a minimalist Jekyll theme for running a blog or publication by Paul Le.</p>
@@ -1459,6 +1460,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/colophon/` was built on 2026-09-20T00:40:39.773Z -->
<!-- This page `/colophon/` was built on 2026-09-20T22:08:14.572Z -->
</body>
</html>
coming-out/index.html
+15 -14
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="coming-out">coming out</h1>
<h1>coming out</h1>
<div class="post-metadata">
<p>
@@ -1898,30 +1899,30 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/foxgloves/">
<h2 data-ha-exclude="" id="foxgloves">foxgloves </h2>
<a class="postlink" href="/geese-trans-wrongs/">
<h2 data-ha-exclude="">geese/trans wrongs </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>shirt</li>
<li>gender</li>
</ul>
<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/trans-wrongs-geese-print.jpg" alt="Two Canada geese and their reflections in the water. One is calmly swimming away, while the over leans over towards them and HONKS! Both have speech bubbles; the calm goose says &#39;trans rights!&#39; while the honking goose says &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/luminescent/">
<h2 data-ha-exclude="" id="luminescent-mature">luminescent (mature)</h2>
<h2 data-ha-exclude="">luminescent (mature)</h2>
<ul class="postlist-tags">
@@ -1936,15 +1937,15 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/loon/">
<h2 data-ha-exclude="" id="loon">loon </h2>
<a class="postlink" href="/networks-of-trans-care/">
<h2 data-ha-exclude="">networks of trans care </h2>
<ul class="postlist-tags">
<li>print</li>
<li>gender</li>
</ul>
<img src="/img/loon-print.jpg" alt="A print of a loon rearing up with wings spread" loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/mushrooms-and-moss.jpg" alt="Image unrelated to post. Close up on a cluster of orange-brown mushrooms on a mossy tree trunk." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -2001,6 +2002,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/coming-out/` was built on 2026-09-20T00:40:39.723Z -->
<!-- This page `/coming-out/` was built on 2026-09-20T22:08:14.561Z -->
</body>
</html>
comparing-text-editors/index.html
+157 -37
View File
@@ -40,7 +40,80 @@
<style>.post-metadata {
<style>#toc {
float: right;
margin: 1rem 0 1.5rem 1.5rem;
width: min(calc(100% - 1.5rem), 23rem);
/* 23rem is the width of the words 'table of contents' in my header font */
/* yes, it's a bit hacky */
}
@media (max-width: 850px) {
#toc {
float: unset;
margin-top: 2rem;
margin-left: .5rem;
width: calc(100% - .5rem);
}
}
#toc details {
border: thick solid var(--color-pink);
border-radius: 1rem;
margin-top: 1rem;
}
#toc summary {
position: relative;
top: -1.5rem;
left: -.75rem;
width: fit-content;
background: var(--color-bg);
border-radius: .5rem;
}
#toc summary:focus-visible {
outline: .15rem solid var(--color-teal);
}
#toc summary::marker {
font-size: 2.35rem;
}
#toc h2 {
margin-top: 0;
display: inline;
line-height: normal;
}
#toc nav {
position: relative;
top: -1.25rem;
}
#toc li {
margin-block: .45rem 0;
}
@media (max-width: 650px) {
#toc nav > ol {
margin-left: .5rem;
}
}
/* basically we want to style this `ol` as a `ul` */
#toc ol > li {
list-style: disc;
}
#toc ol > li > ol > li {
list-style: circle;
}
#toc ol > li > ol > li > ol > li {
list-style: square;
}
.post-metadata {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
@@ -438,6 +511,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +571,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1888,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="comparing-text-editors">comparing text editors</h1>
<h1>comparing text editors</h1>
<div class="post-metadata">
<p>
@@ -1843,7 +1917,52 @@ switch (currentThemeValue) {
<img class="hero" src="/img/horsetail.jpg" alt="Image unrelated to post. Close up on a horsetail plant&#39;s stem, with many small needle-like leaves emerging from all sides of the circular stem at each segmented joint." loading="lazy" decoding="async" width="1000" height="666">
<p>I'm fucking depressed. No, not like mental health depressed (okay, look, that too, but that's not relevant here). Looking to switch text editors, I reviewed 6 different options...and what I found didn't thrill me.</p>
<aside id="toc">
<details>
<summary><h2>table of contents</h2></summary>
<nav class="toc">
<ol>
<li><a href="#the-editors">the editors</a>
</li>
<li><a href="#the-qualities">the qualities</a>
</li>
<li><a href="#the-comparison-charts">the comparison charts</a>
<ol>
<li><a href="#functional-qualities">functional qualities</a>
</li>
<li><a href="#aesthetic-qualities">aesthetic qualities</a>
</li>
<li><a href="#ethical-qualities">ethical qualities</a>
</li>
</ol>
</li>
<li><a href="#summary">summary</a>
</li>
<li><a href="#corrections-and-edits">corrections and edits</a>
<ol>
<li><a href="#wsl2-and-linux-guis">WSL2 and Linux GUIs</a>
</li>
</ol>
</li>
</ol>
</nav>
</details>
</aside>
<p>I'm fucking depressed. No, not like mental health depressed (okay, look, that too, but that's not relevant here). Looking to switch text editors, I reviewed 6 different options...and what I found didn't thrill me.</p>
<blockquote>
<p>this post contains comparison tables that are far more viewable on desktop/tablet</p>
</blockquote>
@@ -2067,6 +2186,7 @@ switch (currentThemeValue) {
<h3 id="wsl2-and-linux-guis">WSL2 and Linux GUIs</h3>
<p>I learned that <a href="https://learn.microsoft.com/en-us/windows/wsl/tutorials/gui-apps" target="_blank" rel="external">WSL2 can support GUI apps</a> so I tried this for a few. Pulsar did not work; Sublime Text worked but the UI scale was <em>teensy</em> and was not affected by the <code>ui_scale</code> setting.</p>
</article>
@@ -2104,42 +2224,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/core-css/">
<h2 data-ha-exclude="" id="core-css">core CSS </h2>
<ul class="postlist-tags">
<li>software</li>
<li>highlight</li>
</ul>
<img src="/img/core-css.png" alt="A website mockup in dark mode with light pink accents. Everything is filler text such as the title &#39;This is my cool website&#39;, headers reading things like &#39;This is an h1&#39;, nav items &#39;Nav item 1&#39;, etc. There is a paragraph block - the opening of the Bee Movie - and part of an image visible - a screencap of the music video for Never Gonna Give You Up by Rick Astley." loading="lazy" decoding="async" width="1000" height="447">
</a>
</li>
<li class="post">
<a class="postlink" href="/framer-accessibility/">
<h2 data-ha-exclude="" id="framer-accessibility">framer accessibility </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/framer.png" alt="A screenshot of the Framer projects page showing part of the tile for a very rudimentary project titled Accessibility Test. It has a huge title that just reads Title, a basic form, and some pictures of my dog as notable features." loading="lazy" decoding="async" width="841" height="532">
</a>
</li>
<li class="post">
<a class="postlink" href="/domain-and-site-setup/">
<h2 data-ha-exclude="" id="domain-and-site-setup">domain and site setup </h2>
<h2 data-ha-exclude="">domain and site setup </h2>
<ul class="postlist-tags">
@@ -2151,6 +2241,36 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/screen-reader-optimizations/">
<h2 data-ha-exclude="">screen reader optimizations </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/crow.jpg" alt="Image unrelated to post. A crow poses on driftwood against a whitish sky." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/designing-a-bag/">
<h2 data-ha-exclude="">designing a bag </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>software</li>
</ul>
<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
</a>
</li>
</ol>
</section>
@@ -2203,6 +2323,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/comparing-text-editors/` was built on 2026-09-20T00:40:39.763Z -->
<!-- This page `/comparing-text-editors/` was built on 2026-09-20T22:08:14.587Z -->
</body>
</html>
congrats-on-the-autism-adhd/index.html
+30 -27
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="congrats-on-the-autism-adhd">congrats on the autism/adhd</h1>
<h1>congrats on the autism/adhd</h1>
<div class="post-metadata">
<p>
@@ -1895,26 +1896,44 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/block-printing-transfer-method/">
<h2 data-ha-exclude="" id="block-printing-transfer-method">block printing transfer method </h2>
<a class="postlink" href="/not-a-drill/">
<h2 data-ha-exclude="">not a drill </h2>
<ul class="postlist-tags">
<li>print</li>
<li>shirt</li>
</ul>
<img src="/img/transfer-wip.jpg" alt="A pink block of carving material with a printed design of a bird attached to it. The paper has been partially rubbed away (process described in this post) to reveal the inked design on the carving material." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/not-a-drill-print.jpg" alt="A print in dark teal ink depicting a power drill with text in cursive below that reads &#39;ceci n&#39;est pas un exercice&#39; or &#39;this is not a drill&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/nonbinary-flag/">
<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
<a class="postlink" href="/greeting-quorbs/">
<h2 data-ha-exclude="">greeting quorbs </h2>
<ul class="postlist-tags">
<li>card</li>
<li>print</li>
</ul>
<img src="/img/greeting-quorbs.jpg" alt="A pile of hand-printed A2 size greeting cards. Only the front is visible, showing a particularly round quail." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/big-pidge/">
<h2 data-ha-exclude="">big pidge </h2>
<ul class="postlist-tags">
@@ -1922,26 +1941,10 @@ switch (currentThemeValue) {
<li>card</li>
<li>gender</li>
<li>shirt</li>
</ul>
<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/flatfish/">
<h2 data-ha-exclude="" id="flatfish">flatfish </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
</ul>
<img src="/img/flatfish-print.jpg" alt="A print of a simple flatfish design inked in sepia." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/big-pidge-print.jpg" alt="A block print of a superb speciman of pigeon, inked mostly in black but with patches of green, blue, and purple to indicate iridescence." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1998,6 +2001,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/congrats-on-the-autism-adhd/` was built on 2026-09-20T00:40:39.710Z -->
<!-- This page `/congrats-on-the-autism-adhd/` was built on 2026-09-20T22:08:14.532Z -->
</body>
</html>
congrats-on-the-gay/index.html
+31 -28
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="congrats-on-the-gay">congrats on the gay</h1>
<h1>congrats on the gay</h1>
<div class="post-metadata">
<p>
@@ -1901,57 +1902,59 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/booby-congrats-on-the-top-surgery/">
<h2 data-ha-exclude="" id="booby-congrats-on-the-top-surgery">booby (congrats on the top surgery) </h2>
<a class="postlink" href="/trans-the-world/">
<h2 data-ha-exclude="">trans the world </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>shirt</li>
<li>gender</li>
</ul>
<img src="/img/booby-card.jpg" alt="A landscape-oriented white card with a two-color print of a blue-footed booby." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/trans-the-world-print.jpg" alt="A print that reads &#39;trans the world&#39; surrounding an image of a globe and a trans symbol. It&#39;s in a ping-to-blue gradient." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/pride-dice-bags/">
<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
<ul class="postlist-tags">
<li>knit</li>
<li>gender</li>
</ul>
<img src="/img/pride-dice-bags.jpg" alt="Several knitted drawstring dice bags sit in front of a bookshelf. They are in different pride flag colors; from right to left (skipping a few duplicates) bisexual, lesbian, nonbinary, trans, and genderqueer. The trans-colored dice bag in the center opens towards the camera, showing a variety of colorful dice inside." loading="lazy" decoding="async" width="1000" height="500">
</a>
</li>
<li class="post">
<a class="postlink" href="/nonbinary-flag/">
<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
<a class="postlink" href="/anarchy-autism/">
<h2 data-ha-exclude="">anarchy autism </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>sticker</li>
<li>shirt</li>
<li>pin</li>
</ul>
<img src="/img/anarchy-autism-rainbow-print.jpg" alt="A print in rainbow ink that says autism with the anarchy A." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/fishhook-pride-keychains/">
<h2 data-ha-exclude="">fishhook pride keychains </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>gender</li>
</ul>
<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/fishhook-keychain-nonbinary.jpg" alt="a keychain with an iridescent fishhook style attachment linked via leather to an iridescent keyring. the leather is stitched with nonbinary flag colors." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -2008,6 +2011,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/congrats-on-the-gay/` was built on 2026-09-20T00:40:39.712Z -->
<!-- This page `/congrats-on-the-gay/` was built on 2026-09-20T22:08:14.545Z -->
</body>
</html>
contact/index.html
+4 -3
View File
@@ -51,6 +51,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -109,7 +111,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1398,7 +1399,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>" data-pagefind-body="">
<h1 id="contact">contact</h1>
<h1>contact</h1>
<h2 id="contact-me">contact me</h2>
<dl>
@@ -1538,6 +1539,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/contact/` was built on 2026-09-20T00:40:39.773Z -->
<!-- This page `/contact/` was built on 2026-09-20T22:08:14.572Z -->
</body>
</html>
coral-reef-handspun/index.html
+34 -33
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="coral-reef-handspun">coral reef handspun</h1>
<h1>coral reef handspun</h1>
<div class="post-metadata">
<p>
@@ -1882,40 +1883,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/light-grey-jacobs-handspun/">
<h2 data-ha-exclude="" id="light-grey-jacobs-handspun">light grey jacobs handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/light-grey-jacobs.jpg" alt="a skein of light grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/orion-handspun/">
<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/orion-handspun.jpg" alt="3 skeins of handspun yarn, 1 large and 2 small. One of the small skeins is a little more inconsistent weight than the other two - this one was spun on drop spindle about 2 years ago. The other two are about a sport or maybe a DK weight. All three are a gold colorway with tiny hints of orange and a pale light green." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/hand-dyed-gold-handspun/">
<h2 data-ha-exclude="" id="hand-dyed-gold-handspun">hand-dyed gold handspun </h2>
<h2 data-ha-exclude="">hand-dyed gold handspun </h2>
<ul class="postlist-tags">
@@ -1927,6 +1900,34 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
<h2 data-ha-exclude="">handspun yarn in party mix and orange-gold </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/petrichor-handspun/">
<h2 data-ha-exclude="">petrichor handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/petrichor-handspun.jpg" alt="3 skeins of handspun yarn, 2 large and 1 small. the large ones are a rich earth-tone blend of reds, pinks, browns, and hints of green and gold. the smaller skein is similar but with a decidedly greener hue" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
</ol>
</section>
@@ -1979,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/coral-reef-handspun/` was built on 2026-09-20T00:40:39.764Z -->
<!-- This page `/coral-reef-handspun/` was built on 2026-09-20T22:08:14.567Z -->
</body>
</html>
core-css/index.html
+163 -17
View File
@@ -40,7 +40,80 @@
<style>.post-metadata {
<style>#toc {
float: right;
margin: 1rem 0 1.5rem 1.5rem;
width: min(calc(100% - 1.5rem), 23rem);
/* 23rem is the width of the words 'table of contents' in my header font */
/* yes, it's a bit hacky */
}
@media (max-width: 850px) {
#toc {
float: unset;
margin-top: 2rem;
margin-left: .5rem;
width: calc(100% - .5rem);
}
}
#toc details {
border: thick solid var(--color-pink);
border-radius: 1rem;
margin-top: 1rem;
}
#toc summary {
position: relative;
top: -1.5rem;
left: -.75rem;
width: fit-content;
background: var(--color-bg);
border-radius: .5rem;
}
#toc summary:focus-visible {
outline: .15rem solid var(--color-teal);
}
#toc summary::marker {
font-size: 2.35rem;
}
#toc h2 {
margin-top: 0;
display: inline;
line-height: normal;
}
#toc nav {
position: relative;
top: -1.25rem;
}
#toc li {
margin-block: .45rem 0;
}
@media (max-width: 650px) {
#toc nav > ol {
margin-left: .5rem;
}
}
/* basically we want to style this `ol` as a `ul` */
#toc ol > li {
list-style: disc;
}
#toc ol > li > ol > li {
list-style: circle;
}
#toc ol > li > ol > li > ol > li {
list-style: square;
}
.post-metadata {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
@@ -438,6 +511,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +571,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1888,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="core-css">core CSS</h1>
<h1>core CSS</h1>
<div class="post-metadata">
<p>
@@ -1848,7 +1922,76 @@ switch (currentThemeValue) {
<img class="hero" src="/img/core-css.png" alt="A website mockup in dark mode with light pink accents. Everything is filler text such as the title &#39;This is my cool website&#39;, headers reading things like &#39;This is an h1&#39;, nav items &#39;Nav item 1&#39;, etc. There is a paragraph block - the opening of the Bee Movie - and part of an image visible - a screencap of the music video for Never Gonna Give You Up by Rick Astley." loading="lazy" decoding="async" width="1000" height="447">
<p>What CSS would you implement if you had no or very low vision? Recently, a Blind friend wanted to know more about CSS. This is my attempt at a very minimal CSS file that cleans up a few <a href="https://browserdefaultstyles.com/" target="_blank" rel="external">browser defaults</a> for a more pleasant browsing experience without needing much if any visual testing.</p>
<aside id="toc">
<details>
<summary><h2>table of contents</h2></summary>
<nav class="toc">
<ol>
<li><a href="#css-resets">CSS resets</a>
</li>
<li><a href="#color">color</a>
<ol>
<li><a href="#accents">accents</a>
</li>
</ol>
</li>
<li><a href="#focus-indication">focus indication</a>
</li>
<li><a href="#font">font</a>
</li>
<li><a href="#margins">margins</a>
</li>
<li><a href="#links">links</a>
</li>
<li><a href="#images">images</a>
</li>
<li><a href="#headers%2C-footers%2C-navs">headers, footers, navs</a>
<ol>
<li><a href="#skip-link">skip link</a>
</li>
<li><a href="#site-title">site title</a>
</li>
<li><a href="#flexbox-navs">flexbox navs</a>
</li>
<li><a href="#aria-current">aria-current</a>
</li>
<li><a href="#separating-header-and-footer-from-main">separating header and footer from main</a>
</li>
</ol>
</li>
<li><a href="#print-media">print media</a>
</li>
<li><a href="#feedback">feedback</a>
</li>
<li><a href="#result">result</a>
</li>
</ol>
</nav>
</details>
</aside>
<p>What CSS would you implement if you had no or very low vision? Recently, a Blind friend wanted to know more about CSS. This is my attempt at a very minimal CSS file that cleans up a few <a href="https://browserdefaultstyles.com/" target="_blank" rel="external">browser defaults</a> for a more pleasant browsing experience without needing much if any visual testing.</p>
<p>Want to just see the final stylesheet? <a href="#result">Skip to the end of the page</a>.</p>
<h2 id="css-resets">CSS resets</h2>
<p>Before we start: this isn't a CSS reset. You may want to apply it in concert with one. While writing this, a friend recommended <a href="https://www.joshwcomeau.com/css/custom-css-reset/" target="_blank" rel="external">Josh W. Comeau's CSS Reset</a>, which looks largely very solid to me. However, if using that particular reset, I would <em><strong>not</strong></em> reset default margins (rule 2). They are tremendously useful in this case, where we are unlikely to be setting margins on elements individually.</p>
@@ -1935,7 +2078,7 @@ a</span> <span class="token punctuation">{</span>
<span class="token property">max-width</span><span class="token punctuation">:</span> 100%<span class="token punctuation">;</span>
<span class="token property">margin</span><span class="token punctuation">:</span> 0 auto<span class="token punctuation">;</span>
<span class="token punctuation">}</span></code></pre>
<h2 id="headers-footers-navs">headers, footers, navs</h2>
<h2 id="headers%2C-footers%2C-navs">headers, footers, navs</h2>
<p>Let's talk the components that every page likely has - a header, a footer, and navs. I'm going to use a very simple design for our header - a <a href="https://webaim.org/techniques/skipnav/" target="_blank" rel="external">skip link</a>, an (optional) site title (the title could also be one of the nav links), and then an unordered list of links enclosed in a <code>nav</code> element. Like the following:</p>
<pre class="language-html"><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>header</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>skip<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#main<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Skip to content<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">></span></span>
@@ -2162,6 +2305,7 @@ footer a[aria-current="page"]::after</span> <span class="token punctuation">{</s
<span class="token punctuation">}</span>
<span class="token punctuation">}</span></code></pre>
</article>
@@ -2199,49 +2343,51 @@ footer a[aria-current="page"]::after</span> <span class="token punctuation">{</s
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/eleventy-lessons/">
<h2 data-ha-exclude="" id="eleventy-lessons">eleventy lessons </h2>
<a class="postlink" href="/handedness-toggle/">
<h2 data-ha-exclude="">handedness toggle </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/hellebore.jpg" alt="Image unrelated to post. Close up on a pale green hellebore flower." loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/handedness-toggle-0.png" alt="A screenshot of the rescue trans rescue navbar centered on a button that shows a hand pointing left." loading="lazy" decoding="async" width="1000" height="257">
</a>
</li>
<li class="post">
<a class="postlink" href="/moving-images/">
<h2 data-ha-exclude="" id="moving-images">moving images </h2>
<a class="postlink" href="/redirections/">
<h2 data-ha-exclude="">redirections </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/cormorant.jpg" alt="Image unrelated to post. A cormorant, a type of black waterfowl, poses with wings spread on a buoy in Puget Sound. Off to the left, another bird floats." loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/angle-brackets-uwu.jpg" alt="Ascii art of an emoticon with pinched eyes and a small mouth made with two angle brackets." loading="lazy" decoding="async" width="1000" height="316">
</a>
</li>
<li class="post">
<a class="postlink" href="/textures-unite/">
<h2 data-ha-exclude="" id="textures-unite">textures unite </h2>
<a class="postlink" href="/kestrel-zine/">
<h2 data-ha-exclude="">kestrel zine </h2>
<ul class="postlist-tags">
<li>knit</li>
<li>print</li>
<li>zine</li>
<li>highlight</li>
</ul>
<img src="/img/textures-unite.jpg" alt="a largely unseen person holds up an expansive knitted shawl, built in 6 sections of different textures and colors. in the background, trees and dappled sunlight." loading="lazy" decoding="async" width="1000" height="1334">
<img src="/img/kestrel-zine.jpg" alt="A 5 photo collage showing the front and back cover as well as 3 full spreads of a folded zine about Kestrel, my dog, who is a 65lb Malinois with a goofy smile and floppy ears. it is printed in two layers of color, blue and orange, and each image depicts Kestrel in various posts... alert and watchful, resting, looking mopey, wearing a sweatshirt." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
@@ -2298,6 +2444,6 @@ footer a[aria-current="page"]::after</span> <span class="token punctuation">{</s
</footer>
<!-- This page `/core-css/` was built on 2026-09-20T00:40:39.766Z -->
<!-- This page `/core-css/` was built on 2026-09-20T22:08:14.588Z -->
</body>
</html>
crow/index.html
+29 -22
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="crow">crow</h1>
<h1>crow</h1>
<div class="post-metadata">
<p>
@@ -1881,49 +1882,55 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/loon/">
<h2 data-ha-exclude="" id="loon">loon </h2>
<a class="postlink" href="/luminescent/">
<h2 data-ha-exclude="">luminescent (mature)</h2>
<ul class="postlist-tags">
<li>print</li>
<li>gender</li>
</ul>
<img src="/img/loon-print.jpg" alt="A print of a loon rearing up with wings spread" loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
</a>
</li>
<li class="post">
<a class="postlink" href="/chanterelle/">
<h2 data-ha-exclude="" id="chanterelle">chanterelle </h2>
<a class="postlink" href="/rope-one/">
<h2 data-ha-exclude="">rope (one) (mature)</h2>
<ul class="postlist-tags">
<li>print</li>
<li>gender</li>
</ul>
<img src="/img/rope-print-1.jpg" alt="A print of a nude trans woman in an asymmetrical rope harness." class="blur" loading="lazy" decoding="async" width="1000" height="1242">
</a>
</li>
<li class="post">
<a class="postlink" href="/greeting-loons/">
<h2 data-ha-exclude="">greeting loons </h2>
<ul class="postlist-tags">
<li>card</li>
</ul>
<img src="/img/chanterelle-print.jpg" alt="A print of two chanterelle mushrooms inked in a dark-to-light yellow gradient." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
<li class="post">
<a class="postlink" href="/tiny-portraits/">
<h2 data-ha-exclude="" id="tiny-portraits">tiny portraits </h2>
<ul class="postlist-tags">
<li>print</li>
<li>highlight</li>
</ul>
<img src="/img/tiny-portrait-stamps.jpg" alt="A collage showing various small (around an inch) stamps that depict people or animals." loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/greeting-loons.jpg" alt="A pile of hand-printed A2 size greeting cards. A loon rearing up with outstretched wings spans the front and back of the cards." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1980,6 +1987,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/crow/` was built on 2026-09-20T00:40:39.765Z -->
<!-- This page `/crow/` was built on 2026-09-20T22:08:14.568Z -->
</body>
</html>
designing-a-bag/index.html
+24 -29
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="designing-a-bag">designing a bag</h1>
<h1>designing a bag</h1>
<div class="post-metadata">
<p>
@@ -1852,7 +1853,7 @@ switch (currentThemeValue) {
<p>the first step in any design is small tests. For leatherwork, this usually means working with paper - cheaper than leather, but with some of the same inflexibility.</p>
<h2 id="build-up-from-basic-facts">build up from basic facts</h2>
<p>my grommets, laid out on paper, spaced out cleanly at 1/2&quot; away from edges and 1&quot; apart. My tablet is ~10&quot;x8&quot;. I started with these facts.</p>
<h2 id="template-template-template">template, template, template</h2>
<h2 id="template%2C-template%2C-template">template, template, template</h2>
<p>don't measure out the same spacing any more than you have to. Templating is your friend for both ease of use and regularity.</p>
<h2 id="mind-the-order-of-your-work">mind the order of your work</h2>
<p>the corners should be stitched before lacing in order to get into tight spaces easily. Grommets are set most easily before the work is 3-dimensional. It's cleanest to cut before grommets are installed so as to work on a smooth and level surface. Hold all this in your mind when choosing your next move, and ensure you don't step on your own toes.</p>
@@ -1898,53 +1899,47 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/azure-locations-and-file-crawling/">
<h2 data-ha-exclude="" id="azure-locations-and-file-crawling">azure locations and file crawling </h2>
<ul class="postlist-tags">
<li>software</li>
<li>highlight</li>
</ul>
<img src="/img/azure-locations.jpg" alt="A Linux terminal. There is a fun rainbow flag in ascii art at the top, and then the user has called a command asking Azure for a list of locations applicable to a specific resource type. The output is lengthy." loading="lazy" decoding="async" width="1000" height="827">
</a>
</li>
<li class="post">
<a class="postlink" href="/rachels-bracelets/">
<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
<a class="postlink" href="/pinatex-wallet-with-zipper/">
<h2 data-ha-exclude="">piñatex wallet with zipper </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/rachel-bracelets.jpg" alt="Two pink leather bracelets with stainless steel hardware and aqua stitching." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/pinatex-ten-pocket-bifold.jpg" alt="A two-picture collage showing the inside and outside of a wallet made with piñatex, a leather alternative made from pineapple leaves. It is two tone blue with a pink accent and has a zippered pocket built in." loading="lazy" decoding="async" width="1000" height="1331">
</a>
</li>
<li class="post">
<a class="postlink" href="/tooled-leather-patches/">
<h2 data-ha-exclude="" id="tooled-leather-patches">tooled leather patches </h2>
<a class="postlink" href="/lobstah/">
<h2 data-ha-exclude="">lobstah </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>gender</li>
</ul>
<img src="/img/lobstah.jpg" alt="Two red leather lobster ornaments, about 4-5 in long each." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/bag-strap/">
<h2 data-ha-exclude="">bag strap </h2>
<ul class="postlist-tags">
<li>patch</li>
<li>leather</li>
</ul>
<img src="/img/pronoun-patch-scroll.jpg" alt="two tooled leather patches. they have scrolls tooled on them that read various pronoun sets." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/bag-strap.jpg" alt="A nylon webbing shoulder strap in bright teal with clips on each end." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -2001,6 +1996,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/designing-a-bag/` was built on 2026-09-20T00:40:39.761Z -->
<!-- This page `/designing-a-bag/` was built on 2026-09-20T22:08:14.543Z -->
</body>
</html>
domain-and-site-setup/index.html
+151 -19
View File
@@ -40,7 +40,80 @@
<style>.post-metadata {
<style>#toc {
float: right;
margin: 1rem 0 1.5rem 1.5rem;
width: min(calc(100% - 1.5rem), 23rem);
/* 23rem is the width of the words 'table of contents' in my header font */
/* yes, it's a bit hacky */
}
@media (max-width: 850px) {
#toc {
float: unset;
margin-top: 2rem;
margin-left: .5rem;
width: calc(100% - .5rem);
}
}
#toc details {
border: thick solid var(--color-pink);
border-radius: 1rem;
margin-top: 1rem;
}
#toc summary {
position: relative;
top: -1.5rem;
left: -.75rem;
width: fit-content;
background: var(--color-bg);
border-radius: .5rem;
}
#toc summary:focus-visible {
outline: .15rem solid var(--color-teal);
}
#toc summary::marker {
font-size: 2.35rem;
}
#toc h2 {
margin-top: 0;
display: inline;
line-height: normal;
}
#toc nav {
position: relative;
top: -1.25rem;
}
#toc li {
margin-block: .45rem 0;
}
@media (max-width: 650px) {
#toc nav > ol {
margin-left: .5rem;
}
}
/* basically we want to style this `ol` as a `ul` */
#toc ol > li {
list-style: disc;
}
#toc ol > li > ol > li {
list-style: circle;
}
#toc ol > li > ol > li > ol > li {
list-style: square;
}
.post-metadata {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
@@ -438,6 +511,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +571,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1888,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="domain-and-site-setup">domain and site setup</h1>
<h1>domain and site setup</h1>
<div class="post-metadata">
<p>
@@ -1843,7 +1917,64 @@ switch (currentThemeValue) {
<img class="hero" src="/img/crinkly-mushrooms.jpg" alt="Picture unrelated to post. Some crinkly brown-orange mushrooms in vibrant green grass." loading="lazy" decoding="async" width="1000" height="750">
<p>This was written as a skill share for the Artisans Cooperative blog.</p>
<aside id="toc">
<details>
<summary><h2>table of contents</h2></summary>
<nav class="toc">
<ol>
<li><a href="#audience">Audience</a>
</li>
<li><a href="#outcome">Outcome</a>
</li>
<li><a href="#domain-name">Domain name</a>
<ol>
<li><a href="#top-level-domains-(tlds)">Top-level domains (TLDs)</a>
</li>
<li><a href="#decide-on-a-full-domain-name">Decide on a full domain name</a>
</li>
<li><a href="#buy-your-domain">Buy your domain</a>
</li>
</ol>
</li>
<li><a href="#using-your-domain-name">Using your domain name</a>
<ol>
<li><a href="#option-1%3A-simple-redirect">Option 1: simple redirect</a>
</li>
<li><a href="#option-1%2C-but-better%3A-redirect-to-a-link-tree">Option 1, but better: redirect to a link tree</a>
</li>
<li><a href="#option-2%3A-static-site-with-github-pages">Option 2: static site with GitHub Pages</a>
<ol>
<li><a href="#wait%2C-what's-github%3F">Wait, what's GitHub?</a>
</li>
</ol>
</li>
<li><a href="#now-that-we-know-what-github-is...">Now that we know what GitHub is...</a>
</li>
</ol>
</li>
</ol>
</nav>
</details>
</aside>
<p>This was written as a skill share for the Artisans Cooperative blog.</p>
<p>In this writeup, I will walk through one (of many!) ways to set up and utilize a custom domain and website.</p>
<h2 id="audience">Audience</h2>
<p>This is aimed at a non-technical audience, but my own perspective is technical and some of the articles I link to will get technical. Because of this, it's possible that I will miss things that you have questions on - please reach out to me and ask questions!</p>
@@ -1855,7 +1986,7 @@ switch (currentThemeValue) {
</ul>
<p>This writeup will <em>not</em> cover every possible route to getting your own home on the web - there's far too many options out there. It's just meant to give you a starting point and a few ideas.</p>
<h2 id="domain-name">Domain name</h2>
<h3 id="top-level-domains-tlds">Top-level domains (TLDs)</h3>
<h3 id="top-level-domains-(tlds)">Top-level domains (TLDs)</h3>
<p>I started planning my domain name by reviewing the list of TLDs - things like &quot;.org&quot; or &quot;.com&quot;. ICANN (the Internet Corporation for Assigned Names and Numbers) maintains a <a href="https://www.icann.org/resources/pages/tlds-2012-02-25-en" target="_blank" rel="external">list of all TLDs</a> - it's long! Reviewing this list can help you think of potential domain names. You can also look at a list like <a href="https://en.wikipedia.org/wiki/List_of_Internet_top-level_domains" target="_blank" rel="external">this one Wikipedia maintains</a> - it has more detail and can tell you if a specific TLD is for a given country, reserved for specific uses, or (what you probably want) for general use.</p>
<p>Personally, I narrowed it down to two - &quot;.art&quot; or &quot;.gay&quot;. From there, it's off to the domain registrars! These are companies that offer domain names for sale. Here's <a href="https://www.forbes.com/advisor/business/software/best-domain-registrar/" target="_blank" rel="external">an article from Forbes Advisor reviewing some of the major names in the space</a>. I use Namecheap, but don't let that bias you. Look around at pricing (pay attention to the rate for year 2 onward - domain registrars often offer super low year 1 rates to hook customers) and consider other features, like support availability.</p>
<h3 id="decide-on-a-full-domain-name">Decide on a full domain name</h3>
@@ -1869,17 +2000,17 @@ switch (currentThemeValue) {
<h3 id="buy-your-domain">Buy your domain</h3>
<p>Pick a domain registrar that offers the domain name you want, and pay (usually for a year). Next, we'll talk about some uses for this domain name.</p>
<h2 id="using-your-domain-name">Using your domain name</h2>
<h3 id="option-1-simple-redirect">Option 1: simple redirect</h3>
<h3 id="option-1%3A-simple-redirect">Option 1: simple redirect</h3>
<p>The easiest way to utilize a domain name is to have it redirect to another URL. I'm not going to go through how to set up a domain redirect with every possible provider, but if you search up &quot;[your domain registrar] redirect&quot; you should find useful documentation.</p>
<h3 id="option-1-but-better-redirect-to-a-link-tree">Option 1, but better: redirect to a link tree</h3>
<h3 id="option-1%2C-but-better%3A-redirect-to-a-link-tree">Option 1, but better: redirect to a link tree</h3>
<p>Link trees (popularized by <a href="https://linktr.ee/" target="_blank" rel="external">linktree</a>) are a single page with a collection of links maintained by an owner. You can use linktree or check out this <a href="https://www.wired.com/story/link-in-bio-linktree-alternatives/" target="_blank" rel="external">WIRED article with alternatives</a>. Some are paid, usually small monthly fees, and some are free.</p>
<h3 id="option-2-static-site-with-github-pages">Option 2: static site with GitHub Pages</h3>
<h4 id="wait-whats-github">Wait, what's GitHub?</h4>
<h3 id="option-2%3A-static-site-with-github-pages">Option 2: static site with GitHub Pages</h3>
<h4 id="wait%2C-what's-github%3F">Wait, what's GitHub?</h4>
<p><a href="https://github.com/" target="_blank" rel="external">GitHub</a> - wait, no.</p>
<p>First, let's talk about <a href="https://git-scm.com/" target="_blank" rel="external">git</a>. Git is a <em>version control system</em>, a type of software that manages changes to a set of files. This allows the owner(s) of those files to do things like revert changes or compare current and historical versions of files. It also allows for multiple people to work on the same shared file repository without creating conflicts.</p>
<p>GitHub is a centralized source for many, many git repositories. It essentially allows you to back up both your code and the log of all changes to the cloud (someone else's computer). It also supports <a href="https://pages.github.com/" target="_blank" rel="external">GitHub Pages</a>, a free way to host a static site of your own.</p>
<p>To get started with GitHub, you'll first need to <a href="https://github.com/signup" target="_blank" rel="external">create an account</a> if you don't have one. If you want to learn some GitHub basics, the GitHub team has created this handy <a href="https://github.com/skills/introduction-to-github" target="_blank" rel="external">introduction to GitHub</a> that walks you through some basic git and GitHub concepts.</p>
<h3 id="now-that-we-know-what-github-is">Now that we know what GitHub is...</h3>
<h3 id="now-that-we-know-what-github-is...">Now that we know what GitHub is...</h3>
<p>The GitHub documentation is pretty thorough, so let's point to some articles over there.</p>
<ul>
<li><a href="https://docs.github.com/en/pages/getting-started-with-github-pages/creating-a-github-pages-site" target="_blank" rel="external">Creating a GitHub Pages site</a> walks you through getting a repository set up and automatically publishing to a URL like &quot;your-github-username.github.io&quot; (don't worry, we'll get that custom domain name attached soon!)
@@ -1896,6 +2027,7 @@ switch (currentThemeValue) {
<li>GitHub Pages is powered by <a href="https://jekyllrb.com/" target="_blank" rel="external">Jekyll</a>, a tool for generating static sites from Markdown (.md) files. <a href="https://jekyllrb.com/docs/structure/" target="_blank" rel="external">Learn more about a Jekyll project's file directory structure</a></li>
</ul>
</article>
@@ -1933,26 +2065,26 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/accessible-image-modals/">
<h2 data-ha-exclude="" id="accessible-image-modals">accessible image modals </h2>
<a class="postlink" href="/handedness-toggle/">
<h2 data-ha-exclude="">handedness toggle </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/snacking-seagull.jpg" alt="Image unrelated to post. A seagull floating in the water with a starfish hanging out of eir mouth." loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/handedness-toggle-0.png" alt="A screenshot of the rescue trans rescue navbar centered on a button that shows a hand pointing left." loading="lazy" decoding="async" width="1000" height="257">
</a>
</li>
<li class="post">
<a class="postlink" href="/visual-site-builders-and-accessibility/">
<h2 data-ha-exclude="" id="visual-site-builders-and-accessibility">visual site builders and accessibility </h2>
<h2 data-ha-exclude="">visual site builders and accessibility </h2>
<ul class="postlist-tags">
@@ -1965,15 +2097,15 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/moving-images/">
<h2 data-ha-exclude="" id="moving-images">moving images </h2>
<a class="postlink" href="/comparing-text-editors/">
<h2 data-ha-exclude="">comparing text editors </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/cormorant.jpg" alt="Image unrelated to post. A cormorant, a type of black waterfowl, poses with wings spread on a buoy in Puget Sound. Off to the left, another bird floats." loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/horsetail.jpg" alt="Image unrelated to post. Close up on a horsetail plant&#39;s stem, with many small needle-like leaves emerging from all sides of the circular stem at each segmented joint." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
@@ -2030,6 +2162,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/domain-and-site-setup/` was built on 2026-09-20T00:40:39.726Z -->
<!-- This page `/domain-and-site-setup/` was built on 2026-09-20T22:08:14.587Z -->
</body>
</html>
double-bill-pocket-bifold/index.html
+16 -13
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="double-bill-pocket-bifold">double bill pocket bifold</h1>
<h1>double bill pocket bifold</h1>
<div class="post-metadata">
<p>
@@ -1882,47 +1883,49 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/makers-mark-keychain/">
<h2 data-ha-exclude="" id="makers-mark-keychain">maker&#39;s mark keychain </h2>
<a class="postlink" href="/fishhook-pride-keychains/">
<h2 data-ha-exclude="">fishhook pride keychains </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>gender</li>
</ul>
<img src="/img/makers-mark-keychain.jpg" alt="A keychain on an iridescent rainbow split ring. It is dark brown/grey leather and has LEE CAT ART stamped into it." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/fishhook-keychain-nonbinary.jpg" alt="a keychain with an iridescent fishhook style attachment linked via leather to an iridescent keyring. the leather is stitched with nonbinary flag colors." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/moss-harness/">
<h2 data-ha-exclude="" id="moss-harness">moss harness </h2>
<a class="postlink" href="/leather-lighter-case/">
<h2 data-ha-exclude="">leather lighter case </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/moss-harness.jpg" alt="A nylon webbing harness in bright teal laid out on a desk." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/leather-lighter-case.jpg" alt="A bic lighter wrapped in leather and hand-stitched up one side." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/zipper-bifold-green/">
<h2 data-ha-exclude="" id="zipper-bifold-green">zipper bifold (green) </h2>
<a class="postlink" href="/sunflower/">
<h2 data-ha-exclude="">sunflower </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/zipper-bifold-green.jpg" alt="A collage showing a green leather wallet with a zippered pocket built into one external side." loading="lazy" decoding="async" width="1000" height="1332">
<img src="/img/sunflower.jpg" alt="A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1979,6 +1982,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/double-bill-pocket-bifold/` was built on 2026-09-20T00:40:39.725Z -->
<!-- This page `/double-bill-pocket-bifold/` was built on 2026-09-20T22:08:14.563Z -->
</body>
</html>
dragon-mask/index.html
+25 -24
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="dragon-mask">dragon mask</h1>
<h1>dragon mask</h1>
<div class="post-metadata">
<p>
@@ -1887,28 +1888,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/fishhook-pride-keychains/">
<h2 data-ha-exclude="" id="fishhook-pride-keychains">fishhook pride keychains </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>gender</li>
</ul>
<img src="/img/fishhook-keychain-nonbinary.jpg" alt="a keychain with an iridescent fishhook style attachment linked via leather to an iridescent keyring. the leather is stitched with nonbinary flag colors." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/nine-pocket-bifold/">
<h2 data-ha-exclude="" id="nine-pocket-bifold">nine pocket bifold </h2>
<h2 data-ha-exclude="">nine pocket bifold </h2>
<ul class="postlist-tags">
@@ -1921,15 +1906,31 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/leather-chest-harness/">
<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
<a class="postlink" href="/little-critter-pouch/">
<h2 data-ha-exclude="">little critter pouch </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>highlight</li>
</ul>
<img src="/img/little-critter-pouch.jpg" alt="A leather pouch shaped a bit like a d10 but with eight sides. It has a rainbow zippered opening and a wristlet strap." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/leather-keychains/">
<h2 data-ha-exclude="">leather keychains </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/leather-chest-harness.jpg" alt="Someone from chin to mid-torso, wearing a dark teal leather chest harness with matte black fittings over a t shirt." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/leather-keychains.jpg" alt="A picture of multiple leather keychains sitting on a wood table. Many of them are simple rectangle shapes with stitching around the edge; a few are odd wavy or geometric shapes. A few say things like &#39;MOM&#39; or &#39;EGG&#39;." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
@@ -1986,6 +1987,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/dragon-mask/` was built on 2026-09-20T00:40:39.762Z -->
<!-- This page `/dragon-mask/` was built on 2026-09-20T22:08:14.543Z -->
</body>
</html>
dyeing-fiber/index.html
+14 -13
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="dyeing-fiber">dyeing fiber</h1>
<h1>dyeing fiber</h1>
<div class="post-metadata">
<p>
@@ -1882,47 +1883,47 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/charlie-the-alpaca-handspun/">
<h2 data-ha-exclude="" id="charlie-the-alpaca-handspun">charlie the alpaca handspun </h2>
<a class="postlink" href="/petrichor-handspun/">
<h2 data-ha-exclude="">petrichor handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/charlie-alpaca-handspun.jpg" alt="one large skein (and technically a smaller skein hidden behind it) of sheen-y black alpaca handspun, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/petrichor-handspun.jpg" alt="3 skeins of handspun yarn, 2 large and 1 small. the large ones are a rich earth-tone blend of reds, pinks, browns, and hints of green and gold. the smaller skein is similar but with a decidedly greener hue" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
<a class="postlink" href="/hand-dyed-gold-handspun/">
<h2 data-ha-exclude="">hand-dyed gold handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/handspun0.jpg" alt="4 skeins of handspun yarn, two in a somewhat pastel multicolor and two in a blend of orange, gold, and white." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/gold-handspun.jpg" alt="3 skeins, one small and two large, of a rich golden-orange handspun with light tonal effects, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/light-grey-jacobs-handspun/">
<h2 data-ha-exclude="" id="light-grey-jacobs-handspun">light grey jacobs handspun </h2>
<a class="postlink" href="/icelandic-lamb-handspun/">
<h2 data-ha-exclude="">icelandic lamb handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/light-grey-jacobs.jpg" alt="a skein of light grey handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/icelandic-lamb.jpg" alt="a skein of black handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
@@ -1979,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/dyeing-fiber/` was built on 2026-09-20T00:40:39.764Z -->
<!-- This page `/dyeing-fiber/` was built on 2026-09-20T22:08:14.567Z -->
</body>
</html>
ecommerce-options/index.html
+4 -3
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="ecommerce-options">ecommerce options</h1>
<h1>ecommerce options</h1>
<div class="post-metadata">
<p>
@@ -1961,6 +1962,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/ecommerce-options/` was built on 2026-09-20T00:40:39.724Z -->
<!-- This page `/ecommerce-options/` was built on 2026-09-20T22:08:14.562Z -->
</body>
</html>
eight-pocket-bifold/index.html
+34 -33
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="eight-pocket-bifold">eight pocket bifold</h1>
<h1>eight pocket bifold</h1>
<div class="post-metadata">
<p>
@@ -1882,40 +1883,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/nine-pocket-bifold/">
<h2 data-ha-exclude="" id="nine-pocket-bifold">nine pocket bifold </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/nine-pocket-bifold.jpg" alt="A hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a symmetrical interior with a hidden pocket and 3 card pockets on each side." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/moss-harness/">
<h2 data-ha-exclude="" id="moss-harness">moss harness </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/moss-harness.jpg" alt="A nylon webbing harness in bright teal laid out on a desk." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/rachels-bracelets/">
<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
<h2 data-ha-exclude="">rachel&#39;s bracelets </h2>
<ul class="postlist-tags">
@@ -1927,6 +1900,34 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/pinatex-wallet-with-zipper/">
<h2 data-ha-exclude="">piñatex wallet with zipper </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/pinatex-ten-pocket-bifold.jpg" alt="A two-picture collage showing the inside and outside of a wallet made with piñatex, a leather alternative made from pineapple leaves. It is two tone blue with a pink accent and has a zippered pocket built in." loading="lazy" decoding="async" width="1000" height="1331">
</a>
</li>
<li class="post">
<a class="postlink" href="/zipper-bifold/">
<h2 data-ha-exclude="">zipper bifold </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/zipper-bifold.jpg" alt="A collage showing a hand-stitched leather bifold with a zippered coin pocket on one exterior side." loading="lazy" decoding="async" width="1000" height="1777">
</a>
</li>
</ol>
</section>
@@ -1979,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/eight-pocket-bifold/` was built on 2026-09-20T00:40:39.725Z -->
<!-- This page `/eight-pocket-bifold/` was built on 2026-09-20T22:08:14.563Z -->
</body>
</html>
eleventy-lessons/index.html
+207 -32
View File
@@ -40,7 +40,80 @@
<style>.post-metadata {
<style>#toc {
float: right;
margin: 1rem 0 1.5rem 1.5rem;
width: min(calc(100% - 1.5rem), 23rem);
/* 23rem is the width of the words 'table of contents' in my header font */
/* yes, it's a bit hacky */
}
@media (max-width: 850px) {
#toc {
float: unset;
margin-top: 2rem;
margin-left: .5rem;
width: calc(100% - .5rem);
}
}
#toc details {
border: thick solid var(--color-pink);
border-radius: 1rem;
margin-top: 1rem;
}
#toc summary {
position: relative;
top: -1.5rem;
left: -.75rem;
width: fit-content;
background: var(--color-bg);
border-radius: .5rem;
}
#toc summary:focus-visible {
outline: .15rem solid var(--color-teal);
}
#toc summary::marker {
font-size: 2.35rem;
}
#toc h2 {
margin-top: 0;
display: inline;
line-height: normal;
}
#toc nav {
position: relative;
top: -1.25rem;
}
#toc li {
margin-block: .45rem 0;
}
@media (max-width: 650px) {
#toc nav > ol {
margin-left: .5rem;
}
}
/* basically we want to style this `ol` as a `ul` */
#toc ol > li {
list-style: disc;
}
#toc ol > li > ol > li {
list-style: circle;
}
#toc ol > li > ol > li > ol > li {
list-style: square;
}
.post-metadata {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
@@ -438,6 +511,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +571,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1888,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="eleventy-lessons">eleventy lessons</h1>
<h1>eleventy lessons</h1>
<div class="post-metadata">
<p>
@@ -1843,7 +1917,109 @@ switch (currentThemeValue) {
<img class="hero" src="/img/hellebore.jpg" alt="Image unrelated to post. Close up on a pale green hellebore flower." loading="lazy" decoding="async" width="1000" height="666">
<p>recently I wrote <em>several</em> sites using <a href="https://www.11ty.dev/" target="_blank" rel="external">Eleventy</a> (4? 5?). Including, over the past few days, rewriting this one! That's right, if you're reading this, we're now running on 11ty and hosted by <a href="https://heckin.technology/" target="_blank" rel="external">heckin.technology</a>. See ya, GitHub. Won't miss ya.</p>
<aside id="toc">
<details>
<summary><h2>table of contents</h2></summary>
<nav class="toc">
<ol>
<li><a href="#related-posts">related posts</a>
<ol>
<li><a href="#filters.js">filters.js</a>
</li>
<li><a href="#post.njk">post.njk</a>
</li>
</ol>
</li>
<li><a href="#featured-images">featured images</a>
<ol>
<li><a href="#file-structure">file structure</a>
</li>
<li><a href="#front-matter">front matter</a>
</li>
<li><a href="#image-html-transform">image HTML transform</a>
</li>
<li><a href="#passthrough-copy">passthrough copy</a>
</li>
<li><a href="#templating">templating</a>
</li>
<li><a href="#home-page-and-related-posts">home page and related posts</a>
</li>
<li><a href="#post-body">post body</a>
</li>
</ol>
</li>
<li><a href="#pagination">pagination</a>
<ol>
<li><a href="#simple-pagination">simple pagination</a>
<ol>
<li><a href="#pagination.njk">pagination.njk</a>
</li>
<li><a href="#calling-the-template">calling the template</a>
</li>
</ol>
</li>
<li><a href="#complex-pagination">complex pagination</a>
<ol>
<li><a href="#eleventy.config.js">eleventy.config.js</a>
</li>
<li><a href="#tag-pages.njk">tag-pages.njk</a>
</li>
<li><a href="#filters.js-(again)">filters.js (again)</a>
</li>
</ol>
</li>
</ol>
</li>
<li><a href="#tag-image-preview">tag image preview</a>
<ol>
<li><a href="#preview-the-first-featured-image">preview the first featured image</a>
</li>
<li><a href="#preview-a-collage-of-recent-featured-images">preview a collage of recent featured images</a>
<ol>
<li><a href="#handling-multiple-aspect-ratios">handling multiple aspect ratios</a>
</li>
</ol>
</li>
</ol>
</li>
</ol>
</nav>
</details>
</aside>
<p>recently I wrote <em>several</em> sites using <a href="https://www.11ty.dev/" target="_blank" rel="external">Eleventy</a> (4? 5?). Including, over the past few days, rewriting this one! That's right, if you're reading this, we're now running on 11ty and hosted by <a href="https://heckin.technology/" target="_blank" rel="external">heckin.technology</a>. See ya, GitHub. Won't miss ya.</p>
<p>Originally, I compiled some of the things I've learned in a standalone site.</p>
<p>however, since I don't know how much I'll focus on that specific site - it is mostly a sample - I am re-publishing the most useful information here. I'll skip the intro to Markdown content. I'm also going to update them where I've learned more or to better match what's represented on this site.</p>
<p>this will comprise of 4 parts: <a href="#related-posts">related posts</a>, <a href="#featured-images">featured images</a>, <a href="#pagination">pagination</a>, and <a href="#tag-image-preview">tag image preview</a>. Feel free to jump ahead, as none depend on the others.</p>
@@ -1858,7 +2034,7 @@ switch (currentThemeValue) {
<li>I wanted to randomly add a few posts instead of just getting whatever was first (with a shared tag) in the post order</li>
<li>I wanted to exclude the posts that I could reach with between-post pagination</li>
</ol>
<h3 id="filters-js">filters.js</h3>
<h3 id="filters.js">filters.js</h3>
<p>after adjusting for those needs, I had the following in <code>filters.js</code>:</p>
<pre class="language-js"><code class="language-js">eleventyConfig<span class="token punctuation">.</span><span class="token function">addFilter</span><span class="token punctuation">(</span><span class="token string">"excludeFromCollection"</span><span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">collection<span class="token operator">=</span><span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">,</span> urls<span class="token operator">=</span><span class="token punctuation">[</span><span class="token keyword">this</span><span class="token punctuation">.</span>ctx<span class="token punctuation">.</span>page<span class="token punctuation">.</span>url<span class="token punctuation">]</span></span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token keyword">return</span> collection<span class="token punctuation">.</span><span class="token function">filter</span><span class="token punctuation">(</span><span class="token parameter">post</span> <span class="token operator">=></span> urls<span class="token punctuation">.</span><span class="token function">indexOf</span><span class="token punctuation">(</span>post<span class="token punctuation">.</span>url<span class="token punctuation">)</span> <span class="token operator">===</span> <span class="token operator">-</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
@@ -1882,7 +2058,7 @@ eleventyConfig<span class="token punctuation">.</span><span class="token functio
<span class="token keyword">return</span> shuffledArray<span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre>
<h3 id="post-njk">post.njk</h3>
<h3 id="post.njk">post.njk</h3>
<p>I used this in my post layout. <code>filterTagList</code> comes with the base blog by default, and removes the tags &quot;posts&quot; and &quot;all.&quot; <code>head</code> also comes with the base blog. <code>postlist.njk</code> is my modified-from-the-base-blog post layout.</p>
<pre class="language-html"><code class="language-html">{% set relevantTags = tags | filterTagList %}
@@ -1981,7 +2157,7 @@ pagination:
</code></pre>
<p>6 posts per page, paginate data from <code>collections.posts</code> which we'll call just <code>posts</code> for short, and do it in reverse (aka, most recent posts show first).</p>
<p><a href="https://www.11ty.dev/docs/pagination/nav" target="_blank" rel="external">You'll also likely want previous and next buttons</a>. I did. Here's what I have...</p>
<h4 id="pagination-njk">pagination.njk</h4>
<h4 id="pagination.njk">pagination.njk</h4>
<p>There's two components to this, the bigger one being this <code>pagination.njk</code> template. Look, I like my little icons, ok? It takes an <code>olderHref</code> and a <code>newerHref</code>, and optionally an <code>olderTitle</code> and <code>newerTitle</code>.</p>
<pre class="language-html"><code class="language-html">{% if olderHref or newerHref %}
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>nav</span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>pagination<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
@@ -2016,7 +2192,7 @@ pagination:
<h3 id="complex-pagination">complex pagination</h3>
<p>however, there's a catch. <a href="https://www.11ty.dev/docs/quicktips/tag-pages/" target="_blank" rel="external">Tag pages are <em>created</em> via pagination</a>! It's a lot harder to paginate those - you can't just use the front matter to set it up.</p>
<p>I untangled <a href="https://github.com/11ty/eleventy/issues/332#issuecomment-445236776" target="_blank" rel="external">this GitHub issue about double-layered pagination</a> and came to the following solution...</p>
<h4 id="eleventy-config-js">eleventy.config.js</h4>
<h4 id="eleventy.config.js">eleventy.config.js</h4>
<p>in <code>eleventy.config.js</code>:</p>
<pre class="language-js"><code class="language-js"><span class="token comment">// note that this uses the lodash.chunk method, so you’ll have to import that</span>
eleventyConfig<span class="token punctuation">.</span><span class="token function">addCollection</span><span class="token punctuation">(</span><span class="token string">"tagPagination"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">collection</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
@@ -2046,7 +2222,7 @@ eleventyConfig<span class="token punctuation">.</span><span class="token functio
<span class="token keyword">return</span> tagMap<span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre>
<h4 id="tag-pages-njk">tag-pages.njk</h4>
<h4 id="tag-pages.njk">tag-pages.njk</h4>
<p>in my <code>tag-pages.njk</code> file (or whatever you use to template out your tag pages):</p>
<pre class="language-html"><code class="language-html">---
pagination:
@@ -2072,7 +2248,7 @@ eleventyExcludeFromCollections: true
{% endif %}
{% include "pagination.njk" %}</code></pre>
<p>note the pagination checking <code>tag.pageNumber</code> against <code>tag.PageSize</code> - the <a href="https://github.com/11ty/eleventy/issues/332#issuecomment-445236776" target="_blank" rel="external">original suggested solution</a> in the GitHub post creates an issue where the pagination loops through <em>all</em> of the tag pages bit-by-bit. This sorts that - hat tip to <a href="https://github.com/11ty/eleventy/issues/332#issuecomment-1248185406" target="_blank" rel="external">TheReyzar who mentioned the issue and showed part of their solution</a>.</p>
<h4 id="filters-js-again">filters.js (again)</h4>
<h4 id="filters.js-(again)">filters.js (again)</h4>
<p>finally, in my <code>filters.js</code> file, I add the <code>tagPagination</code> tag to the tags that get filtered using <code>filterTagList</code>:</p>
<pre class="language-js"><code class="language-js">eleventyConfig<span class="token punctuation">.</span><span class="token function">addFilter</span><span class="token punctuation">(</span><span class="token string">"filterTagList"</span><span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token function">filterTagList</span><span class="token punctuation">(</span><span class="token parameter">tags</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token keyword">return</span> <span class="token punctuation">(</span>tags <span class="token operator">||</span> <span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">filter</span><span class="token punctuation">(</span><span class="token parameter">tag</span> <span class="token operator">=></span> <span class="token punctuation">[</span><span class="token string">"all"</span><span class="token punctuation">,</span> <span class="token string">"posts"</span><span class="token punctuation">,</span> <span class="token string">"tagPagination"</span><span class="token punctuation">]</span><span class="token punctuation">.</span><span class="token function">indexOf</span><span class="token punctuation">(</span>tag<span class="token punctuation">)</span> <span class="token operator">===</span> <span class="token operator">-</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
@@ -2136,6 +2312,7 @@ eleventyExcludeFromCollections: true
<hr>
<p>There's the good stuff from <a href="https://inherentlee.codeberg.page/lessons/" target="_blank" rel="external">11ty Lessons</a>. Hope you enjoyed.</p>
</article>
@@ -2173,12 +2350,26 @@ eleventyExcludeFromCollections: true
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts-2">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/intro-to-wireframing/">
<h2 data-ha-exclude="">intro to wireframing </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
</a>
</li>
<li class="post">
<a class="postlink" href="/visual-site-builders-and-accessibility/">
<h2 data-ha-exclude="" id="visual-site-builders-and-accessibility">visual site builders and accessibility </h2>
<h2 data-ha-exclude="">visual site builders and accessibility </h2>
<ul class="postlist-tags">
@@ -2191,31 +2382,15 @@ eleventyExcludeFromCollections: true
</li>
<li class="post">
<a class="postlink" href="/azure-locations-and-file-crawling/">
<h2 data-ha-exclude="" id="azure-locations-and-file-crawling">azure locations and file crawling </h2>
<ul class="postlist-tags">
<li>software</li>
<li>highlight</li>
</ul>
<img src="/img/azure-locations.jpg" alt="A Linux terminal. There is a fun rainbow flag in ascii art at the top, and then the user has called a command asking Azure for a list of locations applicable to a specific resource type. The output is lengthy." loading="lazy" decoding="async" width="1000" height="827">
</a>
</li>
<li class="post">
<a class="postlink" href="/intro-to-wireframing/">
<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
<a class="postlink" href="/backend-accessibility/">
<h2 data-ha-exclude="">backend accessibility </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/aggregator-wireframes.jpg" alt="a figma page with 4 major sections titled aggregator, aggregator mobile, aggregator color, and aggregator mobile color. each section has 7 pages in it - all sections pretty clearly have the same 7 pages, with the mobile sections shown on mobile screens and the color sections in a rainbow of pastels rather than grayscale." loading="lazy" decoding="async" width="1000" height="1042">
<img src="/img/camelCase-print.jpg" alt="A carved stamp next to its print. The print reads &#39;#camelCase&#39; in a slightly formal-looking italic font." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -2272,6 +2447,6 @@ eleventyExcludeFromCollections: true
</footer>
<!-- This page `/eleventy-lessons/` was built on 2026-09-20T00:40:39.765Z -->
<!-- This page `/eleventy-lessons/` was built on 2026-09-20T22:08:14.587Z -->
</body>
</html>
euphorbia/index.html
+17 -20
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="euphorbia">euphorbia</h1>
<h1>euphorbia</h1>
<div class="post-metadata">
<p>
@@ -1882,57 +1883,53 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/congrats-on-the-gay/">
<h2 data-ha-exclude="" id="congrats-on-the-gay">congrats on the gay </h2>
<a class="postlink" href="/kestrel-zine/">
<h2 data-ha-exclude="">kestrel zine </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>zine</li>
<li>gender</li>
<li>highlight</li>
</ul>
<img src="/img/congrats-on-the-gay.jpg" alt="A greeting card reading, in black. &#39;Congrats on the,&#39; and then, in rainbow, &#39;Gay!&#39;" loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/kestrel-zine.jpg" alt="A 5 photo collage showing the front and back cover as well as 3 full spreads of a folded zine about Kestrel, my dog, who is a 65lb Malinois with a goofy smile and floppy ears. it is printed in two layers of color, blue and orange, and each image depicts Kestrel in various posts... alert and watchful, resting, looking mopey, wearing a sweatshirt." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/killdeer/">
<h2 data-ha-exclude="" id="killdeer">killdeer </h2>
<a class="postlink" href="/luminescent/">
<h2 data-ha-exclude="">luminescent (mature)</h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>gender</li>
</ul>
<img src="/img/killdeer-print.jpg" alt="A print of a killdeer in black ink." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/luminescent-print.jpg" alt="A print of a tattooed woman in bright highlighter yellow underwear." class="blur" loading="lazy" decoding="async" width="900" height="1200">
</a>
</li>
<li class="post">
<a class="postlink" href="/booby-congrats-on-the-top-surgery/">
<h2 data-ha-exclude="" id="booby-congrats-on-the-top-surgery">booby (congrats on the top surgery) </h2>
<a class="postlink" href="/printmaking-paper-notes/">
<h2 data-ha-exclude="">printmaking paper notes </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>gender</li>
</ul>
<img src="/img/booby-card.jpg" alt="A landscape-oriented white card with a two-color print of a blue-footed booby." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/killdeer.jpg" alt="Image unrelated to post. A very fluffed up killdeer stands on a rocky beach." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
@@ -1989,6 +1986,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/euphorbia/` was built on 2026-09-20T00:40:39.739Z -->
<!-- This page `/euphorbia/` was built on 2026-09-20T22:08:14.539Z -->
</body>
</html>
fat-raccoon/index.html
+28 -27
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="fat-raccoon">fat raccoon</h1>
<h1>fat raccoon</h1>
<div class="post-metadata">
<p>
@@ -1899,44 +1900,28 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/coming-out/">
<h2 data-ha-exclude="" id="coming-out">coming out </h2>
<a class="postlink" href="/five-of-them/">
<h2 data-ha-exclude="">five of them </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>gender</li>
</ul>
<img src="/img/coming-out-card-print.jpg" alt="A card and print in the same design - a chick and a broken eggshell, and a simple font reading &#39;congrats on coming out of your shell&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/shirts/">
<h2 data-ha-exclude="" id="shirts">shirts! </h2>
<ul class="postlist-tags">
<li>shirt</li>
</ul>
<img src="/img/shirts.jpg" alt="A row of shirts hanging in front of a window, with a variety of hand-printed designs." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/five-of-them-print.jpg" alt="A block print of five mule deer grazing in a dark green field. The deer are partially negative space and partially brown ink detailing." loading="lazy" decoding="async" width="1000" height="594">
</a>
</li>
<li class="post">
<a class="postlink" href="/booby-congrats-on-the-top-surgery/">
<h2 data-ha-exclude="" id="booby-congrats-on-the-top-surgery">booby (congrats on the top surgery) </h2>
<a class="postlink" href="/hummingbird-become-ungovernable/">
<h2 data-ha-exclude="">hummingbird become ungovernable </h2>
<ul class="postlist-tags">
@@ -1944,10 +1929,26 @@ switch (currentThemeValue) {
<li>card</li>
<li>gender</li>
<li>shirt</li>
</ul>
<img src="/img/booby-card.jpg" alt="A landscape-oriented white card with a two-color print of a blue-footed booby." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/hummingbird-ungovernable-print.jpg" alt="A block print in black and orange ink of a rufous hummingbird, tail flared, hovering in midair. Clutched in eir tiny claws is a banner that waves in the wind and reads &#39;become ungovernable&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/killdeer/">
<h2 data-ha-exclude="">killdeer </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
</ul>
<img src="/img/killdeer-print.jpg" alt="A print of a killdeer in black ink." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
@@ -2004,6 +2005,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/fat-raccoon/` was built on 2026-09-20T00:40:39.715Z -->
<!-- This page `/fat-raccoon/` was built on 2026-09-20T22:08:14.557Z -->
</body>
</html>
fd-signifier-and-oppositional-sexism/index.html
+25 -28
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="fd-signifier-and-oppositional-sexism">fd signifier &amp; oppositional sexism</h1>
<h1>fd signifier &amp; oppositional sexism</h1>
<div class="post-metadata">
<p>
@@ -1916,28 +1917,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/gender-as-a-proxy-variable/">
<h2 data-ha-exclude="" id="gender-as-a-proxy-variable">gender as a proxy variable </h2>
<ul class="postlist-tags">
<li>gender</li>
<li>zine</li>
</ul>
<img src="/img/gender-zine-cover.png" alt="Part of a scan of the cover of my zine, Gender as a Proxy Variable. It shows the title and a bit of handsewn binding." loading="lazy" decoding="async" width="1000" height="444">
</a>
</li>
<li class="post">
<a class="postlink" href="/rope-one/">
<h2 data-ha-exclude="" id="rope-one-mature">rope (one) (mature)</h2>
<h2 data-ha-exclude="">rope (one) (mature)</h2>
<ul class="postlist-tags">
@@ -1952,19 +1937,31 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/slightly-weird-man-club/">
<h2 data-ha-exclude="" id="slightly-weird-man-club">slightly weird man club </h2>
<a class="postlink" href="/gender/">
<h2 data-ha-exclude="">gender? </h2>
<ul class="postlist-tags">
<li>print</li>
<li>shirt</li>
<li>gender</li>
</ul>
<img src="/img/slightly-weird-man-club-print.jpg" alt="A print that reads &#39;slightly weird man club&#39; in a nonbinary flag colored gradient" loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/gender-notes.png" alt="A page of handwritten notes with some loosely drawn charts, described further in the post." loading="lazy" decoding="async" width="865" height="1080">
</a>
</li>
<li class="post">
<a class="postlink" href="/gender-as-a-proxy-variable/">
<h2 data-ha-exclude="">gender as a proxy variable </h2>
<ul class="postlist-tags">
<li>gender</li>
<li>zine</li>
</ul>
<img src="/img/gender-zine-cover.png" alt="Part of a scan of the cover of my zine, Gender as a Proxy Variable. It shows the title and a bit of handsewn binding." loading="lazy" decoding="async" width="1000" height="444">
</a>
</li>
@@ -2021,6 +2018,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/fd-signifier-and-oppositional-sexism/` was built on 2026-09-20T00:40:39.737Z -->
<!-- This page `/fd-signifier-and-oppositional-sexism/` was built on 2026-09-20T22:08:14.538Z -->
</body>
</html>
fedilearns/index.html
+4 -3
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="fedilearns">fediLearns</h1>
<h1>fediLearns</h1>
<div class="post-metadata">
<p>
@@ -1920,6 +1921,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/fedilearns/` was built on 2026-09-20T00:40:39.765Z -->
<!-- This page `/fedilearns/` was built on 2026-09-20T22:08:14.569Z -->
</body>
</html>
fedizinefest-2025/index.html
+23 -22
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="fedizinefest-2025">fediZineFest 2025</h1>
<h1>fediZineFest 2025</h1>
<div class="post-metadata">
<p>
@@ -1882,12 +1883,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/kestrel-zine/">
<h2 data-ha-exclude="" id="kestrel-zine">kestrel zine </h2>
<h2 data-ha-exclude="">kestrel zine </h2>
<ul class="postlist-tags">
@@ -1903,25 +1904,9 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/gender-as-a-proxy-variable/">
<h2 data-ha-exclude="" id="gender-as-a-proxy-variable">gender as a proxy variable </h2>
<ul class="postlist-tags">
<li>gender</li>
<li>zine</li>
</ul>
<img src="/img/gender-zine-cover.png" alt="Part of a scan of the cover of my zine, Gender as a Proxy Variable. It shows the title and a bit of handsewn binding." loading="lazy" decoding="async" width="1000" height="444">
</a>
</li>
<li class="post">
<a class="postlink" href="/on-the-shoulders-of-giants/">
<h2 data-ha-exclude="" id="on-the-shoulders-of-giants">on the shoulders of giants </h2>
<h2 data-ha-exclude="">on the shoulders of giants </h2>
<ul class="postlist-tags">
@@ -1935,6 +1920,22 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/gender-as-a-proxy-variable/">
<h2 data-ha-exclude="">gender as a proxy variable </h2>
<ul class="postlist-tags">
<li>gender</li>
<li>zine</li>
</ul>
<img src="/img/gender-zine-cover.png" alt="Part of a scan of the cover of my zine, Gender as a Proxy Variable. It shows the title and a bit of handsewn binding." loading="lazy" decoding="async" width="1000" height="444">
</a>
</li>
</ol>
</section>
@@ -1987,6 +1988,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/fedizinefest-2025/` was built on 2026-09-20T00:40:39.739Z -->
<!-- This page `/fedizinefest-2025/` was built on 2026-09-20T22:08:14.539Z -->
</body>
</html>
feed.xml
+4 -4
View File
@@ -410,7 +410,7 @@
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;h2 id=&quot;mmm-page&quot;&gt;mmm.page&lt;/h2&gt;
&lt;h2 id=&quot;mmm.page&quot;&gt;mmm.page&lt;/h2&gt;
&lt;p&gt;&lt;a href=&quot;https://mmm.page/&quot; target=&quot;_blank&quot; rel=&quot;external&quot;&gt;mmm.page&lt;/a&gt; is a drag-and-drop builder. The preview doesn&#39;t show you a standalone page (it&#39;s a page that also has the mmm.page login/signup menu bar), so I looked at a few sites to get a sense for how it worked.&lt;/p&gt;
&lt;table&gt;
&lt;thead&gt;
@@ -604,7 +604,7 @@
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;h2 id=&quot;straw-page&quot;&gt;Straw.page&lt;/h2&gt;
&lt;h2 id=&quot;straw.page&quot;&gt;Straw.page&lt;/h2&gt;
&lt;p&gt;&lt;a href=&quot;https://straw.page/&quot; target=&quot;_blank&quot; rel=&quot;external&quot;&gt;Straw.Page&lt;/a&gt; is a drag-and-drop builder that bills itself as mobile-friendly. I looked at one of the offered themes, intentionally choosing one that should have intuitive reading order (spoiler: didn&#39;t matter).&lt;/p&gt;
&lt;table&gt;
&lt;thead&gt;
@@ -652,7 +652,7 @@
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;h2 id=&quot;univer-se&quot;&gt;Univer.se&lt;/h2&gt;
&lt;h2 id=&quot;univer.se&quot;&gt;Univer.se&lt;/h2&gt;
&lt;p&gt;&lt;a href=&quot;https://univer.se/&quot; target=&quot;_blank&quot; rel=&quot;external&quot;&gt;Univer.se&lt;/a&gt; is a drag-and-drop builder with plenty of premade themes. I reviewed a premade theme to get started.&lt;/p&gt;
&lt;table&gt;
&lt;thead&gt;
@@ -999,7 +999,7 @@ a&lt;/span&gt; &lt;span class=&quot;token punctuation&quot;&gt;{&lt;/span&gt;
&lt;span class=&quot;token property&quot;&gt;max-width&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;margin&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; 0 auto&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;h2 id=&quot;headers-footers-navs&quot;&gt;headers, footers, navs&lt;/h2&gt;
&lt;h2 id=&quot;headers%2C-footers%2C-navs&quot;&gt;headers, footers, navs&lt;/h2&gt;
&lt;p&gt;Let&#39;s talk the components that every page likely has - a header, a footer, and navs. I&#39;m going to use a very simple design for our header - a &lt;a href=&quot;https://webaim.org/techniques/skipnav/&quot; target=&quot;_blank&quot; rel=&quot;external&quot;&gt;skip link&lt;/a&gt;, an (optional) site title (the title could also be one of the nav links), and then an unordered list of links enclosed in a &lt;code&gt;nav&lt;/code&gt; element. Like the following:&lt;/p&gt;
&lt;pre class=&quot;language-html&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 punctuation&quot;&gt;&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;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;skip&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&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;#main&lt;span class=&quot;token punctuation&quot;&gt;&quot;&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;&gt;&lt;/span&gt;&lt;/span&gt;Skip to content&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;&gt;&lt;/span&gt;&lt;/span&gt;
feed.xsl
+2 -1
View File
@@ -32,6 +32,8 @@ https://nicolas-hoizey.com/feeds/all.xml
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -90,7 +92,6 @@ https://nicolas-hoizey.com/feeds/all.xml
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
fire-and-ice-handspun/index.html
+34 -33
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="fire-and-ice-handspun">fire &amp; ice handspun</h1>
<h1>fire &amp; ice handspun</h1>
<div class="post-metadata">
<p>
@@ -1882,12 +1883,40 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/icelandic-lamb-handspun/">
<h2 data-ha-exclude="">icelandic lamb handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/icelandic-lamb.jpg" alt="a skein of black handspun yarn" loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/spinning-plants/">
<h2 data-ha-exclude="">spinning plants </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/plant-handspun.jpg" alt="6 small skeins of handspun yarn, each made from a different plant fiber. from top, we have flax (medium brown, rough); what is probably lotus (golden, shiny and soft); banana (white and semi shiny); hemp (light brown, rough); tencel (white and very shiny); ramie (a particularly small skein, white and semi shiny)" loading="lazy" decoding="async" width="1000" height="874">
</a>
</li>
<li class="post">
<a class="postlink" href="/orion-handspun/">
<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
<h2 data-ha-exclude="">orion handspun </h2>
<ul class="postlist-tags">
@@ -1899,34 +1928,6 @@ switch (currentThemeValue) {
</a>
</li>
<li class="post">
<a class="postlink" href="/hand-dyed-gold-handspun/">
<h2 data-ha-exclude="" id="hand-dyed-gold-handspun">hand-dyed gold handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/gold-handspun.jpg" alt="3 skeins, one small and two large, of a rich golden-orange handspun with light tonal effects, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
<li class="post">
<a class="postlink" href="/ruby-the-alpaca-handspun/">
<h2 data-ha-exclude="" id="ruby-the-alpaca-handspun">ruby the alpaca handspun </h2>
<ul class="postlist-tags">
<li>yarn</li>
</ul>
<img src="/img/ruby-alpaca-handspun.jpg" alt="one large skein and two smaller skeins of a rich chocolatey brown alpaca handspun, in about a DK weight" loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
</ol>
</section>
@@ -1979,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/fire-and-ice-handspun/` was built on 2026-09-20T00:40:39.764Z -->
<!-- This page `/fire-and-ice-handspun/` was built on 2026-09-20T22:08:14.567Z -->
</body>
</html>
fishhook-pride-keychains/index.html
+26 -29
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="fishhook-pride-keychains">fishhook pride keychains</h1>
<h1>fishhook pride keychains</h1>
<div class="post-metadata">
<p>
@@ -1887,51 +1888,47 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/networks-of-trans-care/">
<h2 data-ha-exclude="" id="networks-of-trans-care">networks of trans care </h2>
<ul class="postlist-tags">
<li>gender</li>
</ul>
<img src="/img/mushrooms-and-moss.jpg" alt="Image unrelated to post. Close up on a cluster of orange-brown mushrooms on a mossy tree trunk." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/soras-collar/">
<h2 data-ha-exclude="" id="soras-collar">sora&#39;s collar </h2>
<a class="postlink" href="/leather-keychains/">
<h2 data-ha-exclude="">leather keychains </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/sora-collar.jpg" alt="A collage showing a red and black leather dog collar tooled with roses and the name Sora. It&#39;s fully stitched with dark red stitching and has brass hardware." loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/leather-keychains.jpg" alt="A picture of multiple leather keychains sitting on a wood table. Many of them are simple rectangle shapes with stitching around the edge; a few are odd wavy or geometric shapes. A few say things like &#39;MOM&#39; or &#39;EGG&#39;." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
<li class="post">
<a class="postlink" href="/nonbinary-flag/">
<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
<a class="postlink" href="/stephanie-collar/">
<h2 data-ha-exclude="">stephanie collar </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>gender</li>
<li>leather</li>
</ul>
<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/stephanie-collar.jpg" alt="A white woman with a shaved side cut wearing a black leather collar with a large dangling o-ring." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
<li class="post">
<a class="postlink" href="/moss-harness/">
<h2 data-ha-exclude="">moss harness </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/moss-harness.jpg" alt="A nylon webbing harness in bright teal laid out on a desk." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1988,6 +1985,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/fishhook-pride-keychains/` was built on 2026-09-20T00:40:39.733Z -->
<!-- This page `/fishhook-pride-keychains/` was built on 2026-09-20T22:08:14.565Z -->
</body>
</html>
five-of-them/index.html
+40 -39
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="five-of-them">five of them</h1>
<h1>five of them</h1>
<div class="post-metadata">
<p>
@@ -1894,44 +1895,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/foxgloves/">
<h2 data-ha-exclude="" id="foxgloves">foxgloves </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>shirt</li>
</ul>
<img src="/img/foxgloves-print.jpg" alt="A print of a cluster of foxgloves. The background is inked in green, with negative space and pink details making up the foxgloves." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/crow/">
<h2 data-ha-exclude="" id="crow">crow </h2>
<ul class="postlist-tags">
<li>print</li>
</ul>
<img src="/img/crow-print.jpg" alt="a block print in dark indigo ink on white paper depicting a perched crow looking over one shoulder. one side of the crow is lit with fine feather detail, and the other side is almost entirely in shadow." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
<li class="post">
<a class="postlink" href="/queer/">
<h2 data-ha-exclude="" id="queer">queer </h2>
<a class="postlink" href="/trans-rights-skull/">
<h2 data-ha-exclude="">trans rights skull </h2>
<ul class="postlist-tags">
@@ -1946,7 +1915,39 @@ switch (currentThemeValue) {
<li>gender</li>
</ul>
<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/trans-rights-print.jpg" alt="A print in mostly black ink of a smiling skull with a speech bubble. In pink and blue, the speech bubble reads &#39;trans rights!&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/shirts/">
<h2 data-ha-exclude="">shirts! </h2>
<ul class="postlist-tags">
<li>shirt</li>
</ul>
<img src="/img/shirts.jpg" alt="A row of shirts hanging in front of a window, with a variety of hand-printed designs." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/flicker/">
<h2 data-ha-exclude="">flicker </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>shirt</li>
</ul>
<img src="/img/flicker-print.jpg" alt="A print in black, brown, and red ink of a northern flicker (a type of woodpecker). Viewed from the back, he is looking over his shoulder and upward towards something unseen above him (my bird feeder)." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -2003,6 +2004,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/five-of-them/` was built on 2026-09-20T00:40:39.722Z -->
<!-- This page `/five-of-them/` was built on 2026-09-20T22:08:14.560Z -->
</body>
</html>
fix-your-hearts/index.html
+28 -33
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="fix-your-hearts">fix your hearts</h1>
<h1>fix your hearts</h1>
<div class="post-metadata">
<p>
@@ -1881,34 +1882,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/trans-wrongs-skull/">
<h2 data-ha-exclude="" id="trans-wrongs-skull">trans wrongs skull </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>sticker</li>
<li>pin</li>
<li>gender</li>
</ul>
<img src="/img/trans-wrongs-print.jpg" alt="A smiling skull with devil horns and a little spiked tail, and a speech bubble reading &#39;trans wrongs!&#39;" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/stellars-jay/">
<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
<a class="postlink" href="/flicker/">
<h2 data-ha-exclude="">flicker </h2>
<ul class="postlist-tags">
@@ -1919,23 +1898,39 @@ switch (currentThemeValue) {
<li>shirt</li>
</ul>
<img src="/img/stellars-jay-print.jpg" alt="A print of a stellar&#39;s jay, a beautiful black and blue bird, about to take off from a branch" loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/flicker-print.jpg" alt="A print in black, brown, and red ink of a northern flicker (a type of woodpecker). Viewed from the back, he is looking over his shoulder and upward towards something unseen above him (my bird feeder)." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/five-of-them/">
<h2 data-ha-exclude="" id="five-of-them">five of them </h2>
<a class="postlink" href="/iris/">
<h2 data-ha-exclude="">iris </h2>
<ul class="postlist-tags">
<li>print</li>
<li>shirt</li>
<li>card</li>
</ul>
<img src="/img/five-of-them-print.jpg" alt="A block print of five mule deer grazing in a dark green field. The deer are partially negative space and partially brown ink detailing." loading="lazy" decoding="async" width="1000" height="594">
<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
<li class="post">
<a class="postlink" href="/quorbs/">
<h2 data-ha-exclude="">quorbs </h2>
<ul class="postlist-tags">
<li>print</li>
<li>highlight</li>
</ul>
<img src="/img/quorbs-print.jpg" alt="A print in two layers of color showing two rotund quails on a branch. Most of the details are in black ink, then there is a layer with a brown gradient filling in some color on the head and breast." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1992,6 +1987,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/fix-your-hearts/` was built on 2026-09-20T00:40:39.760Z -->
<!-- This page `/fix-your-hearts/` was built on 2026-09-20T22:08:14.541Z -->
</body>
</html>
flatfish/index.html
+14 -19
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="flatfish">flatfish</h1>
<h1>flatfish</h1>
<div class="post-metadata">
<p>
@@ -1894,28 +1895,26 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/not-a-drill/">
<h2 data-ha-exclude="" id="not-a-drill">not a drill </h2>
<a class="postlink" href="/fix-your-hearts/">
<h2 data-ha-exclude="">fix your hearts </h2>
<ul class="postlist-tags">
<li>print</li>
<li>shirt</li>
</ul>
<img src="/img/not-a-drill-print.jpg" alt="A print in dark teal ink depicting a power drill with text in cursive below that reads &#39;ceci n&#39;est pas un exercice&#39; or &#39;this is not a drill&#39;" loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/fix-your-hearts-print.jpg" alt="2 copies of the same print, one in black ink and one in dark teal. The print is text that reads &#39;fix your hearts or die&#39;, with the text shaped into a somewhat long and narrow heart." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/nonbinary-flag/">
<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
<a class="postlink" href="/killdeer/">
<h2 data-ha-exclude="">killdeer </h2>
<ul class="postlist-tags">
@@ -1923,26 +1922,22 @@ switch (currentThemeValue) {
<li>card</li>
<li>gender</li>
</ul>
<img src="/img/nonbinary-flag-print.jpg" alt="A print of a nonbinary flag waving, with yellow, white (uninked), purple, and black stripes." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/killdeer-print.jpg" alt="A print of a killdeer in black ink." loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
<li class="post">
<a class="postlink" href="/greeting-quorbs/">
<h2 data-ha-exclude="" id="greeting-quorbs">greeting quorbs </h2>
<a class="postlink" href="/loon/">
<h2 data-ha-exclude="">loon </h2>
<ul class="postlist-tags">
<li>card</li>
<li>print</li>
</ul>
<img src="/img/greeting-quorbs.jpg" alt="A pile of hand-printed A2 size greeting cards. Only the front is visible, showing a particularly round quail." loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/loon-print.jpg" alt="A print of a loon rearing up with wings spread" loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
@@ -1999,6 +1994,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/flatfish/` was built on 2026-09-20T00:40:39.713Z -->
<!-- This page `/flatfish/` was built on 2026-09-20T22:08:14.545Z -->
</body>
</html>
flicker/index.html
+25 -30
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="flicker">flicker</h1>
<h1>flicker</h1>
<div class="post-metadata">
<p>
@@ -1899,34 +1900,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/queer/">
<h2 data-ha-exclude="" id="queer">queer </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>sticker</li>
<li>pin</li>
<li>gender</li>
</ul>
<img src="/img/queer-print.jpg" alt="A print of the word queer in black ink. The letters are rounded with elongated oval negative space." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/artisans-cooperative-shirts/">
<h2 data-ha-exclude="" id="artisans-cooperative-shirts">artisans cooperative shirts </h2>
<h2 data-ha-exclude="">artisans cooperative shirts </h2>
<ul class="postlist-tags">
@@ -1941,15 +1920,31 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/squarsh/">
<h2 data-ha-exclude="" id="squarsh">squarsh </h2>
<a class="postlink" href="/iris/">
<h2 data-ha-exclude="">iris </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
</ul>
<img src="/img/iris-prints.jpg" alt="3 copies of the same print of iris flowers and a bud, done in slightly varied color schemes." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
<li class="post">
<a class="postlink" href="/brown-creeper/">
<h2 data-ha-exclude="">brown creeper </h2>
<ul class="postlist-tags">
<li>print</li>
</ul>
<img src="/img/squarsh-prints.jpg" alt="Two identical prints of a delicata squash. The body of the squash is cornsilk (muted yellow), the stem and stripes in mint green, and the shadows in lilac." loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/brown-creeper-print.jpg" alt="2 copies of the same print side by side. In yellow, black, and purple ink, a brown creeper, a small bird, is depicted, well camouflaged against a tree trunk." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
@@ -2006,6 +2001,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/flicker/` was built on 2026-09-20T00:40:39.714Z -->
<!-- This page `/flicker/` was built on 2026-09-20T22:08:14.556Z -->
</body>
</html>
flocked-notebook/index.html
+12 -13
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="flocked-notebook">flocked notebook</h1>
<h1>flocked notebook</h1>
<div class="post-metadata">
<p>
@@ -1895,12 +1896,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/acadia-coloring-journal/">
<h2 data-ha-exclude="" id="acadia-coloring-journal">Acadia coloring journal </h2>
<h2 data-ha-exclude="">Acadia coloring journal </h2>
<ul class="postlist-tags">
@@ -1913,31 +1914,29 @@ switch (currentThemeValue) {
</li>
<li class="post">
<a class="postlink" href="/leather-long-stitch-journals/">
<h2 data-ha-exclude="" id="leather-long-stitch-journals">leather long-stitch journals </h2>
<a class="postlink" href="/green-memo-pad/">
<h2 data-ha-exclude="">green memo pad </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>book</li>
</ul>
<img src="/img/long-stitch-journals.jpg" alt="A stack of hand-bound journals showing long stitches aligned with the spines. They are leather bound and have tie closures." loading="lazy" decoding="async" width="1000" height="1333">
<img src="/img/green-memo-pad.jpg" alt="A three panel collage showcasing a small green memo pad." loading="lazy" decoding="async" width="1000" height="1776">
</a>
</li>
<li class="post">
<a class="postlink" href="/square-watercolor-pad/">
<h2 data-ha-exclude="" id="square-watercolor-pad">square watercolor pad </h2>
<a class="postlink" href="/stampede-journal/">
<h2 data-ha-exclude="">stampede journal </h2>
<ul class="postlist-tags">
<li>book</li>
</ul>
<img src="/img/square-watercolor-pad.jpg" alt="A two panel collage showing a square book with a tan cover and blue and gold endpapers." loading="lazy" decoding="async" width="1000" height="1331">
<img src="/img/stampede-journal.jpg" alt="A 4-part collage of a hardcover book, showing a coloring page with &#39;stampede!&#39; written across it." loading="lazy" decoding="async" width="1000" height="1777">
</a>
</li>
@@ -1994,6 +1993,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/flocked-notebook/` was built on 2026-09-20T00:40:39.712Z -->
<!-- This page `/flocked-notebook/` was built on 2026-09-20T22:08:14.534Z -->
</body>
</html>
foldy-wallet-with-thumb-slide/index.html
+16 -15
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="foldy-wallet-with-thumb-slide">foldy wallet with thumb slide</h1>
<h1>foldy wallet with thumb slide</h1>
<div class="post-metadata">
<p>
@@ -1882,49 +1883,49 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/foldy-wallet/">
<h2 data-ha-exclude="" id="foldy-wallet">foldy wallet </h2>
<a class="postlink" href="/patchwork-wallet/">
<h2 data-ha-exclude="">patchwork wallet </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>highlight</li>
</ul>
<img src="/img/foldy-wallet.jpg" alt="A four part collage showing a single piece of deep red leather folding up to become a card wallet." loading="lazy" decoding="async" width="1000" height="1000">
<img src="/img/patchwork-wallet.jpg" alt="A collage showing a wallet in a patchwork style, with different colors of leather all stitched together to make up the exterior and the top interior pockets. Other pockets inside are dyed various colors." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/zipper-bifold/">
<h2 data-ha-exclude="" id="zipper-bifold">zipper bifold </h2>
<a class="postlink" href="/sunflower/">
<h2 data-ha-exclude="">sunflower </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/zipper-bifold.jpg" alt="A collage showing a hand-stitched leather bifold with a zippered coin pocket on one exterior side." loading="lazy" decoding="async" width="1000" height="1777">
<img src="/img/sunflower.jpg" alt="A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/designing-a-bag/">
<h2 data-ha-exclude="" id="designing-a-bag">designing a bag </h2>
<a class="postlink" href="/eight-pocket-bifold/">
<h2 data-ha-exclude="">eight pocket bifold </h2>
<ul class="postlist-tags">
<li>leather</li>
<li>software</li>
</ul>
<img src="/img/shoelace-bag.jpg" alt="a 3-image collage showcasing a leather crossbody bag. the leather body is brown and fairly simple. up the narrow sides, rope is laced through grommets in a style resembling a shoe lacing. the rope forms the handle and loops seamlessly through the other side of the bag, joining in one point in a figure-8 follow-through knot. At the bottom corners, there are small diagonal lines of stitching to give the bag a small lip around the base and ensure small objects don&#39;t slide out." loading="lazy" decoding="async" width="1000" height="1777">
<img src="/img/eight-pocket-bifold.jpg" alt="A 3-picture collage showing a hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a asymmetrical interior with a hidden pocket and 3 card pockets on the right, and a hidden pocket and 2 card pockets on the left. The left front pocket has a small naturally occuring hole." loading="lazy" decoding="async" width="1000" height="1777">
</a>
</li>
@@ -1981,6 +1982,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/foldy-wallet-with-thumb-slide/` was built on 2026-09-20T00:40:39.735Z -->
<!-- This page `/foldy-wallet-with-thumb-slide/` was built on 2026-09-20T22:08:14.536Z -->
</body>
</html>
foldy-wallet/index.html
+14 -13
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="foldy-wallet">foldy wallet</h1>
<h1>foldy wallet</h1>
<div class="post-metadata">
<p>
@@ -1882,47 +1883,47 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/mom-bag/">
<h2 data-ha-exclude="" id="mom-bag">mom bag </h2>
<a class="postlink" href="/bag-strap/">
<h2 data-ha-exclude="">bag strap </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/mom-bag.jpg" alt="A leather bag sized for a large smartphone with a main pocket and a wraparound smaller pocket. It has a magnetic clasp." loading="lazy" decoding="async" width="900" height="1200">
<img src="/img/bag-strap.jpg" alt="A nylon webbing shoulder strap in bright teal with clips on each end." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/circle-bag/">
<h2 data-ha-exclude="" id="circle-bag">circle bag </h2>
<a class="postlink" href="/nine-pocket-bifold/">
<h2 data-ha-exclude="">nine pocket bifold </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/circle-bag.jpg" alt="A round bag in brown, mustard yellow, and rich deep orange, with a teal shoulder strap." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/nine-pocket-bifold.jpg" alt="A hand stitched full grain leather bifold wallet in dark plum leather. It has a main bill pocket and a symmetrical interior with a hidden pocket and 3 card pockets on each side." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/x-acto-knife-sheath/">
<h2 data-ha-exclude="" id="x-acto-knife-sheath">x-acto knife sheath </h2>
<a class="postlink" href="/moss-harness/">
<h2 data-ha-exclude="">moss harness </h2>
<ul class="postlist-tags">
<li>leather</li>
</ul>
<img src="/img/knife-sheaths.jpg" alt="Several blades with leather sheaths, and a few extra sheaths. There&#39;s a #2 blade with an orange sheath with yellow stitching, a #11 blade with a blue sheath with light grey stitching, and a skiving knife with a plum sheath and pink stitching." loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/moss-harness.jpg" alt="A nylon webbing harness in bright teal laid out on a desk." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
@@ -1979,6 +1980,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/foldy-wallet/` was built on 2026-09-20T00:40:39.735Z -->
<!-- This page `/foldy-wallet/` was built on 2026-09-20T22:08:14.535Z -->
</body>
</html>
fountain-pen-friendly-stationery/index.html
+7 -6
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="fountain-pen-friendly-stationery">fountain pen-friendly stationery</h1>
<h1>fountain pen-friendly stationery</h1>
<div class="post-metadata">
<p>
@@ -1897,12 +1898,12 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/siblinghood-of-the-traveling-greeting-card/">
<h2 data-ha-exclude="" id="siblinghood-of-the-traveling-greeting-card">siblinghood of the traveling greeting card </h2>
<h2 data-ha-exclude="">siblinghood of the traveling greeting card </h2>
<ul class="postlist-tags">
@@ -1916,7 +1917,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/stationery-exchange/">
<h2 data-ha-exclude="" id="stationery-exchange">stationery exchange </h2>
<h2 data-ha-exclude="">stationery exchange </h2>
<ul class="postlist-tags">
@@ -1980,6 +1981,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/fountain-pen-friendly-stationery/` was built on 2026-09-20T00:40:39.740Z -->
<!-- This page `/fountain-pen-friendly-stationery/` was built on 2026-09-20T22:08:14.540Z -->
</body>
</html>
foxgloves/index.html
+43 -36
View File
@@ -438,6 +438,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +498,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1815,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="foxgloves">foxgloves</h1>
<h1>foxgloves</h1>
<div class="post-metadata">
<p>
@@ -1898,53 +1899,59 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/five-of-them/">
<h2 data-ha-exclude="" id="five-of-them">five of them </h2>
<a class="postlink" href="/kniphofia/">
<h2 data-ha-exclude="">kniphofia </h2>
<ul class="postlist-tags">
<li>print</li>
</ul>
<img src="/img/kniphofia-print.jpg" alt="A print of a brightly colored flower in 4 layers of color" loading="lazy" decoding="async" width="1000" height="1333">
</a>
</li>
<li class="post">
<a class="postlink" href="/boypussy/">
<h2 data-ha-exclude="">boypussy (mature)</h2>
<ul class="postlist-tags">
<li>print</li>
<li>sticker</li>
<li>shirt</li>
</ul>
<img src="/img/five-of-them-print.jpg" alt="A block print of five mule deer grazing in a dark green field. The deer are partially negative space and partially brown ink detailing." loading="lazy" decoding="async" width="1000" height="594">
</a>
</li>
<li class="post">
<a class="postlink" href="/tiny-portraits/">
<h2 data-ha-exclude="" id="tiny-portraits">tiny portraits </h2>
<ul class="postlist-tags">
<li>print</li>
</ul>
<img src="/img/tiny-portrait-stamps.jpg" alt="A collage showing various small (around an inch) stamps that depict people or animals." loading="lazy" decoding="async" width="1000" height="1000">
</a>
</li>
<li class="post">
<a class="postlink" href="/coming-out/">
<h2 data-ha-exclude="" id="coming-out">coming out </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>pin</li>
<li>gender</li>
</ul>
<img src="/img/coming-out-card-print.jpg" alt="A card and print in the same design - a chick and a broken eggshell, and a simple font reading &#39;congrats on coming out of your shell&#39;" loading="lazy" decoding="async" width="1000" height="750">
<img src="/img/boypussy-shirt.jpg" alt="A butch holding a chainsaw and wearing a tank top that reads boypussy in pink Barbie font." class="blur" loading="lazy" decoding="async" width="1000" height="1250">
</a>
</li>
<li class="post">
<a class="postlink" href="/pronoun-patches/">
<h2 data-ha-exclude="">pronoun patches </h2>
<ul class="postlist-tags">
<li>print</li>
<li>patch</li>
<li>gender</li>
</ul>
<img src="/img/pronoun-patch.jpg" alt="Rows of the same design, a skull with a speech bubble announcing varied pronoun sets, repeat in multiple colors along a stretch of off-white fabric." loading="lazy" decoding="async" width="1000" height="562">
</a>
</li>
@@ -2001,6 +2008,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/foxgloves/` was built on 2026-09-20T00:40:39.722Z -->
<!-- This page `/foxgloves/` was built on 2026-09-20T22:08:14.561Z -->
</body>
</html>
framer-accessibility/index.html
+192 -17
View File
@@ -40,7 +40,80 @@
<style>.post-metadata {
<style>#toc {
float: right;
margin: 1rem 0 1.5rem 1.5rem;
width: min(calc(100% - 1.5rem), 23rem);
/* 23rem is the width of the words 'table of contents' in my header font */
/* yes, it's a bit hacky */
}
@media (max-width: 850px) {
#toc {
float: unset;
margin-top: 2rem;
margin-left: .5rem;
width: calc(100% - .5rem);
}
}
#toc details {
border: thick solid var(--color-pink);
border-radius: 1rem;
margin-top: 1rem;
}
#toc summary {
position: relative;
top: -1.5rem;
left: -.75rem;
width: fit-content;
background: var(--color-bg);
border-radius: .5rem;
}
#toc summary:focus-visible {
outline: .15rem solid var(--color-teal);
}
#toc summary::marker {
font-size: 2.35rem;
}
#toc h2 {
margin-top: 0;
display: inline;
line-height: normal;
}
#toc nav {
position: relative;
top: -1.25rem;
}
#toc li {
margin-block: .45rem 0;
}
@media (max-width: 650px) {
#toc nav > ol {
margin-left: .5rem;
}
}
/* basically we want to style this `ol` as a `ul` */
#toc ol > li {
list-style: disc;
}
#toc ol > li > ol > li {
list-style: circle;
}
#toc ol > li > ol > li > ol > li {
list-style: square;
}
.post-metadata {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
@@ -438,6 +511,8 @@ body:has(dialog[open]) {
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -496,7 +571,6 @@ body:has(dialog[open]) {
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1814,7 +1888,7 @@ switch (currentThemeValue) {
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article data-pagefind-body="">
<h1 id="framer-accessibility">framer accessibility</h1>
<h1>framer accessibility</h1>
<div class="post-metadata">
<p>
@@ -1843,7 +1917,109 @@ switch (currentThemeValue) {
<img class="hero" src="/img/framer.png" alt="A screenshot of the Framer projects page showing part of the tile for a very rudimentary project titled Accessibility Test. It has a huge title that just reads Title, a basic form, and some pictures of my dog as notable features." loading="lazy" decoding="async" width="841" height="532">
<p>This is a work in progress post originally written for a colleague beginning to explore <a href="https://framer.com" target="_blank" rel="external">Framer</a>, a visual site designer with CMS. It walks through some major web accessibility topics, first generally and then as they relate to Framer, with links to relevant resources.</p>
<aside id="toc">
<details>
<summary><h2>table of contents</h2></summary>
<nav class="toc">
<ol>
<li><a href="#accessible-from-the-beginning">Accessible from the beginning</a>
</li>
<li><a href="#definitions">Definitions</a>
</li>
<li><a href="#semantic-html">Semantic HTML</a>
<ol>
<li><a href="#semantic-html-in-framer">Semantic HTML in Framer</a>
</li>
</ol>
</li>
<li><a href="#reading-order">Reading order</a>
<ol>
<li><a href="#reading-order-in-framer">Reading order in Framer</a>
</li>
</ol>
</li>
<li><a href="#keyboard-navigation">Keyboard navigation</a>
<ol>
<li><a href="#keyboard-navigation-in-framer">Keyboard navigation in Framer</a>
</li>
</ol>
</li>
<li><a href="#keyboard-focus">Keyboard focus</a>
<ol>
<li><a href="#keyboard-focus-in-framer">Keyboard focus in Framer</a>
</li>
</ol>
</li>
<li><a href="#skip-links">Skip links</a>
<ol>
<li><a href="#skip-links-in-framer">Skip links in Framer</a>
</li>
</ol>
</li>
<li><a href="#text-alternatives">Text alternatives</a>
<ol>
<li><a href="#text-alternatives-in-framer">Text alternatives in Framer</a>
</li>
</ol>
</li>
<li><a href="#color">Color</a>
<ol>
<li><a href="#color-in-framer">Color in Framer</a>
</li>
</ol>
</li>
<li><a href="#responsive-design">Responsive design</a>
<ol>
<li><a href="#responsive-design-in-framer">Responsive design in Framer</a>
</li>
</ol>
</li>
<li><a href="#forms">Forms</a>
<ol>
<li><a href="#forms-in-framer">Forms in Framer</a>
</li>
</ol>
</li>
<li><a href="#other-considerations">Other considerations</a>
</li>
</ol>
</nav>
</details>
</aside>
<p>This is a work in progress post originally written for a colleague beginning to explore <a href="https://framer.com" target="_blank" rel="external">Framer</a>, a visual site designer with CMS. It walks through some major web accessibility topics, first generally and then as they relate to Framer, with links to relevant resources.</p>
<h2 id="accessible-from-the-beginning">Accessible from the beginning</h2>
<p>Accessibility <strong>must</strong> be built from the start of a project. Retrofitting a project to be accessible requires far more effort than designing for accessibility from the start. Building with accessibility in mind prevents time consuming and expensive reworks.</p>
<h2 id="definitions">Definitions</h2>
@@ -1951,6 +2127,7 @@ switch (currentThemeValue) {
<li>Some users need <strong>reduced or removed animations</strong>. There is a setting in Framer to <a href="https://www.framer.com/help/articles/reduced-motion-settings/" target="_blank" rel="external">allow reduced motion support</a>. It's turned off by default.</li>
</ul>
</article>
@@ -1988,49 +2165,47 @@ switch (currentThemeValue) {
<section class="related-posts">
<h2 data-ha-exclude="" id="related-posts">related posts</h2>
<h2 data-ha-exclude="">related posts</h2>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/handedness-toggle/">
<h2 data-ha-exclude="" id="handedness-toggle">handedness toggle </h2>
<a class="postlink" href="/domain-and-site-setup/">
<h2 data-ha-exclude="">domain and site setup </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/handedness-toggle-0.png" alt="A screenshot of the rescue trans rescue navbar centered on a button that shows a hand pointing left." loading="lazy" decoding="async" width="1000" height="257">
<img src="/img/crinkly-mushrooms.jpg" alt="Picture unrelated to post. Some crinkly brown-orange mushrooms in vibrant green grass." loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/eleventy-lessons/">
<h2 data-ha-exclude="" id="eleventy-lessons">eleventy lessons </h2>
<a class="postlink" href="/redirections/">
<h2 data-ha-exclude="">redirections </h2>
<ul class="postlist-tags">
<li>software</li>
</ul>
<img src="/img/hellebore.jpg" alt="Image unrelated to post. Close up on a pale green hellebore flower." loading="lazy" decoding="async" width="1000" height="666">
<img src="/img/angle-brackets-uwu.jpg" alt="Ascii art of an emoticon with pinched eyes and a small mouth made with two angle brackets." loading="lazy" decoding="async" width="1000" height="316">
</a>
</li>
<li class="post">
<a class="postlink" href="/azure-locations-and-file-crawling/">
<h2 data-ha-exclude="" id="azure-locations-and-file-crawling">azure locations and file crawling </h2>
<a class="postlink" href="/visual-site-builders-and-accessibility/">
<h2 data-ha-exclude="">visual site builders and accessibility </h2>
<ul class="postlist-tags">
<li>software</li>
<li>highlight</li>
</ul>
<img src="/img/azure-locations.jpg" alt="A Linux terminal. There is a fun rainbow flag in ascii art at the top, and then the user has called a command asking Azure for a list of locations applicable to a specific resource type. The output is lengthy." loading="lazy" decoding="async" width="1000" height="827">
<img src="/img/roses.jpg" alt="Image unrelated to post. Two peach-colored roses, the farther away one a bit out of focus." loading="lazy" decoding="async" width="1000" height="666">
</a>
</li>
@@ -2087,6 +2262,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/framer-accessibility/` was built on 2026-09-20T00:40:39.766Z -->
<!-- This page `/framer-accessibility/` was built on 2026-09-20T22:08:14.588Z -->
</body>
</html>
gallery/1/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/dyeing-fiber/">
<h2 data-ha-exclude="" id="dyeing-fiber">dyeing fiber </h2>
<h2 data-ha-exclude="">dyeing fiber </h2>
<ul class="postlist-tags">
@@ -1413,7 +1414,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/coral-reef-handspun/">
<h2 data-ha-exclude="" id="coral-reef-handspun">coral reef handspun </h2>
<h2 data-ha-exclude="">coral reef handspun </h2>
<ul class="postlist-tags">
@@ -1427,7 +1428,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/bfl-silk-handspun/">
<h2 data-ha-exclude="" id="bfl-silk-handspun">BFL/silk handspun </h2>
<h2 data-ha-exclude="">BFL/silk handspun </h2>
<ul class="postlist-tags">
@@ -1441,7 +1442,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/orion-handspun/">
<h2 data-ha-exclude="" id="orion-handspun">orion handspun </h2>
<h2 data-ha-exclude="">orion handspun </h2>
<ul class="postlist-tags">
@@ -1455,7 +1456,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/petrichor-handspun/">
<h2 data-ha-exclude="" id="petrichor-handspun">petrichor handspun </h2>
<h2 data-ha-exclude="">petrichor handspun </h2>
<ul class="postlist-tags">
@@ -1469,7 +1470,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/light-grey-jacobs-handspun/">
<h2 data-ha-exclude="" id="light-grey-jacobs-handspun">light grey jacobs handspun </h2>
<h2 data-ha-exclude="">light grey jacobs handspun </h2>
<ul class="postlist-tags">
@@ -1483,7 +1484,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/icelandic-lamb-handspun/">
<h2 data-ha-exclude="" id="icelandic-lamb-handspun">icelandic lamb handspun </h2>
<h2 data-ha-exclude="">icelandic lamb handspun </h2>
<ul class="postlist-tags">
@@ -1497,7 +1498,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/handcombed-jacobs-handspun/">
<h2 data-ha-exclude="" id="handcombed-jacobs-handspun">handcombed jacobs handspun </h2>
<h2 data-ha-exclude="">handcombed jacobs handspun </h2>
<ul class="postlist-tags">
@@ -1511,7 +1512,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/happy-solstice-2025/">
<h2 data-ha-exclude="" id="happy-solstice-2025">happy solstice 2025 </h2>
<h2 data-ha-exclude="">happy solstice 2025 </h2>
<ul class="postlist-tags">
@@ -1525,7 +1526,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-scarf/">
<h2 data-ha-exclude="" id="brookes-scarf">brooke&#39;s scarf </h2>
<h2 data-ha-exclude="">brooke&#39;s scarf </h2>
<ul class="postlist-tags">
@@ -1539,7 +1540,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/dragon-mask/">
<h2 data-ha-exclude="" id="dragon-mask">dragon mask </h2>
<h2 data-ha-exclude="">dragon mask </h2>
<ul class="postlist-tags">
@@ -1555,7 +1556,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/intro-to-wireframing/">
<h2 data-ha-exclude="" id="intro-to-wireframing">intro to wireframing </h2>
<h2 data-ha-exclude="">intro to wireframing </h2>
<ul class="postlist-tags">
@@ -1569,7 +1570,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-suspenders/">
<h2 data-ha-exclude="" id="brookes-suspenders">brooke&#39;s suspenders </h2>
<h2 data-ha-exclude="">brooke&#39;s suspenders </h2>
<ul class="postlist-tags">
@@ -1655,6 +1656,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/1/` was built on 2026-09-20T00:40:45.064Z -->
<!-- This page `/gallery/1/` was built on 2026-09-20T22:08:17.527Z -->
</body>
</html>
gallery/10/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/lupine/">
<h2 data-ha-exclude="" id="lupine">lupine </h2>
<h2 data-ha-exclude="">lupine </h2>
<ul class="postlist-tags">
@@ -1417,7 +1418,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leather-keychains/">
<h2 data-ha-exclude="" id="leather-keychains">leather keychains </h2>
<h2 data-ha-exclude="">leather keychains </h2>
<ul class="postlist-tags">
@@ -1431,7 +1432,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/killdeer/">
<h2 data-ha-exclude="" id="killdeer">killdeer </h2>
<h2 data-ha-exclude="">killdeer </h2>
<ul class="postlist-tags">
@@ -1447,7 +1448,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/junco/">
<h2 data-ha-exclude="" id="junco">junco </h2>
<h2 data-ha-exclude="">junco </h2>
<ul class="postlist-tags">
@@ -1463,7 +1464,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/handspun-yarn-in-party-mix-and-orange-gold/">
<h2 data-ha-exclude="" id="handspun-yarn-in-party-mix-and-orange-gold">handspun yarn in party mix and orange-gold </h2>
<h2 data-ha-exclude="">handspun yarn in party mix and orange-gold </h2>
<ul class="postlist-tags">
@@ -1477,7 +1478,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/flatfish/">
<h2 data-ha-exclude="" id="flatfish">flatfish </h2>
<h2 data-ha-exclude="">flatfish </h2>
<ul class="postlist-tags">
@@ -1493,7 +1494,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/chanterelle/">
<h2 data-ha-exclude="" id="chanterelle">chanterelle </h2>
<h2 data-ha-exclude="">chanterelle </h2>
<ul class="postlist-tags">
@@ -1509,7 +1510,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/iris/">
<h2 data-ha-exclude="" id="iris">iris </h2>
<h2 data-ha-exclude="">iris </h2>
<ul class="postlist-tags">
@@ -1525,7 +1526,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/congrats-on-the-gay/">
<h2 data-ha-exclude="" id="congrats-on-the-gay">congrats on the gay </h2>
<h2 data-ha-exclude="">congrats on the gay </h2>
<ul class="postlist-tags">
@@ -1543,7 +1544,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/lined-notebook/">
<h2 data-ha-exclude="" id="lined-notebook">lined notebook </h2>
<h2 data-ha-exclude="">lined notebook </h2>
<ul class="postlist-tags">
@@ -1557,7 +1558,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/flocked-notebook/">
<h2 data-ha-exclude="" id="flocked-notebook">flocked notebook </h2>
<h2 data-ha-exclude="">flocked notebook </h2>
<ul class="postlist-tags">
@@ -1571,7 +1572,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-notebook/">
<h2 data-ha-exclude="" id="brookes-notebook">brooke&#39;s notebook </h2>
<h2 data-ha-exclude="">brooke&#39;s notebook </h2>
<ul class="postlist-tags">
@@ -1587,7 +1588,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/pink-socks/">
<h2 data-ha-exclude="" id="pink-socks">pink socks </h2>
<h2 data-ha-exclude="">pink socks </h2>
<ul class="postlist-tags">
@@ -1673,6 +1674,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/10/` was built on 2026-09-20T00:40:52.046Z -->
<!-- This page `/gallery/10/` was built on 2026-09-20T22:08:21.423Z -->
</body>
</html>
gallery/11/index.html
+16 -15
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-socks/">
<h2 data-ha-exclude="" id="brookes-socks">brooke&#39;s socks </h2>
<h2 data-ha-exclude="">brooke&#39;s socks </h2>
<ul class="postlist-tags">
@@ -1413,7 +1414,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/pride-dice-bags/">
<h2 data-ha-exclude="" id="pride-dice-bags">pride dice bags </h2>
<h2 data-ha-exclude="">pride dice bags </h2>
<ul class="postlist-tags">
@@ -1429,7 +1430,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/square-watercolor-pad/">
<h2 data-ha-exclude="" id="square-watercolor-pad">square watercolor pad </h2>
<h2 data-ha-exclude="">square watercolor pad </h2>
<ul class="postlist-tags">
@@ -1443,7 +1444,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/tiny-books/">
<h2 data-ha-exclude="" id="tiny-books">tiny books </h2>
<h2 data-ha-exclude="">tiny books </h2>
<ul class="postlist-tags">
@@ -1457,7 +1458,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/orange-journal/">
<h2 data-ha-exclude="" id="orange-journal">orange journal </h2>
<h2 data-ha-exclude="">orange journal </h2>
<ul class="postlist-tags">
@@ -1471,7 +1472,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/striped-journal/">
<h2 data-ha-exclude="" id="striped-journal">striped journal </h2>
<h2 data-ha-exclude="">striped journal </h2>
<ul class="postlist-tags">
@@ -1485,7 +1486,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/green-memo-pad/">
<h2 data-ha-exclude="" id="green-memo-pad">green memo pad </h2>
<h2 data-ha-exclude="">green memo pad </h2>
<ul class="postlist-tags">
@@ -1499,7 +1500,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/blue-and-brown-leather-journal/">
<h2 data-ha-exclude="" id="blue-and-brown-leather-journal">blue and brown leather journal </h2>
<h2 data-ha-exclude="">blue and brown leather journal </h2>
<ul class="postlist-tags">
@@ -1513,7 +1514,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/acadia-coloring-journal/">
<h2 data-ha-exclude="" id="acadia-coloring-journal">Acadia coloring journal </h2>
<h2 data-ha-exclude="">Acadia coloring journal </h2>
<ul class="postlist-tags">
@@ -1527,7 +1528,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/pronoun-patches/">
<h2 data-ha-exclude="" id="pronoun-patches">pronoun patches </h2>
<h2 data-ha-exclude="">pronoun patches </h2>
<ul class="postlist-tags">
@@ -1545,7 +1546,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/congrats-on-the-autism-adhd/">
<h2 data-ha-exclude="" id="congrats-on-the-autism-adhd">congrats on the autism/adhd </h2>
<h2 data-ha-exclude="">congrats on the autism/adhd </h2>
<ul class="postlist-tags">
@@ -1561,7 +1562,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/become-unbutterable/">
<h2 data-ha-exclude="" id="become-unbutterable">become unbutterable </h2>
<h2 data-ha-exclude="">become unbutterable </h2>
<ul class="postlist-tags">
@@ -1641,6 +1642,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/11/` was built on 2026-09-20T00:40:52.834Z -->
<!-- This page `/gallery/11/` was built on 2026-09-20T22:08:21.765Z -->
</body>
</html>
gallery/2/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/wrap-bracelets/">
<h2 data-ha-exclude="" id="wrap-bracelets">wrap bracelets </h2>
<h2 data-ha-exclude="">wrap bracelets </h2>
<ul class="postlist-tags">
@@ -1413,7 +1414,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/acadia-mitts/">
<h2 data-ha-exclude="" id="acadia-mitts">acadia mitts </h2>
<h2 data-ha-exclude="">acadia mitts </h2>
<ul class="postlist-tags">
@@ -1427,7 +1428,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/on-the-shoulders-of-giants/">
<h2 data-ha-exclude="" id="on-the-shoulders-of-giants">on the shoulders of giants </h2>
<h2 data-ha-exclude="">on the shoulders of giants </h2>
<ul class="postlist-tags">
@@ -1443,7 +1444,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/sideways-canvas-shirt/">
<h2 data-ha-exclude="" id="sideways-canvas-shirt">sideways canvas shirt </h2>
<h2 data-ha-exclude="">sideways canvas shirt </h2>
<ul class="postlist-tags">
@@ -1457,7 +1458,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/scrap-patches/">
<h2 data-ha-exclude="" id="scrap-patches">scrap patches </h2>
<h2 data-ha-exclude="">scrap patches </h2>
<ul class="postlist-tags">
@@ -1471,7 +1472,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/textures-unite/">
<h2 data-ha-exclude="" id="textures-unite">textures unite </h2>
<h2 data-ha-exclude="">textures unite </h2>
<ul class="postlist-tags">
@@ -1487,7 +1488,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/fix-your-hearts/">
<h2 data-ha-exclude="" id="fix-your-hearts">fix your hearts </h2>
<h2 data-ha-exclude="">fix your hearts </h2>
<ul class="postlist-tags">
@@ -1501,7 +1502,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/loon/">
<h2 data-ha-exclude="" id="loon">loon </h2>
<h2 data-ha-exclude="">loon </h2>
<ul class="postlist-tags">
@@ -1515,7 +1516,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/kestrel-zine/">
<h2 data-ha-exclude="" id="kestrel-zine">kestrel zine </h2>
<h2 data-ha-exclude="">kestrel zine </h2>
<ul class="postlist-tags">
@@ -1533,7 +1534,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/greeting-loons/">
<h2 data-ha-exclude="" id="greeting-loons">greeting loons </h2>
<h2 data-ha-exclude="">greeting loons </h2>
<ul class="postlist-tags">
@@ -1551,7 +1552,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brown-creeper/">
<h2 data-ha-exclude="" id="brown-creeper">brown creeper </h2>
<h2 data-ha-exclude="">brown creeper </h2>
<ul class="postlist-tags">
@@ -1565,7 +1566,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/quorbs/">
<h2 data-ha-exclude="" id="quorbs">quorbs </h2>
<h2 data-ha-exclude="">quorbs </h2>
<ul class="postlist-tags">
@@ -1581,7 +1582,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/not-a-drill/">
<h2 data-ha-exclude="" id="not-a-drill">not a drill </h2>
<h2 data-ha-exclude="">not a drill </h2>
<ul class="postlist-tags">
@@ -1669,6 +1670,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/2/` was built on 2026-09-20T00:40:45.766Z -->
<!-- This page `/gallery/2/` was built on 2026-09-20T22:08:18.050Z -->
</body>
</html>
gallery/3/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leather-long-stitch-journals/">
<h2 data-ha-exclude="" id="leather-long-stitch-journals">leather long-stitch journals </h2>
<h2 data-ha-exclude="">leather long-stitch journals </h2>
<ul class="postlist-tags">
@@ -1415,7 +1416,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/lobstah/">
<h2 data-ha-exclude="" id="lobstah">lobstah </h2>
<h2 data-ha-exclude="">lobstah </h2>
<ul class="postlist-tags">
@@ -1429,7 +1430,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/greeting-quorbs/">
<h2 data-ha-exclude="" id="greeting-quorbs">greeting quorbs </h2>
<h2 data-ha-exclude="">greeting quorbs </h2>
<ul class="postlist-tags">
@@ -1445,7 +1446,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/euphorbia/">
<h2 data-ha-exclude="" id="euphorbia">euphorbia </h2>
<h2 data-ha-exclude="">euphorbia </h2>
<ul class="postlist-tags">
@@ -1459,7 +1460,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/booby-congrats-on-the-top-surgery/">
<h2 data-ha-exclude="" id="booby-congrats-on-the-top-surgery">booby (congrats on the top surgery) </h2>
<h2 data-ha-exclude="">booby (congrats on the top surgery) </h2>
<ul class="postlist-tags">
@@ -1477,7 +1478,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/luminescent/">
<h2 data-ha-exclude="" id="luminescent-mature">luminescent (mature)</h2>
<h2 data-ha-exclude="">luminescent (mature)</h2>
<ul class="postlist-tags">
@@ -1493,7 +1494,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/kniphofia/">
<h2 data-ha-exclude="" id="kniphofia">kniphofia </h2>
<h2 data-ha-exclude="">kniphofia </h2>
<ul class="postlist-tags">
@@ -1507,7 +1508,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/triangle-pouch/">
<h2 data-ha-exclude="" id="triangle-pouch">triangle pouch </h2>
<h2 data-ha-exclude="">triangle pouch </h2>
<ul class="postlist-tags">
@@ -1521,7 +1522,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/tiny-portraits/">
<h2 data-ha-exclude="" id="tiny-portraits">tiny portraits </h2>
<h2 data-ha-exclude="">tiny portraits </h2>
<ul class="postlist-tags">
@@ -1535,7 +1536,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/snap-pouch/">
<h2 data-ha-exclude="" id="snap-pouch">snap pouch </h2>
<h2 data-ha-exclude="">snap pouch </h2>
<ul class="postlist-tags">
@@ -1549,7 +1550,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/o-ring-bracelet/">
<h2 data-ha-exclude="" id="o-ring-bracelet">o-ring bracelet </h2>
<h2 data-ha-exclude="">o-ring bracelet </h2>
<ul class="postlist-tags">
@@ -1563,7 +1564,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leaf-patches/">
<h2 data-ha-exclude="" id="leaf-patches">leaf patches </h2>
<h2 data-ha-exclude="">leaf patches </h2>
<ul class="postlist-tags">
@@ -1577,7 +1578,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/bowtie/">
<h2 data-ha-exclude="" id="bowtie">bowtie </h2>
<h2 data-ha-exclude="">bowtie </h2>
<ul class="postlist-tags">
@@ -1663,6 +1664,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/3/` was built on 2026-09-20T00:40:46.475Z -->
<!-- This page `/gallery/3/` was built on 2026-09-20T22:08:18.455Z -->
</body>
</html>
gallery/4/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/swoop-wallet/">
<h2 data-ha-exclude="" id="swoop-wallet">swoop wallet </h2>
<h2 data-ha-exclude="">swoop wallet </h2>
<ul class="postlist-tags">
@@ -1413,7 +1414,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/squarsh/">
<h2 data-ha-exclude="" id="squarsh">squarsh </h2>
<h2 data-ha-exclude="">squarsh </h2>
<ul class="postlist-tags">
@@ -1427,7 +1428,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/rachels-bracelets/">
<h2 data-ha-exclude="" id="rachels-bracelets">rachel&#39;s bracelets </h2>
<h2 data-ha-exclude="">rachel&#39;s bracelets </h2>
<ul class="postlist-tags">
@@ -1441,7 +1442,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/bottom-growth/">
<h2 data-ha-exclude="" id="bottom-growth-mature">bottom growth (mature)</h2>
<h2 data-ha-exclude="">bottom growth (mature)</h2>
<ul class="postlist-tags">
@@ -1457,7 +1458,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/soras-collar/">
<h2 data-ha-exclude="" id="soras-collar">sora&#39;s collar </h2>
<h2 data-ha-exclude="">sora&#39;s collar </h2>
<ul class="postlist-tags">
@@ -1471,7 +1472,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/shrimp-cat-toy/">
<h2 data-ha-exclude="" id="shrimp-cat-toy">shrimp cat toy </h2>
<h2 data-ha-exclude="">shrimp cat toy </h2>
<ul class="postlist-tags">
@@ -1485,7 +1486,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/foldy-wallet-with-thumb-slide/">
<h2 data-ha-exclude="" id="foldy-wallet-with-thumb-slide">foldy wallet with thumb slide </h2>
<h2 data-ha-exclude="">foldy wallet with thumb slide </h2>
<ul class="postlist-tags">
@@ -1499,7 +1500,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-cuff-bracelets/">
<h2 data-ha-exclude="" id="brookes-cuff-bracelets">brooke&#39;s cuff bracelets </h2>
<h2 data-ha-exclude="">brooke&#39;s cuff bracelets </h2>
<ul class="postlist-tags">
@@ -1513,7 +1514,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/aarons-mask/">
<h2 data-ha-exclude="" id="aarons-mask">aaron&#39;s mask </h2>
<h2 data-ha-exclude="">aaron&#39;s mask </h2>
<ul class="postlist-tags">
@@ -1527,7 +1528,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/sunflower/">
<h2 data-ha-exclude="" id="sunflower">sunflower </h2>
<h2 data-ha-exclude="">sunflower </h2>
<ul class="postlist-tags">
@@ -1541,7 +1542,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/foldy-wallet/">
<h2 data-ha-exclude="" id="foldy-wallet">foldy wallet </h2>
<h2 data-ha-exclude="">foldy wallet </h2>
<ul class="postlist-tags">
@@ -1555,7 +1556,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/proud-dad-wallet/">
<h2 data-ha-exclude="" id="proud-dad-wallet">proud dad wallet </h2>
<h2 data-ha-exclude="">proud dad wallet </h2>
<ul class="postlist-tags">
@@ -1571,7 +1572,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/patchwork-wallet/">
<h2 data-ha-exclude="" id="patchwork-wallet">patchwork wallet </h2>
<h2 data-ha-exclude="">patchwork wallet </h2>
<ul class="postlist-tags">
@@ -1659,6 +1660,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/4/` was built on 2026-09-20T00:40:47.339Z -->
<!-- This page `/gallery/4/` was built on 2026-09-20T22:08:18.838Z -->
</body>
</html>
gallery/5/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/mom-bag/">
<h2 data-ha-exclude="" id="mom-bag">mom bag </h2>
<h2 data-ha-exclude="">mom bag </h2>
<ul class="postlist-tags">
@@ -1413,7 +1414,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/gradient-purse-strap/">
<h2 data-ha-exclude="" id="gradient-purse-strap">gradient purse strap </h2>
<h2 data-ha-exclude="">gradient purse strap </h2>
<ul class="postlist-tags">
@@ -1427,7 +1428,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/zipper-bifold-green/">
<h2 data-ha-exclude="" id="zipper-bifold-green">zipper bifold (green) </h2>
<h2 data-ha-exclude="">zipper bifold (green) </h2>
<ul class="postlist-tags">
@@ -1441,7 +1442,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/vix-collar/">
<h2 data-ha-exclude="" id="vix-collar">vix collar </h2>
<h2 data-ha-exclude="">vix collar </h2>
<ul class="postlist-tags">
@@ -1455,7 +1456,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/trans-the-world/">
<h2 data-ha-exclude="" id="trans-the-world">trans the world </h2>
<h2 data-ha-exclude="">trans the world </h2>
<ul class="postlist-tags">
@@ -1473,7 +1474,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/slightly-weird-man-club/">
<h2 data-ha-exclude="" id="slightly-weird-man-club">slightly weird man club </h2>
<h2 data-ha-exclude="">slightly weird man club </h2>
<ul class="postlist-tags">
@@ -1491,7 +1492,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/pins/">
<h2 data-ha-exclude="" id="pins">pins! </h2>
<h2 data-ha-exclude="">pins! </h2>
<ul class="postlist-tags">
@@ -1505,7 +1506,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/mousie/">
<h2 data-ha-exclude="" id="mousie">mousie </h2>
<h2 data-ha-exclude="">mousie </h2>
<ul class="postlist-tags">
@@ -1519,7 +1520,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/long-zipper-bifold/">
<h2 data-ha-exclude="" id="long-zipper-bifold">long zipper bifold </h2>
<h2 data-ha-exclude="">long zipper bifold </h2>
<ul class="postlist-tags">
@@ -1533,7 +1534,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/tooled-leather-patches/">
<h2 data-ha-exclude="" id="tooled-leather-patches">tooled leather patches </h2>
<h2 data-ha-exclude="">tooled leather patches </h2>
<ul class="postlist-tags">
@@ -1551,7 +1552,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/fishhook-pride-keychains/">
<h2 data-ha-exclude="" id="fishhook-pride-keychains">fishhook pride keychains </h2>
<h2 data-ha-exclude="">fishhook pride keychains </h2>
<ul class="postlist-tags">
@@ -1567,7 +1568,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/circle-bag/">
<h2 data-ha-exclude="" id="circle-bag">circle bag </h2>
<h2 data-ha-exclude="">circle bag </h2>
<ul class="postlist-tags">
@@ -1581,7 +1582,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/stephanie-collar/">
<h2 data-ha-exclude="" id="stephanie-collar">stephanie collar </h2>
<h2 data-ha-exclude="">stephanie collar </h2>
<ul class="postlist-tags">
@@ -1667,6 +1668,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/5/` was built on 2026-09-20T00:40:48.281Z -->
<!-- This page `/gallery/5/` was built on 2026-09-20T22:08:19.311Z -->
</body>
</html>
gallery/6/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/tiny-mushrooms/">
<h2 data-ha-exclude="" id="tiny-mushrooms">tiny mushrooms </h2>
<h2 data-ha-exclude="">tiny mushrooms </h2>
<ul class="postlist-tags">
@@ -1413,7 +1414,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/pinatex-wallet-with-zipper/">
<h2 data-ha-exclude="" id="pinatex-wallet-with-zipper">piñatex wallet with zipper </h2>
<h2 data-ha-exclude="">piñatex wallet with zipper </h2>
<ul class="postlist-tags">
@@ -1427,7 +1428,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/moss-harness/">
<h2 data-ha-exclude="" id="moss-harness">moss harness </h2>
<h2 data-ha-exclude="">moss harness </h2>
<ul class="postlist-tags">
@@ -1441,7 +1442,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/makers-mark-keychain/">
<h2 data-ha-exclude="" id="makers-mark-keychain">maker&#39;s mark keychain </h2>
<h2 data-ha-exclude="">maker&#39;s mark keychain </h2>
<ul class="postlist-tags">
@@ -1455,7 +1456,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/brookes-collar/">
<h2 data-ha-exclude="" id="brookes-collar">brooke&#39;s collar </h2>
<h2 data-ha-exclude="">brooke&#39;s collar </h2>
<ul class="postlist-tags">
@@ -1469,7 +1470,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/bag-strap/">
<h2 data-ha-exclude="" id="bag-strap">bag strap </h2>
<h2 data-ha-exclude="">bag strap </h2>
<ul class="postlist-tags">
@@ -1483,7 +1484,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/x-acto-knife-sheath/">
<h2 data-ha-exclude="" id="x-acto-knife-sheath">x-acto knife sheath </h2>
<h2 data-ha-exclude="">x-acto knife sheath </h2>
<ul class="postlist-tags">
@@ -1497,7 +1498,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/little-critter-pouch/">
<h2 data-ha-exclude="" id="little-critter-pouch">little critter pouch </h2>
<h2 data-ha-exclude="">little critter pouch </h2>
<ul class="postlist-tags">
@@ -1513,7 +1514,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/zipper-bifold/">
<h2 data-ha-exclude="" id="zipper-bifold">zipper bifold </h2>
<h2 data-ha-exclude="">zipper bifold </h2>
<ul class="postlist-tags">
@@ -1527,7 +1528,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/vertical-zipper-card-wallet/">
<h2 data-ha-exclude="" id="vertical-zipper-card-wallet">vertical zipper card wallet </h2>
<h2 data-ha-exclude="">vertical zipper card wallet </h2>
<ul class="postlist-tags">
@@ -1541,7 +1542,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/vertical-card-wallet/">
<h2 data-ha-exclude="" id="vertical-card-wallet">vertical card wallet </h2>
<h2 data-ha-exclude="">vertical card wallet </h2>
<ul class="postlist-tags">
@@ -1555,7 +1556,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/vertical-bifold/">
<h2 data-ha-exclude="" id="vertical-bifold">vertical bifold </h2>
<h2 data-ha-exclude="">vertical bifold </h2>
<ul class="postlist-tags">
@@ -1569,7 +1570,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/eight-pocket-bifold/">
<h2 data-ha-exclude="" id="eight-pocket-bifold">eight pocket bifold </h2>
<h2 data-ha-exclude="">eight pocket bifold </h2>
<ul class="postlist-tags">
@@ -1655,6 +1656,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/6/` was built on 2026-09-20T00:40:48.969Z -->
<!-- This page `/gallery/6/` was built on 2026-09-20T22:08:19.738Z -->
</body>
</html>
gallery/7/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/double-bill-pocket-bifold/">
<h2 data-ha-exclude="" id="double-bill-pocket-bifold">double bill pocket bifold </h2>
<h2 data-ha-exclude="">double bill pocket bifold </h2>
<ul class="postlist-tags">
@@ -1413,7 +1414,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/nine-pocket-bifold/">
<h2 data-ha-exclude="" id="nine-pocket-bifold">nine pocket bifold </h2>
<h2 data-ha-exclude="">nine pocket bifold </h2>
<ul class="postlist-tags">
@@ -1427,7 +1428,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leather-lighter-case/">
<h2 data-ha-exclude="" id="leather-lighter-case">leather lighter case </h2>
<h2 data-ha-exclude="">leather lighter case </h2>
<ul class="postlist-tags">
@@ -1441,7 +1442,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leather-chest-harness/">
<h2 data-ha-exclude="" id="leather-chest-harness">leather chest harness </h2>
<h2 data-ha-exclude="">leather chest harness </h2>
<ul class="postlist-tags">
@@ -1455,7 +1456,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/anarchy-autism/">
<h2 data-ha-exclude="" id="anarchy-autism">anarchy autism </h2>
<h2 data-ha-exclude="">anarchy autism </h2>
<ul class="postlist-tags">
@@ -1475,7 +1476,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/rope-one/">
<h2 data-ha-exclude="" id="rope-one-mature">rope (one) (mature)</h2>
<h2 data-ha-exclude="">rope (one) (mature)</h2>
<ul class="postlist-tags">
@@ -1491,7 +1492,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/artisans-cooperative-shirts/">
<h2 data-ha-exclude="" id="artisans-cooperative-shirts">artisans cooperative shirts </h2>
<h2 data-ha-exclude="">artisans cooperative shirts </h2>
<ul class="postlist-tags">
@@ -1507,7 +1508,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/shrimp/">
<h2 data-ha-exclude="" id="shrimp">shrimp </h2>
<h2 data-ha-exclude="">shrimp </h2>
<ul class="postlist-tags">
@@ -1527,7 +1528,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/girldick/">
<h2 data-ha-exclude="" id="girldick-mature">girldick (mature)</h2>
<h2 data-ha-exclude="">girldick (mature)</h2>
<ul class="postlist-tags">
@@ -1549,7 +1550,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/boypussy/">
<h2 data-ha-exclude="" id="boypussy-mature">boypussy (mature)</h2>
<h2 data-ha-exclude="">boypussy (mature)</h2>
<ul class="postlist-tags">
@@ -1571,7 +1572,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/rainbow-shawl/">
<h2 data-ha-exclude="" id="rainbow-shawl">rainbow shawl </h2>
<h2 data-ha-exclude="">rainbow shawl </h2>
<ul class="postlist-tags">
@@ -1585,7 +1586,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/queer/">
<h2 data-ha-exclude="" id="queer">queer </h2>
<h2 data-ha-exclude="">queer </h2>
<ul class="postlist-tags">
@@ -1607,7 +1608,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/coming-out/">
<h2 data-ha-exclude="" id="coming-out">coming out </h2>
<h2 data-ha-exclude="">coming out </h2>
<ul class="postlist-tags">
@@ -1697,6 +1698,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/7/` was built on 2026-09-20T00:40:49.803Z -->
<!-- This page `/gallery/7/` was built on 2026-09-20T22:08:20.246Z -->
</body>
</html>
gallery/8/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/happy-bihrtday/">
<h2 data-ha-exclude="" id="happy-bihrtday">happy biHRTday </h2>
<h2 data-ha-exclude="">happy biHRTday </h2>
<ul class="postlist-tags">
@@ -1417,7 +1418,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/foxgloves/">
<h2 data-ha-exclude="" id="foxgloves">foxgloves </h2>
<h2 data-ha-exclude="">foxgloves </h2>
<ul class="postlist-tags">
@@ -1435,7 +1436,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/artisans-cooperative-cards/">
<h2 data-ha-exclude="" id="artisans-cooperative-cards">artisans cooperative cards </h2>
<h2 data-ha-exclude="">artisans cooperative cards </h2>
<ul class="postlist-tags">
@@ -1451,7 +1452,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/stickers/">
<h2 data-ha-exclude="" id="stickers">stickers! </h2>
<h2 data-ha-exclude="">stickers! </h2>
<ul class="postlist-tags">
@@ -1465,7 +1466,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/shirts/">
<h2 data-ha-exclude="" id="shirts">shirts! </h2>
<h2 data-ha-exclude="">shirts! </h2>
<ul class="postlist-tags">
@@ -1479,7 +1480,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/nonbinary-flag/">
<h2 data-ha-exclude="" id="nonbinary-flag">nonbinary flag </h2>
<h2 data-ha-exclude="">nonbinary flag </h2>
<ul class="postlist-tags">
@@ -1497,7 +1498,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/five-of-them/">
<h2 data-ha-exclude="" id="five-of-them">five of them </h2>
<h2 data-ha-exclude="">five of them </h2>
<ul class="postlist-tags">
@@ -1513,7 +1514,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/swallowtail-on-snowdrops/">
<h2 data-ha-exclude="" id="swallowtail-on-snowdrops">swallowtail on snowdrops </h2>
<h2 data-ha-exclude="">swallowtail on snowdrops </h2>
<ul class="postlist-tags">
@@ -1531,7 +1532,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/leather-strap-journal/">
<h2 data-ha-exclude="" id="leather-strap-journal">leather strap journal </h2>
<h2 data-ha-exclude="">leather strap journal </h2>
<ul class="postlist-tags">
@@ -1545,7 +1546,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/hummingbird-become-ungovernable/">
<h2 data-ha-exclude="" id="hummingbird-become-ungovernable">hummingbird become ungovernable </h2>
<h2 data-ha-exclude="">hummingbird become ungovernable </h2>
<ul class="postlist-tags">
@@ -1563,7 +1564,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/stampede-journal/">
<h2 data-ha-exclude="" id="stampede-journal">stampede journal </h2>
<h2 data-ha-exclude="">stampede journal </h2>
<ul class="postlist-tags">
@@ -1577,7 +1578,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/orange-green-journal/">
<h2 data-ha-exclude="" id="orange-green-journal">orange green journal </h2>
<h2 data-ha-exclude="">orange green journal </h2>
<ul class="postlist-tags">
@@ -1591,7 +1592,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/baseball-journal/">
<h2 data-ha-exclude="" id="baseball-journal">baseball journal </h2>
<h2 data-ha-exclude="">baseball journal </h2>
<ul class="postlist-tags">
@@ -1677,6 +1678,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/8/` was built on 2026-09-20T00:40:50.665Z -->
<!-- This page `/gallery/8/` was built on 2026-09-20T22:08:20.699Z -->
</body>
</html>
gallery/9/index.html
+17 -16
View File
@@ -274,6 +274,8 @@
color-scheme: light dark;
--font-family: 'Atkinson Hyperlegible Next', sans-serif;
/* if you change the header font, go to post-toc.css and fuck about with the width
of the table of contents */
--font-family-headers: 'Peritel', 'Atkinson Hyperlegible Next', sans-serif;
--font-family-code: 'Atkinson Hyperlegible Mono', monospace;
@@ -332,7 +334,6 @@
}
/* Base */
* {
box-sizing: border-box;
margin: 0;
@@ -1389,7 +1390,7 @@ switch (currentThemeValue) {
<main id="main">
<h1 id="gallery">gallery</h1>
<h1>gallery</h1>
<p class="centered">the gallery section is for finished art</p>
@@ -1399,7 +1400,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/trans-wrongs-skull/">
<h2 data-ha-exclude="" id="trans-wrongs-skull">trans wrongs skull </h2>
<h2 data-ha-exclude="">trans wrongs skull </h2>
<ul class="postlist-tags">
@@ -1421,7 +1422,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/geese-trans-wrongs/">
<h2 data-ha-exclude="" id="geese-trans-wrongs">geese/trans wrongs </h2>
<h2 data-ha-exclude="">geese/trans wrongs </h2>
<ul class="postlist-tags">
@@ -1439,7 +1440,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/spotted-towhee/">
<h2 data-ha-exclude="" id="spotted-towhee">spotted towhee </h2>
<h2 data-ha-exclude="">spotted towhee </h2>
<ul class="postlist-tags">
@@ -1455,7 +1456,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/knit-shrimp/">
<h2 data-ha-exclude="" id="knit-shrimp">knit shrimp </h2>
<h2 data-ha-exclude="">knit shrimp </h2>
<ul class="postlist-tags">
@@ -1469,7 +1470,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/geese/">
<h2 data-ha-exclude="" id="geese">geese </h2>
<h2 data-ha-exclude="">geese </h2>
<ul class="postlist-tags">
@@ -1487,7 +1488,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/fat-raccoon/">
<h2 data-ha-exclude="" id="fat-raccoon">fat raccoon </h2>
<h2 data-ha-exclude="">fat raccoon </h2>
<ul class="postlist-tags">
@@ -1505,7 +1506,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/big-pidge/">
<h2 data-ha-exclude="" id="big-pidge">big pidge </h2>
<h2 data-ha-exclude="">big pidge </h2>
<ul class="postlist-tags">
@@ -1523,7 +1524,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/trans-rights-skull/">
<h2 data-ha-exclude="" id="trans-rights-skull">trans rights skull </h2>
<h2 data-ha-exclude="">trans rights skull </h2>
<ul class="postlist-tags">
@@ -1545,7 +1546,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/stellars-jay/">
<h2 data-ha-exclude="" id="stellars-jay">stellar&#39;s jay </h2>
<h2 data-ha-exclude="">stellar&#39;s jay </h2>
<ul class="postlist-tags">
@@ -1563,7 +1564,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/hair/">
<h2 data-ha-exclude="" id="hair">hair </h2>
<h2 data-ha-exclude="">hair </h2>
<ul class="postlist-tags">
@@ -1579,7 +1580,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/flicker/">
<h2 data-ha-exclude="" id="flicker">flicker </h2>
<h2 data-ha-exclude="">flicker </h2>
<ul class="postlist-tags">
@@ -1597,7 +1598,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/heron/">
<h2 data-ha-exclude="" id="heron">heron </h2>
<h2 data-ha-exclude="">heron </h2>
<ul class="postlist-tags">
@@ -1615,7 +1616,7 @@ switch (currentThemeValue) {
<li class="post">
<a class="postlink" href="/seedling/">
<h2 data-ha-exclude="" id="seedling">seedling </h2>
<h2 data-ha-exclude="">seedling </h2>
<ul class="postlist-tags">
@@ -1703,6 +1704,6 @@ switch (currentThemeValue) {
</footer>
<!-- This page `/gallery/9/` was built on 2026-09-20T00:40:51.294Z -->
<!-- This page `/gallery/9/` was built on 2026-09-20T22:08:21.023Z -->
</body>
</html>

Some files were not shown because too many files have changed in this diff Show More