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
brown-creeper/index.html
+205 -41
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>
@@ -1611,8 +1760,22 @@ if (window.innerWidth > 650) {
<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>
<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">
</a>
</li>
<li class="post">
<a class="postlink" href="/heron/">
<h2 data-ha-exclude="" id="heron">heron </h2>
<ul class="postlist-tags">
@@ -1620,48 +1783,28 @@ if (window.innerWidth > 650) {
<li>card</li>
<li>sticker</li>
<li>shirt</li>
<li>pin</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">
</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/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="/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">
</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">
<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>
@@ -1694,9 +1837,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 `/brown-creeper/` was built on 2026-09-08T23:18:32.764Z -->
<!-- This page `/brown-creeper/` was built on 2026-09-09T20:38:02.899Z -->
</body>
</html>