2 files changed, 168 insertions, 0 deletions
diff --git a/served/bits/scrap/scrap.css b/served/bits/scrap/scrap.css
new file mode 100644
index 0000000..c863c7b
--- /dev/null
+++ b/served/bits/scrap/scrap.css
@@ -0,0 +1,73 @@
+/* wide */
+@media (min-width: 44rem) {
+	.left {
+		float: left;
+		width: 50%;
+		margin: 0 16px 16px 0;
+	}
+
+	.right {
+		float: right;
+		width: 50%;
+		margin: 0 0 16px 16px;
+	}
+
+	.smright {
+		float: right;
+		width: 25%;
+		margin: 0 0 16px 16px;
+	}
+}
+
+/* narrow */
+@media (max-width: 44rem) {
+
+	.left,
+	.right {
+		display: block;
+		margin: 8px auto 16px auto;
+		width: min(50vh, 100%);
+	}
+
+	.smright {
+		float: right;
+		width: 96px;
+		margin: 0 0 16px 16px;
+	}
+}
+
+article {
+	overflow-y: auto;
+}
+
+article>header {
+	display: flex;
+	flex-direction: row;
+	gap: 16px;
+	padding-bottom: 8px;
+	align-items: center;
+}
+
+header>h2 {
+	margin: 0;
+}
+
+header>time,
+header>p {
+	color: var(--text-dim);
+	height: min-content;
+}
+
+header>p {
+	font-style: italic;
+	margin: 0;
+}
+
+article>p {
+	margin-top: 0;
+	margin-bottom: 16px;
+}
+
+article>p:last-of-type {
+	margin-bottom: inherit;
+}
\ No newline at end of file
diff --git a/served/bits/scrap/scrap.html b/served/bits/scrap/scrap.html
new file mode 100644
index 0000000..0bf68ad
--- /dev/null
+++ b/served/bits/scrap/scrap.html
@@ -0,0 +1,95 @@
+---
+template=post
+title=Scrap
+style=scrap.css
+style=/styles/post.css
+---
+[@paragraphs off]
+
+<p>
+	I walk around a lot. Quite a bit, really! And I tend to notice weird little bits on the ground.
+	I pick these things up and cherish them.
+	And I'll catalog them here. My good little bits of scrap :D
+</p>
+
+<article id="wrench_2023-08-07">
+	<header>
+		<h2>Wrench</h2>
+		<time datetime="2023-08-07">Aug 7th, 2023</time>
+	</header>
+
+	<img src="wrench-2023-08-07/wrench_third.jpg" class="left" alt="a half-inch wrench sitting on an open palm." />
+	<p>
+		look at my wrench! I found it in a crack! Where a parking-lot-blacktop met the concrete transition
+		from the road. I'm quite surprised I saw it; It was very well hidden. While I was
+		walking over it I noticed a glimmer, kept walking, and then double-took with a
+		sort of "what was that?" And there it was!
+	</p>
+	<p>
+		It's of the half-inch variety, a crescent on one end and a box-head the other. Oh, it's just so good! A proper
+		spanner! This find elates me so.
+	</p>
+</article>
+
+<svg viewBox="0 0 1000 20" preserveAspectRatio="xMidYMid slice" xmlns="http://www.w3.org/2000/svg"
+	style="height: 2em; width: 100%;" role="heading" aria-level="2" id="prehistory"> <!-- aria match h2 -->
+	<style>
+		.text {
+			font: italic 16px sans-serif;
+		}
+	</style>
+	<path d="M 0 11 L 1000 11" stroke="var(--text)" stroke-width="0.5"></path>
+	<rect x="462.5" y="0" width="77.5" height="20" fill="var(--background)" stroke="var(--background)" />
+	<text x="465" y="16" class="text" stroke="var(--text)" fill="var(--text)" stroke-width="0.1">prehistory</text>
+</svg>
+
+<article id="aeropostale-prehistory">
+	<header>
+		<h2>Belt Buckle</h2>
+		<p>time forgotten</p>
+	</header>
+
+	<img src="aeropostale-prehistory/dramatic_third.jpg" class="right"
+		alt="a belt buckle branded Aeropostale in cursive, stylized writing sitting on bricks." />
+	<p>
+		This little guy I found next to a brick, industrial building in Bensenville, Illinois. I was
+		very excited to find it! It's a belt buckle! That's so weird! How was it separated from
+		it's lengthy leather companion?
+	</p>
+	<p>
+		The body of the buckle seems to be some kind of stainless steel, but I can't be sure. It
+		has "Aéropostale" written on the frame where you might thread the belt material through.
+		The branding appears to be cast into it. The bar is very rusty and I would guess is a kind
+		of mild steel.
+	</p>
+</article>
+
+<article id="grace-prehistory">
+	<header>
+		<h2>Grace</h2>
+		<time datetime="2022-09">Sep, 2022</time>
+	</header>
+
+	<img src="grace-prehistory/top_third.jpg" class="left"
+		alt="a small, metal placard with the word grace written on it haphazardly in varying tones of grey. there is a color test chart in the top-left corner." />
+	<p>
+		I found this walking through an under-construction bike path. It was mysteriously lying in a mound of dirt along
+		the path.
+	</p>
+	<p>
+		The metal feels lighter than steel and it's not magnetic; it might be made of aluminum? The writing feels rough.
+		I think
+		it's an etching or engraving.
+	</p>
+	<img src="grace-prehistory/testchart_quarter.jpg" class="smright"
+		alt="The top-left corner of the placard cropped on the colour chart" />
+	<p>
+		The little colour test chart is very interesting. Along the top it's labelled A through D
+		and the side 1 through 6. Only sixteen of the positions appear to have a colour. Most are
+		shades of yellow or grey. A-2 is a very nice blue, C-5 a pleasing pink. They get darker as
+		the rows go down, the sixth being too dark to make out much hue.
+	</p>
+</article>
+
+<p style="font-style: italic; max-width: 20rem; margin: 0 auto">i have lots more prehistory to add as i go through my
+	little box and take photos</p>
\ No newline at end of file