Better styling for footnotes

assets/main.css

@@ -553,7 +553,7 @@ a.anchor:hover {
 
 #content div#main {
     border-bottom: 2px solid var(--border-light);
-    padding-bottom: 1.5rem;
+    padding-bottom: 1rem;
 }
 
 .footnotes {
@@ -561,15 +561,12 @@ a.anchor:hover {
 	font-size: .9rem;
     color: var(--text-light);
 }
-.footnotes hr {
-    display: none;
+.footnotes #footnotes-heading {
+    margin-top: 1.5rem;
 }
 .footnotes ol {
     margin-top: none;
 }
-.footnotes::before {
-    content: "Footnotes"
-}
 
 small {
     font-size: .8rem;

layouts/partials/processed-content.html

@@ -1,10 +1,5 @@
-{{ if .Params.footnote_heading -}}
-{{ $references    := `(<section class="footnotes" role="doc-endnotes">
+{{ $footnotes := `(<div class="footnotes" role="doc-endnotes">
 <hr>)` -}}
-    {{ $heading :=  .Params.footnote_heading -}}
-    {{ $referencesWithHeading := printf `<section class="footnotes" role="doc-endnotes" aria-labelledby="note-hd">
-<h2 id="note-hd">%s</h2>` ($heading) -}}
-    {{ .Content | replaceRE $references $referencesWithHeading | safeHTML -}}
-{{ else -}}
-{{ .Content -}}
-{{ end -}}
+{{ $footnotesWithHeading := printf `<div class="footnotes" role="doc-endnotes">
+<hr><p id="footnotes-heading">%s</p>` "Footnotes" -}}
+{{ .Content | replaceRE $footnotes $footnotesWithHeading | safeHTML -}}