@geekity/cms 0.27.0 → 0.29.0

package/themes/default/layouts/base.njk

@@ -28,6 +28,12 @@
     content           the page body
     footer            the site footer
     scripts           scripts at the end of <body>
+
+  Two partials, empty here, are included outside every block so that no layout
+  can drop them: `partials/head-end.njk` last in <head> and
+  `partials/body-end.njk` last in <body>. A site theme fills either one to add
+  analytics or a widget to every page without overriding a layout. The
+  editor's preview in the admin sets `editorPreview` and leaves both out.
 #}{% import "partials/feeds.njk" as feeds %}
 {%- import "partials/menu.njk" as nav %}
 {#- Whether this is the front page, which is the one page the header and the
@@ -53,6 +59,7 @@
 {% set metaUrl = (page.url or "/") | absoluteUrl %}
 {% set metaImage = shareImage.url if shareImage else "" %}
 {% set isEntry = (type == "post" or type == "page") and not pagination %}
+{% set canonicalUrl = original.url if (isEntry and original) else metaUrl %}
 {#- An author archive is the only page that is about a person: a listing whose
     `author` is whose page this is, rather than the posts page's writer. -#}
 {% set isAuthorArchive = pagination and author.url and url and (author.url in url) %}
@@ -102,7 +109,7 @@
     {% endif %}{% if noindex %}
     <meta name="robots" content="noindex">
     {% endif %}
-    <link rel="canonical" href="{{ (page.url or "/") | absoluteUrl }}">
+    <link rel="canonical" href="{{ canonicalUrl }}">
     <link rel="stylesheet" href="{{ "style.css" | asset }}">
     {% block speculationRules %}
     {#
@@ -171,6 +178,14 @@
     {% if llmsTxt and atRoot %}
     <link rel="describedby" type="text/markdown" href="{{ llmsTxt | url }}">
     {% endif %}
+    {% if atRoot and soloAuthor %}
+    {% if soloAuthor.url %}
+    <link rel="me" href="{{ soloAuthor.url | url }}">
+    {% endif %}
+    {% for link in soloAuthor.links %}
+    <link rel="me" href="{{ link.href }}">
+    {% endfor %}
+    {% endif %}
     {% block head %}
     {#
       What a link to this page looks like when somebody posts it: the same
@@ -188,7 +203,7 @@
     {% if metaDescription %}
     <meta property="og:description" content="{{ metaDescription }}">
     {% endif %}
-    <meta property="og:url" content="{{ metaUrl }}">
+    <meta property="og:url" content="{{ canonicalUrl }}">
     <meta property="og:type" content="{% if isEntry %}article{% else %}website{% endif %}">
     <meta property="og:site_name" content="{{ site.title }}">
     {% if shareImage %}
@@ -246,6 +261,7 @@
     <link rel="manifest" href="{{ "/manifest.webmanifest" | url }}">
     {% include "partials/jsonld.njk" %}
     {% endblock %}
+    {% if not editorPreview %}{% include "partials/head-end.njk" %}{% endif %}
   </head>
   <body>
     <a class="screen-reader-text" href="#main">Skip to content</a>
@@ -331,5 +347,6 @@
     <script src="{{ "highlight.js" | asset }}" defer></script>
     {% endif %}
     {% endblock %}
+    {% if not editorPreview %}{% include "partials/body-end.njk" %}{% endif %}
   </body>
 </html>

package/themes/default/layouts/comment.njk

@@ -0,0 +1,90 @@
+{#
+  A native comment on a page of its own (TASK-318), at `/comment/{id}/`: what
+  another site fetches when it replies to the comment, so the comment is the
+  page's one `h-entry`.
+
+  Above it is the thread it belongs to, from the post down, as nested
+  `u-in-reply-to h-cite`s: the comment cites its parent, which cites its own,
+  down to the post. A parser reads the chain a person reads, and the deepest
+  cite, printed first, is the post. An ancestor a reader may not see is in
+  `ancestors` as nothing, and stands in the chain with no author or words.
+  Below are its replies, cited in it with `p-comment`, then a link to the
+  whole thread on the post.
+
+  The context: `comment` is one entry of the thread as `partials/comment.njk`
+  prints it; `ancestors` is the chain from the top-level comment down to the
+  parent; `post` is the post as a listing entry is; `threadUrl` is the
+  comment's anchor on the post. The page is noindex and on no list.
+#}
+{% extends "layouts/base.njk" %}
+{% import "partials/comment.njk" as thread with context %}
+
+{% macro cited(index) %}
+{% if index < 0 %}
+{% set by = post.author or siteAuthor %}
+<div class="comment-step u-in-reply-to h-cite">
+  <p class="cite-line">
+    <a class="u-url p-name" href="{{ post.url | url }}">{{ post.label }}</a>
+    {%- if by %} by <span class="p-author h-card">{% if by.url %}<a class="u-url p-name" href="{{ by.url }}">{{ by.name }}</a>{% else %}<span class="p-name">{{ by.name }}</span>{% endif %}</span>{% endif %}
+    {%- if post.date %}, <time class="dt-published" datetime="{{ post.date | date("iso") }}">{{ post.date | date }}</time>{% endif %}
+  </p>
+  {% if post.summary %}
+  <blockquote class="cite-quote p-summary">{{ post.summary }}</blockquote>
+  {% endif %}
+</div>
+{% else %}
+{% set step = ancestors[index] %}
+<div class="comment-step u-in-reply-to h-cite">
+  {{ cited(index - 1) }}
+  {% if step %}
+  <p class="cite-line">
+    <span class="p-author h-card">{% if step.author.url %}<a class="u-url p-name" href="{{ step.author.url }}"{% if step.source != "post" %} rel="nofollow ugc noopener noreferrer"{% endif %}>{{ step.author.name }}</a>{% else %}<span class="p-name">{{ step.author.name }}</span>{% endif %}</span>,
+    {%- if step.url %}
+    <a class="u-url" href="{{ step.url }}"{% if step.source != "comment" %} rel="nofollow noopener noreferrer"{% endif %}><time class="dt-published" datetime="{{ step.published | date("iso") }}">{{ step.published | date }}</time></a>
+    {%- else %}
+    <time class="dt-published" datetime="{{ step.published | date("iso") }}">{{ step.published | date }}</time>
+    {%- endif %}
+  </p>
+  <div class="cite-quote e-content">{{ step.content | safe }}</div>
+  {% else %}
+  <p class="cite-line comment-withheld">{{ thread.withheld() }}</p>
+  {% endif %}
+</div>
+{% endif %}
+{% endmacro %}
+
+{% block content %}
+<article class="comment-page h-entry comment-{{ comment.source }}">
+  <h1 class="screen-reader-text">Comment by {{ comment.author.name }} on {{ post.label }}</h1>
+  <div class="cite comment-thread">
+    {{ cited(ancestors.length - 1) }}
+  </div>
+  <div class="comment-body">
+    <header class="comment-meta">
+      <div class="comment-author p-author h-card">
+        {%- if comment.author.avatar %}
+        <img class="avatar u-photo" src="{{ comment.author.avatar }}" alt="" width="40" height="40">
+        {%- else %}
+        <span class="comment-avatar-empty" aria-hidden="true">{{ comment.author.name | first | upper }}</span>
+        {%- endif %}
+        <b class="p-name">{% if comment.author.url %}<a class="u-url" href="{{ comment.author.url }}" rel="nofollow ugc noopener noreferrer">{{ comment.author.name }}</a>{% else %}{{ comment.author.name }}{% endif %}</b>
+      </div>
+      <div class="comment-metadata">
+        <a class="u-url" href="{{ comment.url }}"><time class="dt-published" datetime="{{ comment.published | date("iso") }}">{{ comment.published | date }}</time></a>
+      </div>
+    </header>
+    <div class="comment-content e-content">{{ comment.content | safe }}</div>
+  </div>
+  {% if comment.replies.length %}
+  <section class="comments-area">
+    <h2 class="comments-title">Replies</h2>
+    <ol class="comment-list">
+      {% for reply in comment.replies %}
+      {{ thread.comment(reply, "p-comment h-cite") }}
+      {% endfor %}
+    </ol>
+  </section>
+  {% endif %}
+</article>
+<p class="comment-back"><a href="{{ threadUrl | url }}">The whole conversation on {{ post.label }}</a></p>
+{% endblock %}

package/themes/default/layouts/front-page.njk

@@ -1,60 +1,22 @@
 {#
-  The front page: the page the Reading setting names, read at `/`, as the
-  source design's `front-page.php` draws it (decision-16, TASK-85).
+  The front page: the page the Reading setting names, read at `/`.
 
-  A site's own words, then what it has been writing. The words are the page's
-  rendered body and nothing else — no title, because `layouts/base.njk` heads
-  the root path with the site title and a second `h1` under it would be one
-  heading too many, and no Published line, because a front page is read as the
-  site rather than as a page somebody wrote on a Tuesday. Then `Recent Posts`
-  over the same feed a listing is made of, headed at 3 so the outline never
-  skips a level, then the line of links, then the bio.
-
-  The bio is the site's author's on a solo author blog, with the `rel="me"`
-  claims that make this page their identity (TASK-180). On any other site it is
-  whoever the page is by, and it claims nothing: the homepage speaks for nobody.
-
-  A theme that wants a different front page replaces this file; a site that
-  wants no front page of its own sets no homepage, and `/` is the listing.
+  A site that wants more on its front page overrides this file in its own
+  theme. `newestPosts(count)` lists the newest published posts as listing
+  entries and `postsPage` names the page carrying the listing; the theme README
+  has an example. On a solo author site the base layout keeps the homepage's
+  `rel="me"` claims in the head whatever this file prints (decision-45).
 #}
 {% extends "layouts/base.njk" %}
 
-{#- Who the bio credits: the person the site's author setting names. -#}
-{% set bioAuthor = soloAuthor or siteAuthor %}
-{% set bioRelMe = true if soloAuthor else false %}
-{% set bioHome = "/" | absoluteUrl if soloAuthor else "" %}
-
 {% block content %}
+{% if title %}
+<h2 class="section-title">{{ title }}</h2>
+{% endif %}
 <div class="page-body e-content">
   {{ content | safe }}
 </div>
 
-<h2 class="section-title">Recent Posts</h2>
-{#- The feed a listing prints, over the posts the CMS decided were recent:
-    this month's writing when there is enough of it and the five newest
-    otherwise. `feedHeading` is 3 because the `h2` above is what they sit
-    under. -#}
-{% set posts = recentPosts %}
-{% set feedHeading = 3 %}
-{% include "partials/post-list.njk" %}
-
-{#- Where to go next. The posts page is here only when the site has one — on a
-    site without one there is no second URL for the archive, and a link to one
-    would be a link to nothing. Search is always here (TASK-22). -#}
-<p class="front-links">
-  {% if postsPage %}
-  <a href="{{ postsPage.url | url }}">{{ postsPage.title }}<span aria-hidden="true"> &rarr;</span></a>
-  {% endif %}
-  <a href="{{ "/search/" | url }}">Search<span aria-hidden="true"> &rarr;</span></a>
-</p>
-
-{% if bioAuthor %}
-<hr>
-<footer>
-  {% include "partials/bio.njk" %}
-</footer>
-{% endif %}
-
 {# A homepage may ask for a contact form like any other page (TASK-56). #}
 {% if contactForm %}
 {% include "partials/contact-form.njk" %}

package/themes/default/layouts/page.njk

@@ -61,6 +61,8 @@
   {% endif %}
 </article>
 
+{% include "partials/backlinks.njk" %}
+
 {% if conversation %}
 {% include "partials/conversation.njk" %}
 {% endif %}

package/themes/default/layouts/post.njk

@@ -9,8 +9,9 @@
   `p-summary`. A post with no title opens on its words, set larger. What a
   reply answers, and what a like, repost or bookmark cites, opens a post with
   no title and follows the header of one with a title, before its words.
-  Then the Published line, the tags, a rule and the bio. The neighbouring posts,
-  the conversation and the comment form follow the entry.
+  Then the Published line, the tags, a rule and the bio. The site's own posts
+  that link to it, the neighbouring posts, the conversation and the comment
+  form follow the entry.
 
   The Published line is inside the `e-content` on purpose. It is what the
   source design does, and it is what makes a reader who copies the words out
@@ -90,13 +91,19 @@
       {%- if updated and (not date or (updated | date("html")) != (date | date("html"))) %}
       {% if date %}<span aria-hidden="true">·</span> {% endif %}<time class="small dt-updated" datetime="{{ updated | date("iso") }}">Updated {{ updated | date("readable", none, lang) }}</time>
       {%- endif %}
+      {#- A second `u-url` rather than a `u-syndication`: the original is not
+          a copy of this post, and original-post-discovery reads a copy's
+          off-site `u-url` as the original. -#}
+      {%- if original %}
+      {% if date or updated %} <span aria-hidden="true">·</span> {% endif %}<span class="small">Originally published at <a class="u-url" href="{{ original.url }}">{{ original.label }}</a></span>
+      {%- endif %}
       {#- The post's copies elsewhere: those its targets answered with and
           those its front matter lists by hand. -#}
       {%- if syndication.length %}
-      {% if date or updated %} <span aria-hidden="true">·</span> {% endif %}<span class="small">Also on {% for copy in syndication %}<a class="u-syndication" href="{{ copy.url }}">{{ copy.label }}</a>{% if not loop.last %}, {% endif %}{% endfor %}</span>
+      {% if date or updated or original %} <span aria-hidden="true">·</span> {% endif %}<span class="small">Also on {% for copy in syndication %}<a class="u-syndication" href="{{ copy.url }}">{{ copy.label }}</a>{% if not loop.last %}, {% endif %}{% endfor %}</span>
       {%- endif -%}
       {%- if location %}
-      {% if date or updated or syndication.length %} <span aria-hidden="true">·</span> {% endif %}<span class="small">{% include "partials/location.njk" %}</span>
+      {% if date or updated or original or syndication.length %} <span aria-hidden="true">·</span> {% endif %}<span class="small">{% include "partials/location.njk" %}</span>
       {%- endif -%}
     </p>
   </section>
@@ -112,8 +119,18 @@
     {% include "partials/bio.njk" %}
   </footer>
   {% endif %}
+  {#- A reply post's replies are inside its entry as `p-comment h-cite`s, so
+      the page it answers reads them there when it is sent a salmention
+      (TASK-320). The likes and boosts stay below: their links are not the
+      entry's. -#}
+  {% if conversation and postType == "reply" %}
+  {% set conversationPart = "replies" %}
+  {% include "partials/conversation.njk" %}
+  {% endif %}
 </article>
 
+{% include "partials/backlinks.njk" %}
+
 {# The post either side of this one, as two cards. Each is on the context only
    when there is one, so the ends of the archive draw one card and a site of a
    single post draws none. #}
@@ -132,6 +149,7 @@
 
 {# Only a post that has been replied to, liked or boosted has one of these. #}
 {% if conversation %}
+{% set conversationPart = "reactions" if postType == "reply" else "all" %}
 {% include "partials/conversation.njk" %}
 {% endif %}
 

package/themes/default/partials/backlinks.njk

@@ -0,0 +1,19 @@
+{#
+  The site's own posts and pages that link to this one (TASK-322), newest
+  first: what a link between two of its posts is instead of a webmention, so
+  it is listed apart from the conversation rather than counted in it.
+
+  `backlinks` is always a list, each entry `{ title, url, date }`, with no
+  `date` for a page that has none. An empty list prints nothing, so a layout
+  includes this unconditionally.
+#}
+{% if backlinks.length %}
+<section class="backlinks" aria-labelledby="backlinks-title">
+  <h2 id="backlinks-title" class="backlinks-title">Linked from</h2>
+  <ol>
+    {% for link in backlinks %}
+    <li><a href="{{ link.url | url }}">{{ link.title }}</a>{% if link.date %} <time datetime="{{ link.date | date("iso") }}">{{ link.date | date("readable") }}</time>{% endif %}</li>
+    {% endfor %}
+  </ol>
+</section>
+{% endif %}

package/themes/default/partials/body-end.njk

@@ -0,0 +1 @@
+{#- Printed last in <body> by layouts/base.njk. Empty here; a site theme fills it. -#}

package/themes/default/partials/cited-page.njk

@@ -8,7 +8,8 @@
 
   `url` is the cited page, always its `u-url`. `context` is what the page said
   about itself, from the reply contexts file. With a name, the name is the
-  link; with only an author, "a post" is; a URL that is itself an image
+  link; a comment on this site (`context.comment`, TASK-326) is "a comment";
+  with only an author, "a post" is; a URL that is itself an image
   (`context.image`, TASK-255) is "an image from" its host; anything else is "a
   page on" its host, never the bare URL, which can run to hundreds of
   characters. The author follows as an `h-card`.
@@ -42,6 +43,7 @@
 {%- if named %} <span class="p-name"><a class="u-url" href="{{ url }}">{{ title.slice(0, cut) }}</a>{{ byline.slice(0, 4) }}{{ card(context.author, byline.slice(4)) }}</span>
 {%- else %}
   {%- if context.name %} <a class="u-url p-name" href="{{ url }}">{{ context.name }}</a>
+  {%- elif context.comment %} <a class="u-url" href="{{ url }}">a comment</a>
   {%- elif context.author %} <a class="u-url" href="{{ url }}">a post</a>
   {%- elif context.image %} <a class="u-url" href="{{ url }}">an image from {{ url | host }}</a>
   {%- else %} <a class="u-url" href="{{ url }}">a page on {{ url | host }}</a>

package/themes/default/partials/comment-form.njk

@@ -87,6 +87,16 @@
     <p class="comment-signed-in">
       Commenting as <a href="{{ commentForm.signedInAs.url }}">{{ commentForm.signedInAs.name }}</a>.
     </p>
+
+    {#
+      What is posted here is a reply post (TASK-300). Unticked it is Unlisted:
+      its own page and the thread, and no listing or feed. Ticked it is Public.
+      It reaches whoever it answers either way.
+    #}
+    <p class="comment-check">
+      <input id="comment-listed" name="{{ commentForm.fields.listed }}" type="checkbox" value="1"{% if commentForm.values.listed %} checked{% endif %} />
+      <label for="comment-listed">Include in posts and feeds</label>
+    </p>
     {% else %}
     {#
       When this form was drawn, which is what the minimum submit time is

package/themes/default/partials/comment.njk

@@ -0,0 +1,79 @@
+{#
+  One reply and everything under it. A macro rather than an include so it can
+  call itself: a reply that answers a reply is the same thing one level in.
+
+  `classes` is the reply's microformat. Under a post each reply is an
+  `h-entry` of its own. On a comment's own page (TASK-318) the comment is the
+  page's one entry, so its replies are `p-comment h-cite` inside it.
+
+  A `withheld` entry (TASK-325) is a comment a reader may not see that has
+  visible replies under it. It keeps its anchor and prints `withheld()` in
+  place of an author and words, as a comment's own page does for an ancestor,
+  and is no microformat of its own.
+#}
+{% macro withheld() %}This comment is no longer shown.{% endmacro %}
+
+{% macro comment(reply, classes="h-entry") %}
+{% if reply.withheld %}
+<li id="comment-{{ reply.id }}" class="comment comment-placeholder">
+  <p class="comment-withheld">{{ withheld() }}</p>
+  <ol class="children">
+    {% for child in reply.replies %}
+    {{ comment(child, classes) }}
+    {% endfor %}
+  </ol>
+</li>
+{% else %}
+<li id="comment-{{ reply.id }}" class="comment {{ classes }} comment-{{ reply.source }}">
+  <article class="comment-body">
+    <footer class="comment-meta">
+      <div class="comment-author vcard p-author h-card">
+        {%- if reply.author.avatar %}
+        <img class="avatar u-photo" src="{{ reply.author.avatar }}" alt="" width="40" height="40" loading="lazy">
+        {%- else %}
+        <span class="comment-avatar-empty" aria-hidden="true">{{ reply.author.name | first | upper }}</span>
+        {%- endif %}
+        <b class="fn p-name">{% if reply.author.url %}<a class="url u-url" href="{{ reply.author.url }}"{% if reply.source != "post" %} rel="nofollow ugc noopener noreferrer"{% endif %}>{{ reply.author.name }}</a>{% else %}{{ reply.author.name }}{% endif %}</b>
+      </div>
+      <div class="comment-metadata">
+        {%- if reply.url %}
+        <a class="u-url" href="{{ reply.url }}"{% if reply.source != "comment" and reply.source != "post" %} rel="nofollow noopener noreferrer"{% endif %}><time class="dt-published" datetime="{{ reply.published | date("iso") }}">{{ reply.published | date }}</time></a>
+        {%- else %}
+        <time class="dt-published" datetime="{{ reply.published | date("iso") }}">{{ reply.published | date }}</time>
+        {%- endif %}
+        {%- if reply.source == "webmention" %}
+        <span class="comment-source">via webmention</span>
+        {%- elif reply.source == "activitypub" %}
+        <span class="comment-source">via the fediverse</span>
+        {%- endif %}
+      </div>
+    </footer>
+    <div class="comment-content e-content">
+      {%- if reply.rsvp %}
+      <p class="comment-rsvp"><data class="p-rsvp" value="{{ reply.rsvp.value }}">{{ reply.rsvp.label }}</data></p>
+      {%- endif %}
+      {{ reply.content | safe }}
+    </div>
+    {#
+      Answering a comment on this site needs no JavaScript: the link carries
+      the comment's id to the form, which puts it in a hidden field. Somebody
+      signed in can answer anything in the thread, and their answer is a reply
+      post that reaches a webmention's page or a fediverse reply's author
+      (TASK-300). A visitor answers comments written here only: a fediverse
+      reply is answered on the server that holds it, and a webmention on the
+      page that sent it.
+    #}
+    {% if commentForm and (reply.source == "comment" or commentForm.signedInAs) %}
+    <div class="reply"><a class="comment-reply-link" href="{{ page.url }}?reply_to={{ reply.id | urlencode }}#respond">Reply</a></div>
+    {% endif %}
+  </article>
+  {% if reply.replies.length %}
+  <ol class="children">
+    {% for child in reply.replies %}
+    {{ comment(child, classes) }}
+    {% endfor %}
+  </ol>
+  {% endif %}
+</li>
+{% endif %}
+{% endmacro %}

package/themes/default/partials/conversation.njk

@@ -11,9 +11,16 @@
   the shape it is handed is documented in the theme README under "The
   conversation".
 
+  `conversationPart` is `reactions` or `replies` for one half of it, which is
+  how a reply post prints its replies inside its entry (TASK-320), and the
+  whole of it otherwise.
+
   The macros come first because Nunjucks defines one where it stands rather
-  than hoisting it, and the two sections below call them.
+  than hoisting it, and the two sections below call them. One reply and
+  everything under it is `partials/comment.njk`, which a comment's own page
+  prints its replies with too.
 #}
+{% import "partials/comment.njk" as thread with context %}
 {#
   One face in a facepile: somebody's avatar, linked to wherever they are.
 
@@ -52,60 +59,6 @@
 {% endif %}
 {% endmacro %}
 
-{#
-  One reply and everything under it. A macro rather than an include so it can
-  call itself: a reply that answers a reply is the same thing one level in.
-#}
-{% macro comment(reply) %}
-<li id="comment-{{ reply.id }}" class="comment h-entry comment-{{ reply.source }}">
-  <article class="comment-body">
-    <footer class="comment-meta">
-      <div class="comment-author vcard p-author h-card">
-        {%- if reply.author.avatar %}
-        <img class="avatar u-photo" src="{{ reply.author.avatar }}" alt="" width="40" height="40" loading="lazy">
-        {%- else %}
-        <span class="comment-avatar-empty" aria-hidden="true">{{ reply.author.name | first | upper }}</span>
-        {%- endif %}
-        <b class="fn p-name">{% if reply.author.url %}<a class="url u-url" href="{{ reply.author.url }}" rel="nofollow ugc noopener noreferrer">{{ reply.author.name }}</a>{% else %}{{ reply.author.name }}{% endif %}</b>
-      </div>
-      <div class="comment-metadata">
-        {%- if reply.url %}
-        <a class="u-url" href="{{ reply.url }}"{% if reply.source != "comment" %} rel="nofollow noopener noreferrer"{% endif %}><time class="dt-published" datetime="{{ reply.published | date("iso") }}">{{ reply.published | date }}</time></a>
-        {%- else %}
-        <time class="dt-published" datetime="{{ reply.published | date("iso") }}">{{ reply.published | date }}</time>
-        {%- endif %}
-        {%- if reply.source == "webmention" %}
-        <span class="comment-source">via webmention</span>
-        {%- elif reply.source == "activitypub" %}
-        <span class="comment-source">via the fediverse</span>
-        {%- endif %}
-      </div>
-    </footer>
-    <div class="comment-content e-content">
-      {%- if reply.rsvp %}
-      <p class="comment-rsvp"><data class="p-rsvp" value="{{ reply.rsvp.value }}">{{ reply.rsvp.label }}</data></p>
-      {%- endif %}
-      {{ reply.content | safe }}
-    </div>
-    {#
-      Answering a comment on this site needs no JavaScript: the link carries
-      the comment's id to the form, which puts it in a hidden field. A
-      fediverse reply is answered on the server that holds it, and a webmention
-      is answered on the page that sent it, so neither gets such a link.
-    #}
-    {% if commentForm and reply.source == "comment" %}
-    <div class="reply"><a class="comment-reply-link" href="{{ page.url }}?reply_to={{ reply.id }}#respond">Reply</a></div>
-    {% endif %}
-  </article>
-  {% if reply.replies.length %}
-  <ol class="children">
-    {% for child in reply.replies %}
-    {{ comment(child) }}
-    {% endfor %}
-  </ol>
-  {% endif %}
-</li>
-{% endmacro %}
 
 {#
   Who is coming to an event (TASK-200): each answer it was given, by a
@@ -114,7 +67,9 @@
   first. A post that is no event has no groups.
 #}
 {% set rsvpIcons = { yes: "✅", maybe: "🤔", interested: "⭐", no: "❌" } %}
-{% if conversation.rsvps.length %}
+{% set showReactions = conversationPart != "replies" %}
+{% set showReplies = conversationPart != "reactions" %}
+{% if showReactions and conversation.rsvps.length %}
 <div class="reactions-section rsvps-section">
   {%- for answer in conversation.rsvps %}
   {{- group(answer.people, answer.label, "rsvp-" + answer.value, rsvpIcons[answer.value]) }}
@@ -128,7 +83,7 @@
   boosts, which is why there are three groups and not four. `p-like`,
   `p-repost` and `p-mention` are the source theme's classes for them.
 #}
-{% if conversation.likes.length or conversation.boosts.length or conversation.mentions.length %}
+{% if showReactions and (conversation.likes.length or conversation.boosts.length or conversation.mentions.length) %}
 <div class="reactions-section">
   {{- group(conversation.likes, "Likes", "p-like", "❤️") }}
   {{- group(conversation.boosts, "Boosts", "p-repost", "🔁") }}
@@ -150,7 +105,7 @@
   switch, the closing window and the post's own front matter all agree it is
   open, so there is nothing else for a theme to work out.
 #}
-{% if conversation.replies.length %}
+{% if showReplies and conversation.replies.length %}
 <div id="comments" class="comments-area">
   <h2 class="comments-title">
     {{- conversation.counts.replies | plural({ one: "One reply", other: "# replies" }, "en") -}}
@@ -158,7 +113,7 @@
 
   <ol class="comment-list">
     {% for reply in conversation.replies %}
-    {{ comment(reply) }}
+    {{ thread.comment(reply, "p-comment h-cite" if conversationPart == "replies" else "h-entry") }}
     {% endfor %}
   </ol>
 

package/themes/default/partials/head-end.njk

@@ -0,0 +1 @@
+{#- Printed last in <head> by layouts/base.njk. Empty here; a site theme fills it. -#}

package/themes/default/src/style.css

@@ -404,6 +404,10 @@
     @apply h-auto max-w-full rounded-md;
   }
 
+  :is(.e-content, .page-body) .video-embed iframe {
+    @apply aspect-video h-auto w-full rounded-md;
+  }
+
   :is(.e-content, .page-body) figcaption {
     @apply mt-2 font-sans text-sm text-muted;
   }
@@ -869,6 +873,26 @@
     @apply target;
   }
 
+  .backlinks {
+    @apply mt-12 font-sans text-sm;
+  }
+
+  .backlinks-title {
+    @apply mb-2 text-[0.72rem] font-normal tracking-[0.14em] text-muted uppercase;
+  }
+
+  .backlinks ol {
+    @apply list-none space-y-1 p-0;
+  }
+
+  .backlinks a {
+    @apply target;
+  }
+
+  .backlinks time {
+    @apply ms-1 text-muted;
+  }
+
   /* Pagination: two words, the newer at the start and the older at the end. */
   .pagination {
     @apply mt-12 flex flex-wrap gap-4 font-sans text-sm;
@@ -1023,6 +1047,28 @@
     @apply mt-8 font-sans text-sm text-muted italic;
   }
 
+  /* A comment's own page (TASK-318): the thread above it as one citation,
+     each step drawn flat although each is nested in the next. */
+  .comment-thread {
+    @apply mb-8;
+  }
+
+  .comment-step > .comment-step {
+    @apply mb-4;
+  }
+
+  .comment-withheld {
+    @apply italic;
+  }
+
+  .comment-page .comments-area {
+    @apply mt-10;
+  }
+
+  .comment-back {
+    @apply mt-10 font-sans text-sm;
+  }
+
   /* The comment form under an open post and the contact form on a page that
      asked for one, which wears the same class. */
   .comment-respond {