From b5449eceedbd5d93ea4bd22e604fd972c46eda43 Mon Sep 17 00:00:00 2001
From: Collin Williams <96917990+bluedragon1221@users.noreply.github.com>
Date: Tue, 7 Jul 2026 16:44:48 -0500
Subject: Reversible Programming, html formatting changes, and css tweaks

---
 article.js | 81 +++++++++++++++++++++++++++++++-------------------------------
 1 file changed, 40 insertions(+), 41 deletions(-)

(limited to 'article.js')

diff --git a/article.js b/article.js
index 4818a3d..723d97f 100644
--- a/article.js
+++ b/article.js
@@ -1,53 +1,52 @@
+function addHeader() {
+    const header = document.querySelector("header");
+    
+    const h1 = document.createElement('h1');
+    h1.textContent = document.title;
+    header.appendChild(h1);
+    
+    const time = document.createElement('time');
+    const metaDate = document.querySelector('meta[property="article:published_time"]');
+    const dateString = metaDate.getAttribute('content');
+    const displayDate = (new Date(dateString)).toLocaleDateString('en-US', {
+        month: 'short',
+        day: 'numeric',
+        year: 'numeric',
+        timeZone: 'UTC'
+    });
+    time.setAttribute('datetime', dateString);
+    time.textContent = displayDate;
+    header.appendChild(time);
+
+    const hr = document.createElement('hr');
+    header.appendChild(hr);
+}
+
 function addTOC() {
-    var tocDiv = document.createElement("div");
-    tocDiv.classList += "toc";
-    var toc = document.createElement("ul");
+    const tocDiv = document.getElementById("toc");
+    if (!tocDiv) return;
 
-    document.body.querySelectorAll('h1, h2, h3, h4, h5, h6').forEach(heading => {
-        var link = document.createElement('a');
-        link.setAttribute('href', '#'+heading.id.toLowerCase());
+    const tocHeading = document.createElement("h2");
+    tocHeading.textContent = "Table of Contents";
+    tocDiv.appendChild(tocHeading);
+
+    const toc = document.createElement("ul");
+
+    document.querySelectorAll('article :is(h1, h2, h3, h4, h5, h6):not(header *, #toc *)').forEach(heading => {
+        const link = document.createElement("a");
+        link.href = "#" + heading.id.toLowerCase();
         link.textContent = heading.textContent;
-        
-        var li = document.createElement('li');
+
+        const li = document.createElement("li");
         li.appendChild(link);
-        
+
         toc.appendChild(li);
     });
 
-    tocDiv.append(toc);
-    document.body.prepend(tocDiv);
-
-    var styleBlock = document.createElement("style");
-    styleBlock.textContent = `
-        .toc {
-            position: fixed;
-            width: 17rem;
-            top: 32px;
-            left: calc(50vw - 37.5ch - 20rem);
-            padding-right: 0.75rem;
-            z-index: 1;
-
-            ul {
-                margin: 0;
-                padding-left: 1rem;
-                line-height: 1.4;
-            }
-
-            li {
-                margin-bottom: 0.35rem;
-                font-size: 1.1rem;
-            }
-        }
-
-        @media (max-width: 1000px) {
-            .toc {
-                display: none;
-            }
-        }
-    `;
-    document.head.append(styleBlock);
+    tocDiv.appendChild(toc);
 }
 
 document.addEventListener("DOMContentLoaded", () => {
+    addHeader()
     addTOC()
 })
\ No newline at end of file
-- 
cgit v1.3.1