Fix bad search label

Add a search bar to the site footer to search seirdy.one.

assets/css/dark.css

@@ -3,7 +3,9 @@
  * stays within the ideal APCA ranges, not lower and preferably not
  * higher either. */
 @media (prefers-color-scheme: dark) {
-	html {
+	button,
+	html,
+	input {
 		/* Pure white on black causes halation.
 		 * "background" is short for a bunch of unnecessary CSS rules
 		 * background-color is all I need.

assets/css/main.css

@@ -80,18 +80,15 @@ html {
 
 	/* Compensate for misalignment and wasted space caused by padding
 	 * and margin adjustments in nav children made to meet SC 2.5.5 */
-	dt > a,
-	header > nav,
 	footer > nav,
+	header > nav,
+	dt > a,
 	h2 + a {
 		margin-left: -.25em;
 	}
 	header > nav {
 		margin-bottom: -.75em;
 	}
-	footer > nav {
-		margin-top: -.75em;
-	}
 
 	summary {
 		/* The tappable region of a <summary> extends across the page.
@@ -110,12 +107,6 @@ html {
 		margin: .5em .25em;
 	}
 
-	/* Google a11y: ensure tap targets have >=8px space between them */
-	nav li,
-	li details li {
-		padding: 1em 0;
-	}
-
 	/* SC 2.5.5, Google a11y: Increase tap target size a bit
 	 * - Summary is a tappable button
 	 * - standalone links in lists are usually parts of collections of
@@ -126,7 +117,10 @@ html {
 	dt > a,
 	summary,
 	h2 + a,
-	li > a {
+	li > a,
+	nav li,
+	li details li,
+	input {
 		padding: .875em .25em;
 	}
 
@@ -181,6 +175,27 @@ nav ul li {
 	margin-right: .375em;
 }
 
+/* Make search box and submit button wide enough */
+form {
+	display: table;
+	width: 100%
+}
+
+input[type="search"] {
+	display: table-cell;
+	width: 100%;
+}
+
+form > div {
+	display: table-cell;
+	width: 1%;
+}
+
+/* Don't shrink the size of the text in forms. */
+input {
+	font-size: inherit;
+}
+
 /* narrow screens: reduce margin for blockquotes a lot, using
  * a border instead. Put it on the left and right to make it
  * LTR/RTL-neutral, for machine translators that change text
@@ -198,8 +213,9 @@ h1 {
 	hyphens: auto;
 }
 
-/* Very narrow screens: full hyphenation */
-@media (max-width: 13em) {
+/* Very narrow screens: full hyphenation.
+ * This is the typical width of a smart feature phone. */
+@media (max-width: 15em) {
 	body {
 		font-size: 100%;
 		-webkit-hyphens: auto;
@@ -270,6 +286,7 @@ pre {
  * too similar to the page background color. Also put a border around
  * <pre> and <code> to distinguish them in ways besides font-family.
  * This is Technique C25 of SC 1.4.8 */
+input,
 img,
 pre {
 	border: 1px solid;
@@ -305,7 +322,7 @@ picture > img {
 /* WCAG Technique C25: use borders to separate sections.
  * Also use "content-visibility: auto" to improve performance by
  * reducing the number of DOM nodes rendered at once. */
-aside,
+aside nav,
 footer,
 section[role="doc-endnotes"],
 section[aria-labelledby="webmentions"] {
@@ -326,11 +343,13 @@ section[aria-labelledby="webmentions"] {
 
 a:focus,
 summary:focus,
-pre[tabindex]:focus {
+pre[tabindex]:focus,
+form :focus {
 	outline: 3px solid;
 }
 
-/* Remove :focus styling for browsers that do support :focus-visible */
+/* Remove :focus styling for browsers that do support :focus-visible.
+ * Leave it on for form stuff. */
 @supports selector(:focus-visible) {
 	a:focus:not(:focus-visible),
 	summary:focus:not(:focus-visible),

assets/css/print.css

@@ -8,7 +8,7 @@
 
 	/* Hide screen-only content */
 
-	aside,
+	aside:not([role="note"]),
 	/* An un-opened summary inside an article has no use in print.
 	 * Outside an article it's used in my webring list where it has some
 	 * use, see below. */
@@ -17,7 +17,7 @@
 	 * useless in printouts. */
 	h2 + a,
   /* You can't navigate in a printout. */
-	footer nav,
+	footer,
 	nav a:not([rel="home"]) span {
 		display: none;
 	}

content/notes/answer-engines.md

@@ -2,9 +2,11 @@
 title: "Answer engines"
 date: 2022-05-25T19:59:08+00:00
 ---
-<p role="note">
+<aside role="note">
+
 Reply to {{< mention-work itemprop="about" itemtype="BlogPosting" reply=true >}}{{<cited-work name="Is DuckDuckGo, DuckDuckDone?" extraName="headline" url="https://kevq.uk/is-duckduckgo-duckduckdone/">}} by {{<indieweb-person first-name="Kev" last-name="Quirk" url="https://kevq.uk/about/" itemprop="author">}}{{</mention-work>}}
-</p>
+
+</aside>
 
 I read your article and share similar concerns. Using Microsoft Bing and Google Search's commercial APIs generally requires accepting some harsh terms, including a ban on mixing <abbr title="Search Engine Result Pages">SERPs</abbr> from multiple sources (this is why Ixquick shut down and the company pivoted to the Google-exclusive Startpage search service). But the requirement to allow trackers in a companion web browser was new to me.
 

content/notes/signal-security.md

@@ -0,0 +1,12 @@
+---
+title: "Signal security"
+date: 2022-05-26T12:18:24-07:00
+---
+<aside role="note">
+Reply to {{< mention-work itemprop="about" itemtype="SocialMediaPosting" reply=true >}}{{<cited-work name="europe wants to ban signal" url="https://disqordia.space/notice/AJqmgRLFlyVENIXcDA">}} by {{<indieweb-person name="chjara" url="https://tuxcrafting.online/" itemprop="author">}}
+{{</mention-work>}}
+</aside>
+
+What do you mean by "false sense of security"? Signal's cryptography is pretty solid. It's one of the only messengers with such a lack of metadata leakage; if you combine it with Tor you can add enough noise to the network-layer metadata to be more private than almost any alternative.
+
+Don't get me wrong, [I dislike it on the grounds of being a closed platform](https://seirdy.one/2021/01/27/whatsapp-and-the-domestication-of-users.html), but few alternatives exist that support both offline messaging and have such little metadata leakage. I'm willing to hear suggested alternatives that do not bake a "cryptographically-secure, decentralized pyramid scheme" (cryptocurrency) into the protocol. I'm not aware of any such alternative at the moment.

csv/webrings.csv

@@ -9,3 +9,4 @@ YesterWeb,https://webring.yesterweb.org/noJS/index.php?d=prev&url=https://seirdy
 Retronaut,https://webring.dinhe.net/prev/https://seirdy.one,https://webring.dinhe.net/,https://webring.dinhe.net/next/https://seirdy.one
 Hotline,https://hotlinewebring.club/seirdy/previous,https://hotlinewebring.club,https://hotlinewebring.club/seirdy/next
 Bucket (JS),https://webring.bucketfish.me/redirect.html?to=prev&name=seirdy,https://webring.bucketfish.me/,https://webring.bucketfish.me/redirect.html?to=next&name=seirdy
+Devring,https://devring.club/sites/5/prev,https://devring.club,https://devring.club/sites/5/next

layouts/partials/footer.html

@@ -2,6 +2,7 @@
 	<p>
 	Copyright<span aria-hidden="true"> ©</span> <time itemprop="copyrightYear" datetime="{{now.Year}}">{{now.Year}}</time> {{- partial "indieweb-author.html" -}}
 	</p>
+	{{ partial "search.html" }}
 	<nav aria-label="site info">
 		<ul>
 			<li itemprop="license" itemscope itemtype="https://schema.org/CreativeWork">

layouts/partials/search.html

@@ -0,0 +1,7 @@
+<span id="search-label">Search this site:</span>
+<form
+	itemprop="potentialAction" itemscope itemtype="https://schema.org/SearchAction"
+	action="https://searchmysite.net/search/" method="get">
+	<input aria-labelledby="search-label" itemprop="query" type="search" value="domain:seirdy.one " name="q">
+	<div><input type="submit" value="search"></div>
+</form>