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

drone build Wed Sep 9 13:38:19 PDT 2026

Browse Source
This commit is contained in:
inherentlee
2026-09-09 20:38:19 +00:00
parent b8e29f5717
commit 33995d363c
298 changed files with 54051 additions and 3977 deletions
Download Patch File Download Diff File Expand all files Collapse all files
euphorbia/index.html
+212 -46
View File
@@ -478,6 +478,13 @@ body:has(dialog[open]) {
--color-grey: light-dark(var(--color-grey-dark), var(--color-grey-light));
}
:root:has(#theme-light:checked) {
color-scheme: light;
}
:root:has(#theme-dark:checked) {
color-scheme: dark;
}
/* Base */
* {
@@ -621,7 +628,7 @@ ul, ol, dl, li {
}
li {
line-height: 1.2 5;
line-height: 1.2;
margin-top: .65rem;
margin-bottom: .65rem;
}
@@ -960,6 +967,111 @@ footer a:focus-visible {
outline-color: var(--color-pink);
}
/* color picker */
#theme {
display: flex;
justify-content: center;
margin: .5rem auto 0;
padding: 0 .75rem .5rem;
width: fit-content;
border: .125rem solid var(--color-teal);
border-radius: 2rem;
}
#theme legend {
margin: 0 auto;
color: var(--color-teal);
}
footer label {
cursor: pointer;
border: .125rem solid var(--color-pink);
padding: 0 .25rem;
color: var(--color-pink);
background-color: var(--color-bg); /* this stops the box shadows from showing through */
box-shadow: .15em .15em var(--color-shadow);
/* Click animation handling */
position: relative;
top: 0;
left: 0;
transition: top .05s ease-in, left .05s ease-in;
}
footer input:checked + label {
color: var(--color-blue);
border-color: var(--color-blue);
}
footer label i {
color: var(--color-teal);
}
footer input:checked + label i {
color: var(--color-pink);
}
@media (any-hover: hover) {
footer label:hover,
footer input:checked + label:hover,
footer label:hover i,
footer input:checked + label:hover i {
color: var(--color-bg);
}
footer label:hover {
background-color: var(--color-pink);
}
footer input:checked + label:hover {
background-color: var(--color-teal);
}
}
footer input:focus-visible + label,
footer input:focus-visible + label i {
color: var(--color-bg);
background-color: var(--color-pink);
border-color: var(--color-pink);
}
footer input:checked:focus-visible + label,
footer input:checked:focus-visible + label i {
color: var(--color-bg);
background-color: var(--color-teal);
border-color: var(--color-teal);
}
footer label:active {
top: .09em;
left: .09em;
box-shadow: .05em .05em var(--color-shadow);
}
label.theme-light {
border-top-left-radius: 1rem;
border-bottom-left-radius: 1rem;
border-right: none;
padding-left: .35rem;
}
label.theme-auto {
}
label.theme-dark {
border-top-right-radius: 1rem;
border-bottom-right-radius: 1rem;
border-left: none;
padding-right: .35rem;
}
footer input {
/* To allow screen reader to still access these. */
/* From https://lyra.horse/blog/2025/08/you-dont-need-js/ */
opacity: 0;
position: absolute;
pointer-events: none;
}
/* Pagination */
.pagination,
.pagination li {
@@ -1222,6 +1334,8 @@ pre[class*=language-]::selection {
}
}</style>
<script type="module">// Thank you to https://github.com/daviddarnes/heading-anchors
// Thank you to https://amberwilson.co.uk/blog/are-your-anchor-links-accessible/
@@ -1476,6 +1590,41 @@ if (window.innerWidth > 650) {
dialog.close();
}
});
}
const THEME = "theme";
const saveTheme = (themeValue) => {
localStorage.setItem(THEME, themeValue);
};
const themeLight = document.getElementById("theme-light");
themeLight.addEventListener("input", (e) => {
saveTheme(themeLight.value);
});
const themeAuto = document.getElementById("theme-auto");
themeAuto.addEventListener("input", (e) => {
saveTheme(themeAuto.auto);
});
const themeDark = document.getElementById("theme-dark");
themeDark.addEventListener("input", (e) => {
saveTheme(themeDark.value);
});
var currentThemeValue = localStorage.getItem(THEME);
switch (currentThemeValue) {
case "light":
themeLight.checked = true;
break;
case "auto":
themeAuto.checked = true;
break;
case "dark":
themeDark.checked = true;
break;
default:
themeAuto.checked = true;
}</script>
</head>
@@ -1610,48 +1759,8 @@ if (window.innerWidth > 650) {
<ol id="postlist">
<li class="post">
<a class="postlink" href="/girldick/">
<h2 data-ha-exclude="" id="girldick-mature">girldick (mature)</h2>
<ul class="postlist-tags">
<li>print</li>
<li>sticker</li>
<li>shirt</li>
<li>pin</li>
<li>gender</li>
</ul>
<img src="/img/girldick-shirt.jpg" alt="A butch cooking and wearing a cropped tee with blue cap sleeves that reads girldick in blue G.I.Joe font." class="blur" loading="lazy" decoding="async" width="1000" height="750">
</a>
</li>
<li class="post">
<a class="postlink" href="/kestrel-zine/">
<h2 data-ha-exclude="" id="kestrel-zine">kestrel zine </h2>
<ul class="postlist-tags">
<li>print</li>
<li>zine</li>
<li>highlight</li>
</ul>
<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="/foxgloves/">
<h2 data-ha-exclude="" id="foxgloves">foxgloves </h2>
<a class="postlink" href="/trans-wrongs-skull/">
<h2 data-ha-exclude="" id="trans-wrongs-skull">trans wrongs skull </h2>
<ul class="postlist-tags">
@@ -1659,10 +1768,46 @@ if (window.innerWidth > 650) {
<li>card</li>
<li>shirt</li>
<li>sticker</li>
<li>pin</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-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>
<ul class="postlist-tags">
<li>print</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">
</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>
<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">
</a>
</li>
@@ -1695,9 +1840,30 @@ if (window.innerWidth > 650) {
</a>
</li>
</ul>
<fieldset id="theme">
<legend>color scheme</legend>
<input type="radio" id="theme-light" name="theme" value="light">
<label class="theme-light" for="theme-light">
<i class="fa-regular fa-sun" aria-hidden="true"></i>
light
</label>
<input type="radio" id="theme-auto" name="theme" value="auto">
<label class="theme-auto" for="theme-auto">
auto
</label>
<input type="radio" id="theme-dark" name="theme" value="dark">
<label class="theme-dark" for="theme-dark">
dark
<i class="fa-regular fa-moon" aria-hidden="true"></i>
</label>
</fieldset>
</footer>
<!-- This page `/euphorbia/` was built on 2026-09-08T23:18:32.764Z -->
<!-- This page `/euphorbia/` was built on 2026-09-09T20:38:02.898Z -->
</body>
</html>