From 0ed68c5e9a7941b50aaff1f83e04a57da214ad2c Mon Sep 17 00:00:00 2001
From: Rohan Kumar <seirdy@seirdy.one>
Date: Sun, 29 May 2022 22:48:27 -0700
Subject: [PATCH] Add webmention submission forms

A long time coming
---
 assets/css/main.css                   |  6 +++---
 layouts/partials/search.html          |  8 +++++---
 layouts/partials/webmention-form.html | 12 ++++++++++++
 layouts/partials/webmentions.html     |  1 +
 4 files changed, 21 insertions(+), 6 deletions(-)
 create mode 100644 layouts/partials/webmention-form.html

diff --git a/assets/css/main.css b/assets/css/main.css
index f730a8c..77e10c1 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -186,18 +186,18 @@ nav ul li {
  * single-row flexbox that supports more browsers. Kanged this CSS from
  * ww.gov.uk. Give the entire width of the row to the search box, but
  * allow the minimum width for the submit button. */
-form {
+form > div {
 	display: table;
 	width: 100%
 }
 
 /* A text box should not look like a button */
-input[type="search"] {
+input:not([type="submit"]) {
 	display: table-cell;
 	width: 98%;
 }
 
-form > div {
+form > div > div {
 	display: table-cell;
 	vertical-align: top; /* IE and some botique browsers need this */
 	width: 1%;
diff --git a/layouts/partials/search.html b/layouts/partials/search.html
index b290898..9209df7 100644
--- a/layouts/partials/search.html
+++ b/layouts/partials/search.html
@@ -1,7 +1,9 @@
-<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>
+	<label for="search">Search this site:</label>
+	<div><!--We need the extra divs to serve as pseudo-table-cells.-->
+		<input id="search" itemprop="query" type="search" value="domain:seirdy.one " name="q">
+		<div><input type="submit" value="search"></div>
+	</div>
 </form>
diff --git a/layouts/partials/webmention-form.html b/layouts/partials/webmention-form.html
new file mode 100644
index 0000000..4f12258
--- /dev/null
+++ b/layouts/partials/webmention-form.html
@@ -0,0 +1,12 @@
+<form
+	itemprop="potentialAction" itemscope itemtype="https://schema.org/CommentAction"
+	action="https://seirdy.one/webmentions/receive" method="post">
+	<meta itemprop="actionStatus" content="PotentialActionStatus">
+	<label for="menchie">Publish a response on your own website and share the link here to send me a webmention! Include a link to this page's canonical location for it to be accepted.</label>
+	{{ $canonicalRelPermalink := .RelPermalink | replaceRE "^/~seirdy/" "/" -}}
+	<input type="hidden" name="target" value="{{ .Site.Params.canonicalBaseURL }}{{ $canonicalRelPermalink }}">
+	<div><!--We need the extra divs to serve as pseudo-table-cells.-->
+		<input id="menchie" type="url" name="source">
+		<div><input type="submit" value="submit"></div>
+	</div>
+</form>
diff --git a/layouts/partials/webmentions.html b/layouts/partials/webmentions.html
index 13e99b2..82a6e14 100644
--- a/layouts/partials/webmentions.html
+++ b/layouts/partials/webmentions.html
@@ -1,6 +1,7 @@
 <section aria-labelledby="webmentions">
 		<h2 id="webmentions" tabindex="-1">Webmen&shy;tions</h2>
 		<p>This site supports <a href="https://indieweb.org/webmention">Webmentions</a>. Webmentions received for this post will appear in the following list after I approve them. I sometimes send Webmentions to myself on behalf of linking sites that don't support them. Check the <a href="https://web.archive.org/">Wayback Machine</a> if any links are broken.</p>
+		{{ partial "webmention-form.html" }}
 		<dl>
 			{{- $target := .RelPermalink | replaceRE "^/~seirdy/" "/" }}
 			{{- $oldTarget := $target | replaceRE "/posts" "" | replaceRE "/$" ".html" -}}