From 0e07f56df171c1876ba2afd8d76d14784efdfc6c Mon Sep 17 00:00:00 2001
From: Gabriel Arazas <foodogsquared@foodogsquared.one>
Date: Fri, 24 Feb 2023 20:23:27 +0800
Subject: [PATCH] Reposition the main content

---
 CHANGELOG.adoc               |  3 +++
 layouts/_default/single.html | 40 +++++++++++++++++++-----------------
 2 files changed, 24 insertions(+), 19 deletions(-)

diff --git a/CHANGELOG.adoc b/CHANGELOG.adoc
index b022342..7e56b12 100644
--- a/CHANGELOG.adoc
+++ b/CHANGELOG.adoc
@@ -27,6 +27,9 @@ and this project adheres to https://semver.org/spec/v2.0.0.html[Semantic Version
 
 == Updated
 
+- Reposition certain components.
+This is to (hopefully) fix certain layouts when the article is read in reader mode (in major web browsers such as Chrome and Firefox).
+
 - Spacing between basic elements (i.e., `<p>`).
 
 - Responsive font sizing.
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 34ffe33..c52ec00 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -1,24 +1,26 @@
 {{ define "main" }}
 
-<article class="post--single">
-  <header>
-    <h1>{{ .Title }}</h1>
-  </header>
-  {{ partial "partials/components/post-meta.html" . }}
-
-  {{ $is_toc := cond (ne .Params.toc nil) .Params.toc $.Site.Params.toc }}
-  {{ if (and $is_toc (gt (countrunes .TableOfContents) 0)) }}
-  <style>
-#TableOfContents:not(:empty)::before {
-  content: "{{ i18n "table_of_contents" | default "Table of contents" }}";
-  font-weight: bold;
-}
-  </style>
-  {{ .TableOfContents }}
-  {{ end }}
-
+<div class="post--single">
   <main>
-    {{ .Content }}
+    <article>
+      <header>
+        <h1>{{ .Title }}</h1>
+        {{ partial "partials/components/post-meta.html" . }}
+      </header>
+
+      {{ $is_toc := cond (ne .Params.toc nil) .Params.toc $.Site.Params.toc }}
+      {{ if (and $is_toc (gt (countrunes .TableOfContents) 0)) }}
+        <style>
+          #TableOfContents:not(:empty)::before {
+            content: "{{ i18n "table_of_contents" | default "Table of contents" }}";
+            font-weight: bold;
+          }
+        </style>
+        {{ .TableOfContents }}
+      {{ end }}
+
+      {{ .Content }}
+    </article>
   </main>
 
   <hr aria-hidden="true"/>
@@ -53,6 +55,6 @@
       <p data-content-translations="{{ jsonify $langs }}">{{ i18n "available_translations" }}: {{ delimit $lang_links "," (printf " %s " (i18n "and")) }}</p>
     {{- end }}
   </div>
-</article>
+</div>
 
 {{ end }}