diff --git a/src/img/2024/aaron-mask.jpg b/src/img/2024/aaron-mask.jpg new file mode 100644 index 0000000..e1961c0 Binary files /dev/null and b/src/img/2024/aaron-mask.jpg differ diff --git a/src/img/2024/booby-card.jpg b/src/img/2024/booby-card.jpg new file mode 100644 index 0000000..a2244e4 Binary files /dev/null and b/src/img/2024/booby-card.jpg differ diff --git a/src/img/2024/bottom-growth-prints.jpg b/src/img/2024/bottom-growth-prints.jpg new file mode 100644 index 0000000..ca3bbec Binary files /dev/null and b/src/img/2024/bottom-growth-prints.jpg differ diff --git a/src/img/2024/bowtie.jpg b/src/img/2024/bowtie.jpg new file mode 100644 index 0000000..d208b2b Binary files /dev/null and b/src/img/2024/bowtie.jpg differ diff --git a/src/img/2024/brooke-cuffs.jpg b/src/img/2024/brooke-cuffs.jpg new file mode 100644 index 0000000..1bdb635 Binary files /dev/null and b/src/img/2024/brooke-cuffs.jpg differ diff --git a/src/img/2024/brown-creeper-print.jpg b/src/img/2024/brown-creeper-print.jpg new file mode 100644 index 0000000..315b68a Binary files /dev/null and b/src/img/2024/brown-creeper-print.jpg differ diff --git a/src/img/2024/euphorbia-print.jpg b/src/img/2024/euphorbia-print.jpg new file mode 100644 index 0000000..3d895cf Binary files /dev/null and b/src/img/2024/euphorbia-print.jpg differ diff --git a/src/img/2024/fedizinefest-2025.png b/src/img/2024/fedizinefest-2025.png new file mode 100644 index 0000000..080b14c Binary files /dev/null and b/src/img/2024/fedizinefest-2025.png differ diff --git a/src/img/2024/foldy-thumb-slide.jpg b/src/img/2024/foldy-thumb-slide.jpg new file mode 100644 index 0000000..059d5b9 Binary files /dev/null and b/src/img/2024/foldy-thumb-slide.jpg differ diff --git a/src/img/2024/foldy-wallet.jpg b/src/img/2024/foldy-wallet.jpg new file mode 100644 index 0000000..0fe5bb9 Binary files /dev/null and b/src/img/2024/foldy-wallet.jpg differ diff --git a/src/img/2024/gender-census.jpg b/src/img/2024/gender-census.jpg new file mode 100644 index 0000000..51913b2 Binary files /dev/null and b/src/img/2024/gender-census.jpg differ diff --git a/src/img/2024/gender-zine-cover.png b/src/img/2024/gender-zine-cover.png new file mode 100644 index 0000000..18cc25a Binary files /dev/null and b/src/img/2024/gender-zine-cover.png differ diff --git a/src/img/2024/gender-zine-stamps.png b/src/img/2024/gender-zine-stamps.png new file mode 100644 index 0000000..2b912b3 Binary files /dev/null and b/src/img/2024/gender-zine-stamps.png differ diff --git a/src/img/2024/gradient-purse-strap.jpg b/src/img/2024/gradient-purse-strap.jpg new file mode 100644 index 0000000..ceab03d Binary files /dev/null and b/src/img/2024/gradient-purse-strap.jpg differ diff --git a/src/img/2024/greeting-loons.jpg b/src/img/2024/greeting-loons.jpg new file mode 100644 index 0000000..dbed670 Binary files /dev/null and b/src/img/2024/greeting-loons.jpg differ diff --git a/src/img/2024/greeting-quorbs.jpg b/src/img/2024/greeting-quorbs.jpg new file mode 100644 index 0000000..2c35544 Binary files /dev/null and b/src/img/2024/greeting-quorbs.jpg differ diff --git a/src/img/2024/handedness-toggle-0.png b/src/img/2024/handedness-toggle-0.png new file mode 100644 index 0000000..a79a0f4 Binary files /dev/null and b/src/img/2024/handedness-toggle-0.png differ diff --git a/src/img/2024/handedness-toggle-1.png b/src/img/2024/handedness-toggle-1.png new file mode 100644 index 0000000..d58e886 Binary files /dev/null and b/src/img/2024/handedness-toggle-1.png differ diff --git a/src/img/2024/handedness-toggle-2.png b/src/img/2024/handedness-toggle-2.png new file mode 100644 index 0000000..fd0aa86 Binary files /dev/null and b/src/img/2024/handedness-toggle-2.png differ diff --git a/src/img/2024/handedness-toggle-3.png b/src/img/2024/handedness-toggle-3.png new file mode 100644 index 0000000..3116f48 Binary files /dev/null and b/src/img/2024/handedness-toggle-3.png differ diff --git a/src/img/2024/killdeer.jpg b/src/img/2024/killdeer.jpg new file mode 100644 index 0000000..d333423 Binary files /dev/null and b/src/img/2024/killdeer.jpg differ diff --git a/src/img/2024/kniphofia-print.jpg b/src/img/2024/kniphofia-print.jpg new file mode 100644 index 0000000..451abc3 Binary files /dev/null and b/src/img/2024/kniphofia-print.jpg differ diff --git a/src/img/2024/leaf-patches-oak.jpg b/src/img/2024/leaf-patches-oak.jpg new file mode 100644 index 0000000..678c50f Binary files /dev/null and b/src/img/2024/leaf-patches-oak.jpg differ diff --git a/src/img/2024/lobstah.jpg b/src/img/2024/lobstah.jpg new file mode 100644 index 0000000..23af87a Binary files /dev/null and b/src/img/2024/lobstah.jpg differ diff --git a/src/img/2024/long-stitch-journals.jpg b/src/img/2024/long-stitch-journals.jpg new file mode 100644 index 0000000..df0f684 Binary files /dev/null and b/src/img/2024/long-stitch-journals.jpg differ diff --git a/src/img/2024/luminescent-print.jpg b/src/img/2024/luminescent-print.jpg new file mode 100644 index 0000000..04386bd Binary files /dev/null and b/src/img/2024/luminescent-print.jpg differ diff --git a/src/img/2024/mom-bag.jpg b/src/img/2024/mom-bag.jpg new file mode 100644 index 0000000..40783e5 Binary files /dev/null and b/src/img/2024/mom-bag.jpg differ diff --git a/src/img/2024/mushroom-on-fence.jpg b/src/img/2024/mushroom-on-fence.jpg new file mode 100644 index 0000000..c2c59ac Binary files /dev/null and b/src/img/2024/mushroom-on-fence.jpg differ diff --git a/src/img/2024/not-a-drill-print.jpg b/src/img/2024/not-a-drill-print.jpg new file mode 100644 index 0000000..d12336d Binary files /dev/null and b/src/img/2024/not-a-drill-print.jpg differ diff --git a/src/img/2024/oring-bracelet.jpg b/src/img/2024/oring-bracelet.jpg new file mode 100644 index 0000000..bd269c6 Binary files /dev/null and b/src/img/2024/oring-bracelet.jpg differ diff --git a/src/img/2024/patchwork-wallet.jpg b/src/img/2024/patchwork-wallet.jpg new file mode 100644 index 0000000..e2b97ef Binary files /dev/null and b/src/img/2024/patchwork-wallet.jpg differ diff --git a/src/img/2024/proud-dad-wallet.jpg b/src/img/2024/proud-dad-wallet.jpg new file mode 100644 index 0000000..0579862 Binary files /dev/null and b/src/img/2024/proud-dad-wallet.jpg differ diff --git a/src/img/2024/quorbs-print.jpg b/src/img/2024/quorbs-print.jpg new file mode 100644 index 0000000..0ea98a0 Binary files /dev/null and b/src/img/2024/quorbs-print.jpg differ diff --git a/src/img/2024/rachel-bracelets.jpg b/src/img/2024/rachel-bracelets.jpg new file mode 100644 index 0000000..848ef59 Binary files /dev/null and b/src/img/2024/rachel-bracelets.jpg differ diff --git a/src/img/2024/sheep.jpg b/src/img/2024/sheep.jpg new file mode 100644 index 0000000..125ae9c Binary files /dev/null and b/src/img/2024/sheep.jpg differ diff --git a/src/img/2024/snap-pouches.jpg b/src/img/2024/snap-pouches.jpg new file mode 100644 index 0000000..ec9f5a6 Binary files /dev/null and b/src/img/2024/snap-pouches.jpg differ diff --git a/src/img/2024/solstice-2024.png b/src/img/2024/solstice-2024.png new file mode 100644 index 0000000..c9e162b Binary files /dev/null and b/src/img/2024/solstice-2024.png differ diff --git a/src/img/2024/sora-collar.jpg b/src/img/2024/sora-collar.jpg new file mode 100644 index 0000000..0e547af Binary files /dev/null and b/src/img/2024/sora-collar.jpg differ diff --git a/src/img/2024/squarsh-prints.jpg b/src/img/2024/squarsh-prints.jpg new file mode 100644 index 0000000..504afbe Binary files /dev/null and b/src/img/2024/squarsh-prints.jpg differ diff --git a/src/img/2024/sunflower.jpg b/src/img/2024/sunflower.jpg new file mode 100644 index 0000000..60655cb Binary files /dev/null and b/src/img/2024/sunflower.jpg differ diff --git a/src/img/2024/swoop-wallet.jpg b/src/img/2024/swoop-wallet.jpg new file mode 100644 index 0000000..719d6f1 Binary files /dev/null and b/src/img/2024/swoop-wallet.jpg differ diff --git a/src/img/2024/tiny-portrait-stamps.jpg b/src/img/2024/tiny-portrait-stamps.jpg new file mode 100644 index 0000000..aac0220 Binary files /dev/null and b/src/img/2024/tiny-portrait-stamps.jpg differ diff --git a/src/img/2024/triangle-pouch.jpg b/src/img/2024/triangle-pouch.jpg new file mode 100644 index 0000000..41d6193 Binary files /dev/null and b/src/img/2024/triangle-pouch.jpg differ diff --git a/src/img/2024/two-shrimp.jpg b/src/img/2024/two-shrimp.jpg new file mode 100644 index 0000000..7efda8c Binary files /dev/null and b/src/img/2024/two-shrimp.jpg differ diff --git a/src/img/2024/wax-seals.jpg b/src/img/2024/wax-seals.jpg new file mode 100644 index 0000000..327e010 Binary files /dev/null and b/src/img/2024/wax-seals.jpg differ diff --git a/src/img/2024/wood-ducks.jpg b/src/img/2024/wood-ducks.jpg new file mode 100644 index 0000000..7503860 Binary files /dev/null and b/src/img/2024/wood-ducks.jpg differ diff --git a/src/posts/2024/2024-01-07-gradient-purse-strap.md b/src/posts/2024/2024-01-07-gradient-purse-strap.md new file mode 100644 index 0000000..b163a57 --- /dev/null +++ b/src/posts/2024/2024-01-07-gradient-purse-strap.md @@ -0,0 +1,11 @@ +--- +title: gradient purse strap +image: + src: 2024/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." +tags: + - gallery + - leather +--- + +40-something inches long, brass hardware, custom dyed. diff --git a/src/posts/2024/2024-01-07-mom-bag.md b/src/posts/2024/2024-01-07-mom-bag.md new file mode 100644 index 0000000..bf29a0c --- /dev/null +++ b/src/posts/2024/2024-01-07-mom-bag.md @@ -0,0 +1,11 @@ +--- +title: mom bag +image: + src: 2024/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." +tags: + - gallery + - leather +--- + +Designed for my mum. diff --git a/src/posts/2024/2024-01-07-patchwork-wallet.md b/src/posts/2024/2024-01-07-patchwork-wallet.md new file mode 100644 index 0000000..749fdf0 --- /dev/null +++ b/src/posts/2024/2024-01-07-patchwork-wallet.md @@ -0,0 +1,11 @@ +--- +title: patchwork wallet +image: + src: 2024/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." +tags: + - gallery + - leather +--- + +inspired by [this YouTube video](https://www.youtube.com/watch?v=t36dAp1s2NQ){target="_blank" rel="external"} diff --git a/src/posts/2024/2024-01-07-proud-dad-wallet.md b/src/posts/2024/2024-01-07-proud-dad-wallet.md new file mode 100644 index 0000000..d426667 --- /dev/null +++ b/src/posts/2024/2024-01-07-proud-dad-wallet.md @@ -0,0 +1,12 @@ +--- +title: proud dad wallet +image: + src: 2024/proud-dad-wallet.jpg + alt: "A brown leather wallet with a subtle trans flag stitching across the top." +tags: + - gallery + - leather + - gender +--- + +Designed for my dad. diff --git a/src/posts/2024/2024-01-12-foldy-wallet.md b/src/posts/2024/2024-01-12-foldy-wallet.md new file mode 100644 index 0000000..d89f697 --- /dev/null +++ b/src/posts/2024/2024-01-12-foldy-wallet.md @@ -0,0 +1,11 @@ +--- +title: foldy wallet +image: + src: 2024/foldy-wallet.jpg + alt: "A four part collage showing a single piece of deep red leather folding up to become a card wallet." +tags: + - gallery + - leather +--- + +Single piece construction for easy care - just unfold/pull out the tabs! diff --git a/src/posts/2024/2024-01-12-sunflower.md b/src/posts/2024/2024-01-12-sunflower.md new file mode 100644 index 0000000..df2b913 --- /dev/null +++ b/src/posts/2024/2024-01-12-sunflower.md @@ -0,0 +1,11 @@ +--- +title: sunflower +image: + src: 2024/sunflower.jpg + alt: "A sunflower made of leather. Many individual natural toned leather petals are sewn onto a brown center ." +tags: + - gallery + - leather +--- + +Commission piece. diff --git a/src/posts/2024/2024-01-16-aaron-mask.md b/src/posts/2024/2024-01-16-aaron-mask.md new file mode 100644 index 0000000..6e68bd5 --- /dev/null +++ b/src/posts/2024/2024-01-16-aaron-mask.md @@ -0,0 +1,11 @@ +--- +title: aaron's mask +image: + src: 2024/aaron-mask.jpg + alt: "A brown/grey leather mask of a long snouted dog with visible teeth and red detailing." +tags: + - gallery + - leather +--- + +Commission piece; based on an existing pattern. The red detailing and teeth are my own design. diff --git a/src/posts/2024/2024-01-16-brooke-cuffs.md b/src/posts/2024/2024-01-16-brooke-cuffs.md new file mode 100644 index 0000000..507564d --- /dev/null +++ b/src/posts/2024/2024-01-16-brooke-cuffs.md @@ -0,0 +1,11 @@ +--- +title: brooke's cuff bracelets +image: + src: 2024/brooke-cuffs.jpg + alt: "Olive green leather cuffs with silver spikes and a shearling lining." +tags: + - gallery + - leather +--- + +To match [brooke's collar](brooke-collar). diff --git a/src/posts/2024/2024-01-16-foldy-thumb-slide.md b/src/posts/2024/2024-01-16-foldy-thumb-slide.md new file mode 100644 index 0000000..30d55b2 --- /dev/null +++ b/src/posts/2024/2024-01-16-foldy-thumb-slide.md @@ -0,0 +1,11 @@ +--- +title: foldy wallet with thumb slide +image: + src: 2024/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." +tags: + - gallery + - leather +--- + +Designed for standard credit cards, not business cards. diff --git a/src/posts/2024/2024-01-16-shrimp-cat-toy.md b/src/posts/2024/2024-01-16-shrimp-cat-toy.md new file mode 100644 index 0000000..90103e7 --- /dev/null +++ b/src/posts/2024/2024-01-16-shrimp-cat-toy.md @@ -0,0 +1,11 @@ +--- +title: shrimp cat toy +image: + src: 2024/two-shrimp.jpg + alt: "Two leather shrimp-shaped cat toys. They have long dangly antennae and are stitched in red and orange." +tags: + - gallery + - leather +--- + +Stuffed with catnip, of course. diff --git a/src/posts/2024/2024-01-17-sora-collar.md b/src/posts/2024/2024-01-17-sora-collar.md new file mode 100644 index 0000000..19bf274 --- /dev/null +++ b/src/posts/2024/2024-01-17-sora-collar.md @@ -0,0 +1,11 @@ +--- +title: sora's collar +image: + src: 2024/sora-collar.jpg + alt: "A collage showing a red and black leather dog collar tooled with roses and the name Sora. It's fully stitched with dark red stitching and has brass hardware." +tags: + - gallery + - leather +--- + +Commission piece for a Doberman. diff --git a/src/posts/2024/2024-01-23-bottom-growth.md b/src/posts/2024/2024-01-23-bottom-growth.md new file mode 100644 index 0000000..d0aafa8 --- /dev/null +++ b/src/posts/2024/2024-01-23-bottom-growth.md @@ -0,0 +1,12 @@ +--- +title: bottom growth +image: + src: 2024/bottom-growth-prints.jpg + alt: "4 copies of the same print in various color schemes, laid out in a 2x2 grid. The print shows testosterone-driven bottom growth of a clitoris. The color schemes are, clockwise from top right, brown on turquoise, red on cornsilk (muted yellow), violet on magenta, and mint green on lilac." +tags: + - gallery + - print + - gender +--- + +Celebration of testosterone-driven bottom growth. Submitted for T! the Zine. diff --git a/src/posts/2024/2024-01-23-printmaking-paper.md b/src/posts/2024/2024-01-23-printmaking-paper.md new file mode 100644 index 0000000..02afee6 --- /dev/null +++ b/src/posts/2024/2024-01-23-printmaking-paper.md @@ -0,0 +1,62 @@ +--- +title: printmaking paper notes +image: + src: 2024/killdeer.jpg + alt: "Image unrelated to post. A very fluffed up killdeer stands on a rocky beach." +tags: + - reference + - prints +--- + +Cataloguing paper I have worked with and any notes. + +## Blick + +### Japanese paper 10 sheet assortment + +- [Japanese paper 10 sheet assortment](https://www.dickblick.com/products/japanese-paper-10-sheet-assortment/){target="_blank" rel="external"} +- Contains: + - Kinwashi - 25"x37" + - Kitakata - 16"x20" + - Mulberry - 24"x33-1/2" + - Okawara - 12"x16" + - Uryu - 24"x39" + +#### Okawara + +- My favorite of this assortment and the one I will likely re-order singly. + +#### Kitakata + +- Too yellow-toned for my liking + +#### Kinwashi + +- More fragile than I want + +### Rives + +[Lightweight Rives Printmaking Paper, Cream](https://www.dickblick.com/items/bfk-rives-printmaking-paper-19-x-26-cream-115-gsm-light-sheet/){target="_blank" rel="external"} + +- Tears really nicely +- I like the lightweight paper +- i like both cream and cream-white + +### Somerset + +- I used 250 gsm, velvet finish +- Heavier than I am looking for +- Tears well + +### Hahnemühle Ingres + +[Hahnemühle Ingres Paper](https://www.dickblick.com/products/hahnemuhle-ingres-paper/){target="_blank" rel="external"} + +- comes in a lot of colors +- tears well +- good textured surface +- really like this one + +### Arches Cover + +- thicker than I want diff --git a/src/posts/2024/2024-01-23-rachel-bracelets.md b/src/posts/2024/2024-01-23-rachel-bracelets.md new file mode 100644 index 0000000..5d3ae25 --- /dev/null +++ b/src/posts/2024/2024-01-23-rachel-bracelets.md @@ -0,0 +1,11 @@ +--- +title: rachel's bracelets +image: + src: 2024/rachel-bracelets.jpg + alt: "Two pink leather bracelets with stainless steel hardware and aqua stitching." +tags: + - gallery + - leather +--- + +Custom dyed. Stainless steel hardware. diff --git a/src/posts/2024/2024-01-23-squarsh.md b/src/posts/2024/2024-01-23-squarsh.md new file mode 100644 index 0000000..ba753f4 --- /dev/null +++ b/src/posts/2024/2024-01-23-squarsh.md @@ -0,0 +1,11 @@ +--- +title: squarsh +image: + src: 2024/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." +tags: + - gallery + - print +--- + +Color test for 3 new ink colors. diff --git a/src/posts/2024/2024-01-23-swoop-wallet.md b/src/posts/2024/2024-01-23-swoop-wallet.md new file mode 100644 index 0000000..aa7cb21 --- /dev/null +++ b/src/posts/2024/2024-01-23-swoop-wallet.md @@ -0,0 +1,11 @@ +--- +title: swoop wallet +image: + src: 2024/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." +tags: + - gallery + - leather +--- + +A card wallet. diff --git a/src/posts/2024/2024-02-03-bowtie.md b/src/posts/2024/2024-02-03-bowtie.md new file mode 100644 index 0000000..5197cb8 --- /dev/null +++ b/src/posts/2024/2024-02-03-bowtie.md @@ -0,0 +1,11 @@ +--- +title: bowtie +image: + src: 2024/bowtie.jpg + alt: "A black leather bow tie with black stitching." +tags: + - gallery + - leather +--- + +Handstitched leather bowtie with standard clasp. diff --git a/src/posts/2024/2024-02-03-leaf-patches.md b/src/posts/2024/2024-02-03-leaf-patches.md new file mode 100644 index 0000000..f2d7aa4 --- /dev/null +++ b/src/posts/2024/2024-02-03-leaf-patches.md @@ -0,0 +1,11 @@ +--- +title: leaf patches +image: + src: 2024/leaf-patches-oak.jpg + alt: "Several oak-leaf-shaped leather patches with stitching holes punched around the edges." +tags: + - gallery + - leather +--- + +Also available in maple and serrated-edge leaves diff --git a/src/posts/2024/2024-02-03-o-ring-bracelet.md b/src/posts/2024/2024-02-03-o-ring-bracelet.md new file mode 100644 index 0000000..f6375e7 --- /dev/null +++ b/src/posts/2024/2024-02-03-o-ring-bracelet.md @@ -0,0 +1,15 @@ +--- +title: o-ring bracelet +image: + src: 2024/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." +tags: + - gallery + - leather +--- + +Made a few variations of this; check out the shop for more details and options: + +- [fixed o-ring bracelet](https://riverside-refuge.square.site/product/fixed-o-ring-bracelet/108){target="_blank" rel="external"} +- [swappable o-ring bracelet](https://riverside-refuge.square.site/product/swappable-o-ring-bracelet/102){target="_blank" rel="external"} +- [premade o-ring bracelets](https://riverside-refuge.square.site/product/premade-o-ring-bracelets/106){target="_blank" rel="external"} diff --git a/src/posts/2024/2024-02-28-gender-as-a-proxy-variable.md b/src/posts/2024/2024-02-28-gender-as-a-proxy-variable.md new file mode 100644 index 0000000..b4ab593 --- /dev/null +++ b/src/posts/2024/2024-02-28-gender-as-a-proxy-variable.md @@ -0,0 +1,245 @@ +--- +title: gender as a proxy variable +image: + src: 2024/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." +tags: + - reference + - gender + - zine +--- + +[Look through a scan of the zine.](assets/pdf/gender-as-a-proxy-variable.pdf) (Be aware that the PDF is not as up to date as the web version below.) + +[Get print copies.](https://riverside-refuge.square.site/product/gender-as-a-proxy-variable-print-zine/113){target="_blank" rel="external"} + +The below material is a web page reproduction of my zine **Gender as a Proxy Variable**. + +--- + +Authored by Lee Cattarin + +August - December 2023 -> February 2024 + +--- + +> I would argue that you almost never have to ask for gender… +> +> If you’re collecting gender identity data to personalize user-facing copy, try asking for preferred\* pronouns instead. If you’re asking because you want to make in-app content recommendations, try asking about the user’s content preferences. If you’re asking to generate a user avatar, let the user generate their own. **Gender identity is a poor proxy variable** — stick to asking for the information you actually want. + +-- Nikki Stevens, quoted in “How to Make Your Software More Trans-Inclusive,” emphasis mine + +\**pro tip: just say "pronouns" and drop the "preferred"* + +--- + +So, what are you asking for when you ask for + +## **Gender?** + +- pronouns? +- title or prefix? +- health needs? +- clothing preferences? +- bathroom use? +- public profile data? +- demographic data? +- legal identification? +- medical information? + +--- + +## Formatting note + +(this section and its effects have been altered to be functional in this medium - in the print zine, checkboxes and radio buttons were used. But Markdown only has one type of list.) + +Questions that require users pick a single answer will be followed with "(pick one)". + +Questions that allow users to choose multiple answers will be followed with "(pick any)". + +Write-in fields may have italicized suggestions in them. + +--- + +## ...Pronouns + +What pronouns should we use for you? (pick any) + +- he/him/his +- she/her/hers +- they/them/theirs +- other *(write-in)*: *ze/hir/hirs* + +Worried about parsing that free text field? Try: + +- subjective: *she* +- objective: *her* +- possessive (adj): *her* +- possessive (prn): *hers* +- reflexive: *herself* + +## ...Title or prefix + +What title or prefix should we use for you? (pick one) + +- Mr. +- Mrs. +- Ms. +- Mx. +- Rev. +- Dr. +- Hon. + +(et cetera) + +- no prefix +- other *(write-in)*: + +## ...Health needs + +Do you require private facilities for breastfeeding or other health and wellness needs? (pick one) + +- yes +- no + +*Provide a write-in space for specific needs, such as refrigeration or running water.* + +## ...Clothing preferences + +Which style of shirt would you prefer? (pick one) + +- straight cut +- fitted *(edit: a reader has suggested "curvy" or "flared" as alternatives)* + +## ...Bathroom use + +Do you require any of the following restrooms? (pick any) + +- all-gender +- single-occupancy +- wheelchair-accessible +- other *(write-in)*: + +*All restrooms should be provided with menstrual products.* + +## ...Public profile data + +What is your gender? **This information will be viewable on your profile by all logged-in users.** (pick any) + +- man +- woman +- nonbinary +- other *(write-in)*: + +*Make sure to note the visibility level!* + +## ...Demographic data + +What is your gender? **This information is collected for demographic analysis only.** (pick one) + +- man +- woman +- nonbinary +- other *(write-in)*: + +## ...Legal + +What is your legal sex as marked on government-issued identification? (pick one) + +- M +- F +- X + +*Explain where this information will be used. If you need something more specific than **any** legal identification, say so: "This is used for insurance purposes and must match your gender on insurance paperwork."* + +## ...Medical + +What is your gender? (pick any) + +- man +- woman +- nonbinary +- other *(write-in)*: + +What sex were you assigned at birth? (pick one) + +- male +- female +- other *(write-in)*: + +*An organ inventory and/or surgical history is a useful tool.* + +--- + +But let’s talk more about that + +## Gender question + +Is: + +- man +- woman +- nonbinary +- other *(write-in)*: + +enough? + +Maybe not! **Probably not, in fact!** But what are our other options? + +- **Expansive lists** can be overwhelming to users, fall quickly out of date, and are prone to significant localization issues. +- **Free text entry** removes many of the downsides of expansive lists but introduces new problems with data storage and analysis. + +Having **a few primary options and a write-in**, as shown above, is a good balance! + +--- + +A little more on + +## Anti-patterns + +Consider the following options: + +- man +- woman +- trans man +- trans woman + +Aside from the lack of nonbinary gender choices, did you notice that? + +These **exclusive choices** present “man” and “trans man” (and “woman” and “trans woman”) as separate genders, when what they’re most likely trying to convey is: + +- cis man +- cis woman +- trans man +- trans woman + +**Avoid treating “cis” as the unspoken default.** + +Other anti-patterns include: + +- automatic detection of gender (just don’t) +- immutable gender fields (make gender easily editable) +- grouping all nonbinary or nonstandard genders under “other” (add common gender terms for the relevant culture; include write-in fields) + +## Patterns + +Here’s some additional positive patterns that can be appended to many of the earlier examples: + +- Make fields optional unless truly necessary, or include “decline to specify” +- When questions can’t accommodate a free text field, include “gender not listed here” for those who have an answer but don’t see it reflected in the form +- Allow for edits +- Allow for the removal of old data + +## Sources + +This zine draws from material I gathered for a longer blog post: [leecat.art/gender-in-data](/gender-in-data) + +Linked in that blog post are numerous sources; the most heavily relied on here was from Drupal’s documentation and is found under the section headed “Do you need gender data?” + +## Author + +Lee Cattarin is a transgender software developer and artist based out of Vashon, WA, USA. All hir creative work can be found at [leecat.art](/) + +Get in touch with hir via any of the methods listed on [leecat.art/contact](/contact) + +![A small stamp depicting Lee's face next to a speech bubble in handwritten text that reads 'Thanks for reading!'. Below that, the word 'editors' in quotes, and stamps of a fluffy dog and 6 variously-patterned ducklings](/img/2024/gender-zine-stamps.png) diff --git a/src/posts/2024/2024-02-29-snap-pouch.md b/src/posts/2024/2024-02-29-snap-pouch.md new file mode 100644 index 0000000..6c9a25b --- /dev/null +++ b/src/posts/2024/2024-02-29-snap-pouch.md @@ -0,0 +1,11 @@ +--- +title: snap pouch +image: + src: 2024/snap-pouches.jpg + alt: "4 square pouches that close with snaps. 2 have loops that attach keyrings. They are in various colors of leather." +tags: + - gallery + - leather +--- + +simple pouch for coins, notions, what have you diff --git a/src/posts/2024/2024-03-02-tiny-portraits.md b/src/posts/2024/2024-03-02-tiny-portraits.md new file mode 100644 index 0000000..1fc74e1 --- /dev/null +++ b/src/posts/2024/2024-03-02-tiny-portraits.md @@ -0,0 +1,11 @@ +--- +title: tiny portraits +image: + src: 2024/tiny-portrait-stamps.jpg + alt: "A collage showing various small (around an inch) stamps that depict people or animals." +tags: + - gallery + - print +--- + +currently offering these free [in the shop](https://riverside-refuge.square.site/product/tiny-personal-pet-portrait-stamp/111){target="_blank" rel="external"} with the code FREESTAMP diff --git a/src/posts/2024/2024-03-18-triangle-pouch.md b/src/posts/2024/2024-03-18-triangle-pouch.md new file mode 100644 index 0000000..f0bfb8c --- /dev/null +++ b/src/posts/2024/2024-03-18-triangle-pouch.md @@ -0,0 +1,11 @@ +--- +title: triangle pouch +image: + src: 2024/triangle-pouch.jpg + alt: "5 small triangular pouches made of leather in two sizes and various colors." +tags: + - gallery + - leather +--- + +there's snaps on both sides. diff --git a/src/posts/2024/2024-03-23-oppositional-sexism.md b/src/posts/2024/2024-03-23-oppositional-sexism.md new file mode 100644 index 0000000..29ff45d --- /dev/null +++ b/src/posts/2024/2024-03-23-oppositional-sexism.md @@ -0,0 +1,59 @@ +--- +title: fd signifier & oppositional sexism +image: + src: 2024/sheep.jpg + alt: "Image unrelated to post. A mama sheep with two babies curled up next to her in a grassy field." +tags: + - reference + - gender +--- + +This is in response to an F.D Signifier video, [How to get RICH off weak men!](https://www.youtube.com/watch?v=1QNjwM2a87g){target="_blank" rel="external"} (go follow him!). It is written as a response video and the script has not been changed to fit this format. + +As much as it's a response video, I think the content should also stand on its own. + +--- + +Recently I watched an FD Signifier video that I'll link in the description, currently titled "How to get rich off weak men" + +Now, overall, fucking excellent, you're great FD, you're very much someone I look up to. So let's ground things by stating I don't say any of this to disagree or denigrate any of your points, but rather to build on them. + +## oppositional sexism + +what we're going to start and end with today is a concept called **oppositional sexism**. This comes from Julia Serano writing in Whipping Girl. + +In addition to **traditional sexism**, where men are better than women and masculinity better than femininity, Serano argues that we also experience and propagate oppositional sexism, where men are seen as women's opposites. from Whipping Girl: + +> the belief that female and male are rigid, mutually exclusive categories, each possessing a unique and nonoverlapping set of attributes, aptitudes, abilities, and desires + +oppositional sexism positions men as opposed to women, rather than understanding both groups as heavily overlapping in characteristics, abilities, interests, physicality, etc. + +where analysis based in traditional sexism takes the gender binary as fact and analyzes how we move within it, oppositional sexism takes aim at the gender binary itself and looks at the ways that it is constructed. + +## how we socialize boys + +now what does this have to do with FD's video? Well, I would characterize his analysis as grounded in, among many other things, an understanding of traditional sexism. He talks about the ways boys learn about maleness and masculinity and its dominence over femaleness and femininity, but never questions the existence of the category "boy" in opposition to "girl". + +And I think we have to! we can't just examine misogyny and toxic masculinity while unconsciously accepting the creation of binary gender, because the creation of and pressure on binary gender helps create misogyny and toxic masculinity. When boys are continuously told they are wildly different from girls, when they are continuously split up and separated, when girls are portrayed as almost a different species, we invite unhealthy attitudes about women and girls. + +this is of course hypothetical - we live in a society and can't escape it - but if instead we stressed that all children are human, that they are part of a unified group, i can't help but imagine that we would have much healthier attitudes towards sex and dating. + +## how this affects us all + +now, obviously, the deconstruction of misogyny is enough reason to use this for analysis. we want to minimize misogyny and toxic masculinity, and this supports that goal. but let's also talk about the way bioessentialism and binary gender roles foster other biases. + +transphobia and particularly anti-nonbinary sentiments are probably the most obvious ones propped up by this, but there's also: + +- homophobia or biphobia: when we view men and women as two discrete and opposing groups, there's a large difference between a male-female relationship and a male-male or female-female one. + +- intersex erasure and discrimination: the coercive and corrective sexing of intersex infants, up to and including nonconsensual surgical modification, should be the obvious example, but let's also consider the ways that intersex people are erased by the gender binary. Intersex people are not uncommon, with various estimates ranging from one in two thousand to one in about sixty. But the structure of the gender binary *must* insist that they are essentially one in a million. it makes no room for them - they *must* be outliers. + +and, interestingly, + +- racism: the creation of distinct and biologically separate groups from a spectrum of human experience, and the clear statement that these groups *must be* unequal, can prime people to accept further distinctions between humans as biologically inherent. anecdotally, while I was forming up this video, friends reported seeing manosphere or MRA types fall down this exact pipeline. + +Now, I want to be clear: I am not claiming that misogyny or the gender binary is the root of all other biases. I think the world is far more complex than that. But I do believe that the gender binary, and more broadly, a binarist mindset, is a fertile breeding ground for other biases. + +## end notes + +going forward, I want you to have the concept of oppositional sexism in your analysis toolbox. I want you to think critically about the way that the gender binary is not a natural outgrowth of humanity, but rather created and enforced. And I want you to question and push back against the way that you - as a man or woman - see yourself in opposition to, rather than in alliance with, women or men (nonbinary people, you get a pass here, I figure you're already thinking about this). diff --git a/src/posts/2024/2024-07-11-kniphofia.md b/src/posts/2024/2024-07-11-kniphofia.md new file mode 100644 index 0000000..f8bc2f8 --- /dev/null +++ b/src/posts/2024/2024-07-11-kniphofia.md @@ -0,0 +1,11 @@ +--- +title: kniphofia +image: + src: 2024/kniphofia-print.jpg + alt: "A print of a brightly colored flower in 4 layers of color" +tags: + - gallery + - print +--- + +a reduction print. total print run of 33. diff --git a/src/posts/2024/2024-07-11-luminescent.md b/src/posts/2024/2024-07-11-luminescent.md new file mode 100644 index 0000000..6233dd7 --- /dev/null +++ b/src/posts/2024/2024-07-11-luminescent.md @@ -0,0 +1,11 @@ +--- +title: luminescent +image: + src: 2024/luminescent-print.jpg + alt: "A print of a tattooed woman in bright highlighter yellow underwear." +tags: + - gallery + - print +--- + +a reduction print. total print run of 8 test prints and 18 final prints. diff --git a/src/posts/2024/2024-07-17-booby.md b/src/posts/2024/2024-07-17-booby.md new file mode 100644 index 0000000..6bffe84 --- /dev/null +++ b/src/posts/2024/2024-07-17-booby.md @@ -0,0 +1,13 @@ +--- +title: booby (congrats on the top surgery) +image: + src: 2024/booby-card.jpg + alt: "A landscape-oriented white card with a two-color print of a blue-footed booby." +tags: + - gallery + - print + - card + - gender +--- + +cheeky lil congrats on the top surgery card :D diff --git a/src/posts/2024/2024-08-08-no-politics.md b/src/posts/2024/2024-08-08-no-politics.md new file mode 100644 index 0000000..2a29b64 --- /dev/null +++ b/src/posts/2024/2024-08-08-no-politics.md @@ -0,0 +1,84 @@ +--- +title: no politics (wip) +image: + src: 2024/mushroom-on-fence.jpg + alt: "Picture unrelated to post. A small orange mushroom grows from the center of a fence post." +tags: + - reference +--- + +This piece is unfinished and is presented in only partial form. + +## Prelude + +5 or so years ago, I’m in a Facebook group. Rather than my usual lefty fare, it was more all-over-the-map; it was focused on socializing, support, and advice for younger employees at my current employer. + +Every once and a while, discussion would turn to something like: + +> I’m facing sexism at work… + +or any relevant comment about any -ism you can imagine. Unfortunately, there was no shortage of reply guys ready to diminish, second guess, disbelieve, and more. And as a “nonpartisan” space, it of course had a “no politics” rule! + +You can probably see what’s coming a mile away. + +--- + +## Politics + +> the total complex of relations between people living in society + +is how [Merriam-Webster defines politics](https://www.merriam-webster.com/dictionary/politics){target="_blank" rel="external"}. It is not the only definition, and it is not the first definition, but it’s nicely non-circular and doesn’t get us bogged down in what is and isn’t government policy. + +That might be a more expansive definition than what you’re used to. Let’s take a detour. + +### The Personal is Political + +The idea that “the personal is political” has been around since second-wave feminism, 1960s at least. For example, here’s the Combahee River Collective Statement referencing it in 1977, having already worked to further and expound on it: + +> A political contribution which we feel we have already made is the expansion of the feminist principle that the personal is political. + +— [Combahee River Collective Statement](https://www.blackpast.org/african-american-history/combahee-river-collective-statement-1977/){target="_blank" rel="external"} + +“The personal is political” and associated political movement is pushback against an insistence on individualizing systemic issues. Crenshaw frames it as a “process of recognizing as social and systemic what was formerly perceived as isolated and individual” ([Mapping the Margins: Intersectionality, Identity Politics, and Violence against Women of Color by Kimberlé Crenshaw](https://www.jstor.org/stable/1229039){target="_blank" rel="external"}) and it’s *vital* in our current understanding of things like sexual assault and domestic violence as — forgive me for repeating the word yet again — *systemic* issues. + +## What does “no politics” gain us? + +But why might people institute a “no politics” rule? + +### Easier moderation + +A frequent argument that gets made is that “we just don’t have the resources to moderate that.” Regardless of whether it’s right, this is what’s effective and what we have the bandwidth for. + +As a frequent moderator, I see the appeal in this. Political discussions can be tense, with high emotions and hard stances. After all, the personal is political - someone may not be speaking of some theoretical risk but to a concrete fear that hangs over their head daily. Members will get invested, and feelings will be hurt. + +### Create a welcoming, “neutral” environment + +Especially in environments where you want to welcome a large and diverse group of people, the aim should be to make the membership and prospective membership comfortable (possibly while also warding off trolls who want to argue). + +For some, "the law isn't about shaping society, it's about who gets punished" ([I Hate Mondays by Innuendo Studios](https://youtu.be/yts2F44RqFw?si=QZMJQWqahdJ4-1Eb&t=452){target="_blank" rel="external"}). Politics are a method of assigning blame. "No politics" means no one is to blame. + +## Interlude + +6 or so months ago, I'm in a Discord server. Rule 1 states that no politics or religion are allowed. Interestingly, it also states that "insults, racism, sexism, homophobia, transphobia, and all other discriminatory speech" are not permitted. + +## How do we better achieve our goals? + +### Easier moderation + +### Create a welcoming environment + +--- + +sections + +- what ethical goals does a no politics rule attempt to achieve +- how are those goals not met by no politics rules (not met/actively betrayed/only achievable for a subset of users) +- how can we better meet those goals? + +notes + +- there are ways to limit when and where this discussion is acceptable: create a news/politics channel, encourage spoilering/threading/using appropriate platform tools, encourage a culture that values cws and respects requests for them and more broadly respects people's boundaries +- there are ways to limit how "no politics" gets deployed: make specific rules against shutting down people talking about their lived experience, avoid backseat modding becoming the norm +- there are ways to limit your definition of "politics" so that you can more carefully delineate what you are trying to avoid, though I would be wary of this route - the fact is that a No Politics rule, no matter how well reasoned, may read as a red flag for a marginalized person + +[Politics of Political](https://blog.oup.com/2018/11/politics-of-political/){target="_blank" rel="external"} diff --git a/src/posts/2024/2024-08-10-rescue-trans-rescue.md b/src/posts/2024/2024-08-10-rescue-trans-rescue.md new file mode 100644 index 0000000..ac4890a --- /dev/null +++ b/src/posts/2024/2024-08-10-rescue-trans-rescue.md @@ -0,0 +1,16 @@ +--- +title: rescue Trans Rescue +image: + src: 2024/wood-ducks.jpg + alt: “Picture unrelated to post. A male and female wood duck in summer ‘eclipse’ plumage have a little tiff while standing on a log. to the right, the male has his neck extended and beak open; on the left, the female has a wing extended upwards.“ +tags: + - reference +--- + +Updated 13 Aug 2024 + +The content previously found on this page is now hosted on a standalone site. + +[Visit the site](https://rescue-trans-rescue.glitch.me){target="_blank" rel="external"}. + +(Site down? Not loading? [Check for issues with Glitch, our hosting provider](https://status.glitch.com/){target="_blank" rel="external"}.) diff --git a/src/posts/2024/2024-09-01-handedness-toggle.md b/src/posts/2024/2024-09-01-handedness-toggle.md new file mode 100644 index 0000000..87524cb --- /dev/null +++ b/src/posts/2024/2024-09-01-handedness-toggle.md @@ -0,0 +1,324 @@ +--- +title: handedness toggle +image: + src: 2024/handedness-toggle-0.png + alt: "A screenshot of the rescue trans rescue navbar centered on a button that shows a hand pointing left." +tags: + - reference + - software +--- + +Recently, I got an iPad for art and immediately fell down the rabbit hole of [Glitch](https://glitch.com){target="_blank" rel="external"} and web development. + +When creating the [rescue Trans rescue site](https://rescue-trans-rescue.glitch.com){target="_blank" rel="external"}, I started with a right-aligned navbar. While developing and testing on my iPad, I got in the habit of hovering my hand over the top-right corner of the tablet, always ready to try the light/dark toggle or switch pages. + +And then I thought about left-handed people - left handed tablet or touchscreen users in particular. Reaching across the screen repeatedly would start to be a real drag, wouldn't it? + +Ok, let's make a toggle! + +(Want to just see the outcome? Head on down the page to the [summary](#summary).) + +## the button + +First we'll need some HTML for our button. I added this to my menu: + +```html + +``` + +It's important to note here that I added it to the *beginning* of the menu list. I want it to be the first item in the list so that it points over the left side of the screen with nothing obstructing it. + +### handling narrow screens + +Let's quickly take a moment to ensure that the toggle only shows up on wider screens with a bit of CSS: + +```css +@media (max-width: 500px) { + #alignment { + display: none; + } +} +``` + +Now users on phones won't have an unhelpful button taking screen space. + +## nav.js + +Now let's move to `nav.js` and define some consts for ease of use. We're going to use [Font Awesome icons](https://fontawesome.com/icons){target="_blank" rel="external"} for this button, so we'll go grab their HTML for the left and right pointing hands. + +```js +const ALIGN = "alignment" +const LEFT = "left" +const RIGHT = "right" + +const LEFT_ICON = ''; +const RIGHT_ICON = ''; +``` + +We'll use `localStorage` to store and retrieve alignment preferences: + +```js +let align = localStorage.getItem(ALIGN); +``` + +and we'll grab the button we defined in HTML: + +```js +let alignToggle = document.getElementById(ALIGN); +``` + +### setting icons + +Next, let's structure out some functions. We'll fill them in more as we figure out what we need. + +```js +function setAlignRight() { + // If we're aligned on the right, the toggle should point to the left + alignToggle.innerHTML = LEFT_ICON; +} + +function setAlignLeft() { + // If we're aligned on the left, the toggle should point to the right + alignToggle.innerHTML = RIGHT_ICON; +} + +// This function changes the alignment to the given value +// It also runs at startup to set alignment +function changeAlign(align) { + switch (align) { + case LEFT: + setAlignLeft(); + break; + case null: + // If nothing is set, default to right alignment + align = RIGHT; + case RIGHT: + setAlignRight(); + break; + } + // Set localStorage for next time + localStorage.setItem(ALIGN, align); +} + +// Run at startup +changeAlign(); + +// This function handles the actual flip-flopping of the alignment value +function toggleAlign() { + if (align === LEFT) align = RIGHT; + else align = LEFT; + + changeAlign(align); +} + +// Attach the toggle function to the alignToggle as a click listener +alignToggle.addEventListener("click", toggleAlign); +``` + +So that gets us the basic functionality of changing the icon when the toggle is clicked. However, it does nothing for the navbar alignment. What do we need for that? + +### alignment + +Well, that depends on your navbar CSS. For this, let's run through the simplest possible version: your navbar is a flexbox and all items are treated equally. Maybe your CSS looks sorta like this: + +```css +#navbar { + position: sticky; + top: 0 px; + width: 100%; + display: flex; + /* This is the line that matters to us */ + /* we'll want to swap between flex-start and flex-end */ + justify-content: flex-end; +} +``` + +Let's add that `justify-content` setting to our JS (as well as a line to fetch the navbar by id): + +```js +let navbar = document.getElementById("navbar"); + +function setAlignRight() { + alignToggle.innerHTML = LEFT_ICON; + navbar.style.justifyContent = "flex-end"; + // If you have other necessary style changes, add them here +} + +function setAlignLeft() { + alignToggle.innerHTML = RIGHT_ICON; + navbar.style.justifyContent = "flex-start"; + // If you have other necessary style changes, add them here +} +``` + +Now, the menu should re-orient itself when we interact with the toggle. However, you'll notice that the left-aligned menu shows up in the same order as the right aligned menu: handedness toggle first, then the rest of the menu. + +(Forgive the lack of continuity with the header image.) + +![the navbar of this site in dark mode. from left to right, there's pink and blue icons of: a hand pointing right, images, file folder, user/person, opened mail, and a lightbulb.](/img/2024/handedness-toggle-1.png) + +### moving the button + +I don't want that; I want the handedness toggle to always point, unobstructed, to the side of the screen it moves things to. So let's move it around when we set alignment. It'll need to be the first item in the menu list for right-handed alignment, and the last item for left-handed. We can do that with `prepend()` and `append()`. + +```js +function setAlignRight() { + alignToggle.innerHTML = LEFT_ICON; + navbar.style.justifyContent = "flex-end"; + navbar.prepend(alignToggle); +} + +function setAlignLeft() { + alignToggle.innerHTML = RIGHT_ICON; + navbar.style.justifyContent = "flex-start"; + navbar.append(alignToggle); +} +``` + +Cool! Now we have a menu that re-aligns itself *and* repositions the alignment button. + +![The same navbar, now with elements reordered. The hand pointing right now lands at the end of the menu. Incidentally, the theme button has also been swapped and is at the start of the menu but that's not relevant.](/img/2024/handedness-toggle-2.png) + +### keyboard navigation + +Oooh, but wait: keyboard navigation is broken. + +When I tab over to the alignment button and hit `Enter`/`space`, it does what we expect, but it *also* loses keyboard focus. Because of that little `prepend()`/`append()` move, the element is removed from the DOM and re-added in a new location - now without focus. We'll need to add focus back to the `alignToggle` manually, so it's not lost. + +We can do that with the `.focus()` function: + +```js +function toggleAlign() { + if (align === LEFT) align = RIGHT; + else align = LEFT; + + changeAlign(align); + + // Replace focus on the toggle that's been moved + alignToggle.focus(); +} +``` + +Ok, now focus is maintained... but it also shows up after a mouse click, not just a keyboard interaction. That's a little irritating. How do we fix that? + +### managing focus + +`toggleAlign()` is an event handler, which means it can optionally take an `event` var. For "click" events, that `event` var includes a field `detail` which provides the *click count*. This can be used to disambiguate single vs double clicks, *or* it can be used to test for keyboard interaction, which creates *zero clicks*. + +Let's add that in: + +```js +function toggleAlign(event) { + if (align === LEFT) align = RIGHT; + else align = LEFT; + + changeAlign(align); + + // Zero clicks means this was a keyboard interaction + // Replace focus on the toggle that's been moved + if (event.detail === 0) alignToggle.focus(); +} +``` + +Now we should only replace visible focus for keyboard interactions. + +![Navbar showing handedness toggle in focus, pointing right. It has a bright blue outline, pink background, and dark icon image.](/img/2024/handedness-toggle-3.png) + +## thanks for reading + +Want to see further changes? Found a bug with this implementation? [Contact me](/contact)! + +--- + +## summary + +Here's the referenced HTML, CSS, and JS in full: + +### HTML + +```html + +``` + +### CSS + +```css +#navbar { + position: sticky; + top: 0 px; + width: 100%; + display: flex; + /* nav.js handles justify-content instead */ + /* justify-content: flex-end; */ +} + +/* Remove the handedness toggle on narrow screens */ +@media (max-width: 500px) { + #alignment { + display: none; + } +} +``` + +### JS + +```js +const ALIGN = "alignment" +const LEFT = "left" +const RIGHT = "right" + +const LEFT_ICON = ''; +const RIGHT_ICON = ''; + +let align = localStorage.getItem(ALIGN); +let alignToggle = document.getElementById(ALIGN); + +function setAlignRight() { + alignToggle.innerHTML = LEFT_ICON; + navbar.style.justifyContent = "flex-end"; + navbar.prepend(alignToggle); +} + +function setAlignLeft() { + alignToggle.innerHTML = RIGHT_ICON; + navbar.style.justifyContent = "flex-start"; + navbar.append(alignToggle); +} + +function changeAlign(align) { + switch (align) { + case LEFT: + setAlignLeft(); + break; + case null: + align = RIGHT; + case RIGHT: + setAlignRight(); + break; + } + localStorage.setItem(ALIGN, align); +} + +changeAlign(); + +function toggleAlign(event) { + if (align === LEFT) align = RIGHT; + else align = LEFT; + + changeAlign(align); + + if (event.detail === 0) alignToggle.focus(); +} + +alignToggle.addEventListener("click", toggleAlign); +``` diff --git a/src/posts/2024/2024-09-06-ubiquity-of-enby.md b/src/posts/2024/2024-09-06-ubiquity-of-enby.md new file mode 100644 index 0000000..e2022c7 --- /dev/null +++ b/src/posts/2024/2024-09-06-ubiquity-of-enby.md @@ -0,0 +1,34 @@ +--- +title: on the ubiquity of 'enby' +image: + src: 2024/gender-census.jpg + alt: "A screenshot of part of the Gender Census reports page, showing the header bar and a title that reads 'Gender Census 2023 Worldwide Report'" +tags: + - reference + - gender +--- + +(originally [posted on fedi](https://strangeobject.space/@inherentlee/113093311823169762){target="_blank" rel="external"}) + +--- + +update: in [gender census' 2025 report](https://www.gendercensus.com/results/2025-worldwide/#identity-words){target="_blank" rel="external"} the numbers continue to be very similar, sitting at about 62% and 30% respectively. + +--- + +update: in 2024, ~60% of respondents use "nonbinary." ~29% use "enby." + +--- + +according to [gender census](https://www.gendercensus.com){target="_blank" rel="external"}, which surveys "people whose genders are not adequately described, expressed or encompassed by the restrictive gender binary": + +- ~64% of respondents use the term "nonbinary" +- ~32% of respondents use the term "enby" + +source: [gender census - identity words](https://www.gendercensus.com/results/2023-worldwide/#identity-words){target="_blank" rel="external"} (this was a "choose all that apply" question, not "either/or") + +we don't know the overlap - it could be that half of nonbinary people also use enby, or that bunches of people use enby who don't call themselves nonbinary + +either way, there's a big chunk of nonbinary folks who don't call themselves enbies - at least half of us + +**if you're talking about the entire community or the gender category:** please consider just saying nonbinary diff --git a/src/posts/2024/2024-12-17-euphorbia.md b/src/posts/2024/2024-12-17-euphorbia.md new file mode 100644 index 0000000..814e15c --- /dev/null +++ b/src/posts/2024/2024-12-17-euphorbia.md @@ -0,0 +1,11 @@ +--- +title: euphorbia +image: + src: 2024/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." +tags: + - gallery + - print +--- + +I am euphorbic. diff --git a/src/posts/2024/2024-12-17-fedizinefest-2025.md b/src/posts/2024/2024-12-17-fedizinefest-2025.md new file mode 100644 index 0000000..9fc9317 --- /dev/null +++ b/src/posts/2024/2024-12-17-fedizinefest-2025.md @@ -0,0 +1,11 @@ +--- +title: fediZineFest 2025 +image: + src: 2024/fedizinefest-2025.png + alt: "A logo in purple, yellow, blue, and green. A piece of paper folded into 8 sections reads FEDI ZINE; it resembles the classic folding pattern of a simple 8-page zine made from printer paper. Next to it, a fully folded zine reads fest 2025." +tags: + - reference + - zine +--- + +FediZineFest returns for its second year. Read more about it and sign up on the [fediZineFest 2025 website](https://fedizinefest.fyi){target="_blank" rel="external"}. diff --git a/src/posts/2024/2024-12-17-greeting-quorb.md b/src/posts/2024/2024-12-17-greeting-quorb.md new file mode 100644 index 0000000..40aef56 --- /dev/null +++ b/src/posts/2024/2024-12-17-greeting-quorb.md @@ -0,0 +1,12 @@ +--- +title: greeting quorbs +image: + src: 2024/greeting-quorbs.jpg + alt: "A pile of hand-printed A2 size greeting cards. Only the front is visible, showing a particularly round quail." +tags: + - gallery + - card + - print +--- + +Original print greeting cards. diff --git a/src/posts/2024/2024-12-17-lobstah.md b/src/posts/2024/2024-12-17-lobstah.md new file mode 100644 index 0000000..91a56e8 --- /dev/null +++ b/src/posts/2024/2024-12-17-lobstah.md @@ -0,0 +1,11 @@ +--- +title: lobstah +image: + src: 2024/lobstah.jpg + alt: "Two red leather lobster ornaments, about 4-5 in long each." +tags: + - gallery + - leather +--- + +From a pattern by Buckleguy. diff --git a/src/posts/2024/2024-12-17-long-stitch-journals.md b/src/posts/2024/2024-12-17-long-stitch-journals.md new file mode 100644 index 0000000..e12961a --- /dev/null +++ b/src/posts/2024/2024-12-17-long-stitch-journals.md @@ -0,0 +1,12 @@ +--- +title: leather long-stitch journals +image: + src: 2024/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." +tags: + - gallery + - leather + - book +--- + +Variety of leather-bound journals. See the [shop listing](https://riverside-refuge.square.site/product/leather-bound-journal/136){target="_blank" rel="external"} for paper and size details. diff --git a/src/posts/2024/2024-12-17-not-a-drill.md b/src/posts/2024/2024-12-17-not-a-drill.md new file mode 100644 index 0000000..dc7641a --- /dev/null +++ b/src/posts/2024/2024-12-17-not-a-drill.md @@ -0,0 +1,12 @@ +--- +title: not a drill +image: + src: 2024/not-a-drill-print.jpg + alt: "A print in dark teal ink depicting a power drill with text in cursive below that reads 'ceci n'est pas un exercice' or 'this is not a drill'" +tags: + - gallery + - print + - shirt +--- + +Idea by [Cassandra](https://wandering.shop/@xgranade/113608928092866523){target="_blank" rel="external"}. diff --git a/src/posts/2024/2024-12-17-quorbs.md b/src/posts/2024/2024-12-17-quorbs.md new file mode 100644 index 0000000..fa0e4bd --- /dev/null +++ b/src/posts/2024/2024-12-17-quorbs.md @@ -0,0 +1,12 @@ +--- +title: quorbs +image: + src: 2024/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." +tags: + - gallery + - print + - highlight +--- + +Based on a beautiful photograph by [Jessamyn](https://sunny.garden/@handmade_ghost/113583875628309689){target="_blank" rel="external"} diff --git a/src/posts/2024/2024-12-18-brown-creeper.md b/src/posts/2024/2024-12-18-brown-creeper.md new file mode 100644 index 0000000..60244d7 --- /dev/null +++ b/src/posts/2024/2024-12-18-brown-creeper.md @@ -0,0 +1,13 @@ +--- +title: brown creeper +image: + src: 2024/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." +tags: + - gallery + - print +--- + +Created for [Stanza 2024](https://www.pushpullseattle.com/news/stanza-2024-non-binary){target="_blank" rel="external"}, a show highlighting nonbinary artists and poets. + +My art was inspired by the fantastic poem "A blurred arboreal" by [Lore Kahuapāʻani](https://pacing.space){target="_blank" rel="external"}. diff --git a/src/posts/2024/2024-12-18-fountain-pens-stationery.md b/src/posts/2024/2024-12-18-fountain-pens-stationery.md new file mode 100644 index 0000000..dca7d0e --- /dev/null +++ b/src/posts/2024/2024-12-18-fountain-pens-stationery.md @@ -0,0 +1,26 @@ +--- +title: fountain pen-friendly stationery +image: + src: 2024/wax-seals.jpg + alt: "Two envelopes with wax seals. The top envelope is cream with a copper-and-white swirled seal depicting a yelling possum holding mail. The bottom envelope is marbled blue, black, and gold, with a white-and-blue swirled seal depicting an octopus holding a fountain pen." +tags: + - reference + - stationery +--- + +Wax seals pictured from [boygirlparty](https://hello.boygirlparty.com){target="_blank" rel="external"}. + +## Excellent + +- [Alexa Pulitzer](https://alexapulitzer.com){target="_blank" rel="external"} +- [ilee paper goods](https://www.ileepapergoods.com){target="_blank" rel="external"} +- [MsDesignInked suminagashi note cards](https://www.etsy.com/shop/MsDesignInked){target="_blank" rel="external"} +- [Noat](https://noat.co){target="_blank" rel="external"} +- [Saturn Press](https://www.saturnpress.us){target="_blank" rel="external"} +- [Shaven Raven Designs](https://www.shavenravendesigns.com){target="_blank" rel="external"} +- [Worthwhile Paper](https://worthwhilepaper.com/){target="_blank" rel="external"} +- [Embossed Graphics](https://www.embossedgraphics.com){target="_blank" rel="external"} + +## Mediocre + +- [Pike Street Press](https://pikestreetpress.com){target="_blank" rel="external"} - some feathering on cards diff --git a/src/posts/2024/2024-12-20-greeting-loon.md b/src/posts/2024/2024-12-20-greeting-loon.md new file mode 100644 index 0000000..90d619b --- /dev/null +++ b/src/posts/2024/2024-12-20-greeting-loon.md @@ -0,0 +1,13 @@ +--- +title: greeting loons +image: + src: 2024/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." +tags: + - gallery + - card + - print + - highlight +--- + +Original print greeting cards. diff --git a/src/posts/2024/2024-12-20-happy-solstice-2024.md b/src/posts/2024/2024-12-20-happy-solstice-2024.md new file mode 100644 index 0000000..8f0615f --- /dev/null +++ b/src/posts/2024/2024-12-20-happy-solstice-2024.md @@ -0,0 +1,8 @@ +--- +title: happy solstice 2024 +image: + src: 2024/solstice-2024.png + alt: "A digital card with front and back stitched together into one image. Front - a collage of photos - brooke with blue hair and kestrel wiggling in her lap; kestrel on his back with one back paw clutched in his mouth; lee sitting holding some custom art of kestrel, showing kestrel the pictures; lee looking intently through a long camera lens; brooke, back to the camera, swaggering across tidal flats in her hand-stitched jacket. over the photos, hand-lettering reads 'happy solstice!' in two shades of pink. Back - two photos - the duckies clustered around the camera; and kestrel leaping gracefully through shallow water with his tongue out in a blep. Overlaid text reads '~ Lee, Brooke, Kestrel, & the Flock'" +--- + +Hand-lettered digitally. Happy Solstice to you and yours.