From 75a097a018a0090f5902758353c578fce4aa2a25 Mon Sep 17 00:00:00 2001
From: Jake Vanderwerf <get@jakevanderwerf.ca>
Date: Sat, 23 May 2026 18:43:42 +0000
Subject: [PATCH] =CustomBlocks.php overhaul relatively complete. Also refactored the gallery in gallery.min.js and the jvbRenderGallery.

---
 src/glossary/style.scss |  109 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 109 insertions(+), 0 deletions(-)

diff --git a/src/glossary/style.scss b/src/glossary/style.scss
new file mode 100644
index 0000000..241e6ef
--- /dev/null
+++ b/src/glossary/style.scss
@@ -0,0 +1,109 @@
+:root {
+	--navWidth: 40vw;
+	@media (min-width: 768px) {
+		--navWidth: 22vw;
+	}
+}
+
+nav.glossary-index {
+	position: fixed;
+	top: 50%;
+	transform: translateY(-50%);
+	width: var(--navWidth);
+	right: -8px;
+	height: 60vh;
+	z-index: var(--z-3);
+
+	> ul {
+		--dir: column;
+		--align: flex-start;
+		--justify: flex-start;
+		--gap: 1px;
+		touch-action: pan-y;
+		max-height: 100%;
+		height: 100%;
+		width: 100%;
+		overflow: hidden auto;
+		scroll-behavior: smooth;
+	}
+	li, a {
+		flex: 1;
+		width: 100%;
+		height: max-content;
+		min-height: max(var(--chipchip), max-content);
+	}
+	a {
+		--justify: center;
+		padding: .25rem .5rem;
+		hyphens: auto;
+		background-color: rgba(var(--base),var(--op-45));
+		word-wrap: anywhere;
+		white-space: wrap;
+	}
+	a:hover,
+	a:focus,
+	a.active {
+		background-color: rgba(var(--action-0), var(--op-6));
+		color: var(--action-contrast);
+	}
+}
+.glossary dd {
+	margin-left: .5rem;
+	width: calc(100% + .75rem);
+}
+.glossary dd,
+.glossary dt {
+	position: relative;
+	left: 0;
+	transition: margin var(--trans-base),
+	left var(--trans-base),
+	width var(--trans-base);
+}
+.glossary dt:target,
+.glossary dt.active {
+	outline: none;
+	left: -1.5rem;
+	padding: 0;
+	color: rgb(var(--action-0));
+}
+	.glossary dt:target + dd,
+	.glossary dt.active + dd {
+		left: -1.5rem;
+	}
+
+main header,
+dl.glossary {
+	grid-column: full;
+	padding: 0 var(--navWidth) 0 2rem;
+	@media (min-width:768px) {
+		margin-left: auto;
+		max-width: var(--content);
+		margin-right: var(--navWidth);
+		padding-right: var(--btn);
+	}
+}
+
+@media (max-width: 768px) {
+	.glossary {
+		h2 {
+			font-size: var(--txt-medium);
+		}
+		p {
+			font-size: var(--txt-x-small);
+		}
+	}
+	.glossary-index {
+		li,a {
+			height: fit-content;
+		}
+		a {
+			font-size: var(--txt-x-small);
+			padding: .25rem;
+			min-height: 2em;
+		}
+	}
+
+	body:has(.glossary) h1 {
+		font-size: var(--txt-xx-large);
+	}
+}

--
Gitblit v1.10.0