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

build

Browse Source
This commit is contained in:
Lee Cattarin
2026-05-13 20:44:22 -07:00
parent e615e6a91f
commit 72c5904c27
282 changed files with 24948 additions and 3780 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
_site/foxgloves/index.html
View File

@ -457,6 +457,90 @@ pre[class*=language-]::selection {
.tag:nth-child(odd) p {
text-align: right;
}
img[tabindex="0"]:focus-visible {
outline: .15rem solid var(--color-teal);
}
dialog {
margin: auto;
flex-flow: column;
background: transparent;
border: none;
position: absolute;
}
dialog[open] {
display: flex;
}
dialog::backdrop {
background-color: rgba(from var(--color-bg) r g b / .8);
backdrop-filter: blur(4px);
}
body:has(dialog[open]) {
overflow: hidden;
}
.close-dialog {
background-color: rgba(from var(--color-teal) r g b / .2);
font-size: 1.5rem;
padding: 0 .5rem .15rem;
border-radius: 1rem;
color: var(--color-teal);
box-shadow: .15rem .15rem var(--color-shadow);
border: .08rem solid var(--color-teal);
align-self: flex-end;
justify-self: flex-start;
margin: 0 .1rem;
/* Click animation handling */
position: relative;
top: 1rem;
left: -.15rem;
transition: top .1s ease-in, left .1s ease-in;
}
.close-dialog:focus-visible {
outline: none;
background-color: var(--color-teal);
color: var(--color-bg);
}
@media (any-hover: hover) {
.close-dialog:hover {
outline: none;
background-color: var(--color-teal);
color: var(--color-bg);
}
}
@media (forced-colors: active) {
.close-dialog:focus-visible {
outline-offset: .08rem;
outline: .08rem solid;
}
@media (any-hover: hover) {
.close-dialog:hover {
outline-offset: .08rem;
outline: .08rem solid;
}
}
}
/* Click animation */
.close-dialog:active {
top: 1.1rem;
left: -.05rem;
box-shadow: .05rem .05rem var(--color-shadow);
}
.modal-img {
max-height: calc(90vh - 2rem);
object-fit: contain;
width: auto;
margin: 0 1rem;
}
:root {
color-scheme: light dark;
@ -637,7 +721,6 @@ span.ha-placeholder {
opacity: .55;
}
/* Lists */
::marker {
color: var(--color-pink);
@ -1351,7 +1434,29 @@ class HeadingAnchors extends HTMLElement {
HeadingAnchors.register();
export { HeadingAnchors }</script>
export { HeadingAnchors }
/* don't even bother on mobile */
if (window.innerWidth > 650) {
const dialog = document.querySelector("dialog");
const closeButton = document.querySelector(".close-dialog");
const hero = document.querySelector(".hero");
hero.addEventListener("click", (e) => dialog.showModal());
hero.addEventListener("keydown", (e) => {
if (e.key === "Enter" || e.key === " ") {
e.preventDefault();
dialog.showModal();
}
});
closeButton.addEventListener("click", (e) => dialog.close());
closeButton.addEventListener("keydown", (e) => {
if (e.key === "Enter" || e.key === " ") {
e.preventDefault();
dialog.close();
}
});
}</script>
</head>
<body>
@ -1411,6 +1516,8 @@ export { HeadingAnchors }</script>
<heading-anchors content="<i class='fa-solid fa-anchor'></i>">
<article>
<h1 id="foxgloves">foxgloves</h1>
@ -1445,7 +1552,11 @@ export { HeadingAnchors }</script>
</div>
<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">
<dialog closedby="any" aria-label="image modal" tabindex="-1">
<button class="close-dialog" autofocus="" aria-label="close the image modal">&times;</button>
<img class="modal-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">
</dialog>
<img tabindex="0" class="hero" 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">
<h2 id="details">details</h2>
@ -1497,55 +1608,49 @@ export { HeadingAnchors }</script>
<ol id="postlist">
<li class="post">
<a class="postlink" href="/heron/">
<h2 data-ha-exclude="" id="heron">heron </h2>
<a class="postlink" href="/printmaking-paper-notes/">
<h2 data-ha-exclude="" id="printmaking-paper-notes">printmaking paper notes </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<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/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>
<li class="post">
<a class="postlink" href="/geese-trans-wrongs/">
<h2 data-ha-exclude="" id="geese-trans-wrongs">geese/trans wrongs </h2>
<a class="postlink" href="/rope-one/">
<h2 data-ha-exclude="" id="rope-one-mature">rope (one) (mature)</h2>
<ul class="postlist-tags">
<li>print</li>
<li>shirt</li>
<li>gender</li>
</ul>
<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">
<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="/hummingbird-become-ungovernable/">
<h2 data-ha-exclude="" id="hummingbird-become-ungovernable">hummingbird become ungovernable </h2>
<a class="postlink" href="/kestrel-zine/">
<h2 data-ha-exclude="" id="kestrel-zine">kestrel zine </h2>
<ul class="postlist-tags">
<li>print</li>
<li>card</li>
<li>zine</li>
<li>shirt</li>
<li>highlight</li>
</ul>
<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">
<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>
@ -1581,6 +1686,6 @@ export { HeadingAnchors }</script>
</footer>
<!-- This page `/foxgloves/` was built on 2026-05-06T18:04:11.571Z -->
<!-- This page `/foxgloves/` was built on 2026-05-14T03:43:28.016Z -->
</body>
</html>