From 6932f9dae4a77c6308d529a868a67c13bb8f2d3f Mon Sep 17 00:00:00 2001
From: MattTheTekie <throwaway.navigate072@silomails.com>
Date: Thu, 23 Apr 2026 17:58:24 -0400
Subject: [PATCH] chore: fixes

---
 legacy.html       | 104 +++++++++++++++++++++++++++++++++++++---------
 legacy_about.html |  60 ++++++++++----------------
 2 files changed, 108 insertions(+), 56 deletions(-)
diff --git a/legacy.html b/legacy.html
index c749326..3061dec 100644
--- a/legacy.html
+++ b/legacy.html
@@ -2,6 +2,7 @@
 <html lang="en">
 <head>
 <meta charset="UTF-8">
+
 <meta property="og:type" content="summary">
 <meta property="og:site_name" content="MattTheTekie presents">
 <meta property="og:title" content="The Veltron Network">
@@ -9,10 +10,12 @@
 <meta property="og:image" content="images/favicon/banner.png">
 <meta property="og:image:alt" content="Veltron Network">
 <meta property="og:url" content="http://www.veltron.net/">
+
 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
 <meta property="author" content="MattTheTekie + Veltron">
 
 <title>Home - Veltron Network</title>
+
 <link rel="stylesheet" href="css/legacy.css">
 
 <link rel="icon" type="image/png" href="images/favicon/banner.png">
@@ -28,7 +31,9 @@
   <!-- TOP SCREEN -->
   <div class="screen top-screen">
     <div id="header">
-      <h1><img src="https://www.veltron.net/images/site-banner.png" width="100%" height="100%"></h1>
+      <h1>
+        <img src="https://www.veltron.net/images/site-banner.png" width="100%" height="100%">
+      </h1>
     </div>
   </div>
 
@@ -43,21 +48,33 @@
       <span>Veltron Portal</span>
 
       <div class="nav-grid">
-        <a href="legacy.html">Home</a>
-        <a href="legacy_members.html" onclick="loadPage(event, 'legacy_members.html')">Members</a>
-        <a href="legacy_about.html" onclick="loadPage(event, 'legacy_about.html')">About</a>
-        <a href="legacy_blog.html" onclick="loadPage(event, 'legacy_blog.html')">Code</a>
+        <a href="#" onclick="showHome(event)">Home</a>
+        <a href="#" onclick="showMembers(event)">Members</a>
+        <a href="#" onclick="showAbout(event)">About</a>
+        <a href="#" onclick="showCode(event)">Code</a>
       </div>
     </div>
 
     <!-- CONTENT -->
     <div id="content" class="text-containers-main-bg content-box">
-            <img
-                src="images/digimon_thkh.1200-2533722281.jpg"
-                alt="Grassy hill from Popstar (Kirby universe)"
-              height="80%" width="100%"/>
-      <center><p>Welcome to the Veltron Network!<br> Our corner of the internet is a unique and inclusive space to explore technology and much more. We are pioneers in the world of FOSS. We are always looking for more members if you want to join the iniative.</p></center>
+
+      <img
+        src="images/digimon_thkh.1200-2533722281.jpg"
+        alt="Welcome image"
+        height="80%"
+        width="100%"
+      />
+
+      <center>
+        <p>
+          Welcome to the Veltron Network!<br>
+          Our corner of the internet is a unique and inclusive space to explore technology and much more.
+          We are pioneers in the world of FOSS.
+        </p>
+      </center>
+
     </div>
+
     <!-- COUNTER -->
     <center>
       <span>You are visitor number:</span>
@@ -67,22 +84,71 @@
   </div>
 
 </div>
+
 <script src="javascript/view-counter.js"></script>
 
-<!-- 🔥 PAGE LOADER SCRIPT -->
+<!-- PAGE SYSTEM -->
 <script>
-function loadPage(event, page) {
-    event.preventDefault(); // stop normal link behavior
+function showHome(event) {
+  if (event) event.preventDefault();
 
-    fetch(page)
-    .then(response => response.text())
-    .then(data => {
-        document.getElementById("content").innerHTML = data;
+  document.getElementById("content").innerHTML = `
+    <img src="images/digimon_thkh.1200-2533722281.jpg" width="100%" height="80%">
+    <center>
+      <p>Welcome to the Veltron Network!</p>
+    </center>
+  `;
+}
+
+function showMembers(event) {
+  if (event) event.preventDefault();
+
+  document.getElementById("content").innerHTML = `
+    <div class="text-containers-main-bg content-box">
+      <center><h2>Members</h2></center>
+      <p>Member list coming soon...</p>
+    </div>
+  `;
+}
+
+function showAbout(event) {
+  if (event) event.preventDefault();
+
+  const target = document.getElementById("content");
+
+  target.innerHTML = `<center><h2>Loading About...</h2></center>`;
+
+  fetch("about.html")
+    .then(res => {
+      if (!res.ok) throw new Error("Failed to load About");
+      return res.text();
     })
-    .catch(() => {
-        document.getElementById("content").innerHTML = "<p>Error loading page.</p>";
+    .then(html => {
+      const temp = document.createElement("div");
+      temp.innerHTML = html;
+
+      const section = temp.querySelector("#aboutSection");
+
+      target.innerHTML = section
+        ? section.innerHTML
+        : "<h2>About</h2><p>Missing #aboutSection in about.html</p>";
+    })
+    .catch(err => {
+      console.error(err);
+      target.innerHTML = "<h2>About</h2><p>Error loading page</p>";
     });
 }
+
+function showCode(event) {
+  if (event) event.preventDefault();
+
+  document.getElementById("content").innerHTML = `
+    <div class="text-containers-main-bg content-box">
+      <center><h2>Code</h2></center>
+      <p>Project repositories and experiments will be listed here.</p>
+    </div>
+  `;
+}
 </script>
 
 </body>
diff --git a/legacy_about.html b/legacy_about.html
index 37dd4db..ec54bdf 100644
--- a/legacy_about.html
+++ b/legacy_about.html
@@ -18,47 +18,33 @@
   </div>
   <!-- JS LOADER -->
 <script>
-function loadPage(event, page) {
-    event.preventDefault();
+window.addEventListener("load", () => {
+  const target = document.getElementById("content");
+  console.log("target:", target);
 
-    fetch(page)
-        .then(response => response.text())
-        .then(html => {
+  if (!target) return;
 
-            // Parse the full HTML document safely
-            const parser = new DOMParser();
-            const doc = parser.parseFromString(html, "text/html");
+  fetch("/about.html")
+    .then(res => {
+      console.log("status:", res.status);
+      return res.text();
+    })
+    .then(html => {
+      const temp = document.createElement("div");
+      temp.innerHTML = html;
 
-            // Extract ONLY body content
-            const newContent = doc.body.innerHTML;
+      const section = temp.querySelector("#aboutSection");
 
-            // Replace your content area
-            const container = document.getElementById("content");
-            container.innerHTML = newContent;
-
-            // OPTIONAL: re-run scripts inside loaded page
-            const scripts = container.querySelectorAll("script");
-
-            scripts.forEach(oldScript => {
-                const newScript = document.createElement("script");
-
-                // copy inline script or src script
-                if (oldScript.src) {
-                    newScript.src = oldScript.src;
-                } else {
-                    newScript.textContent = oldScript.textContent;
-                }
-
-                oldScript.remove();
-                document.body.appendChild(newScript);
-            });
-        })
-        .catch(err => {
-            console.error(err);
-            document.getElementById("content").innerHTML =
-                "<p>Error loading page.</p>";
-        });
-}
+      target.innerHTML = section
+        ? section.innerHTML
+        : "<h2>About</h2><p>Failed to load content</p>";
+    })
+    .catch(err => {
+      console.error(err);
+      target.innerHTML = "<h2>About</h2><p>Error loading page</p>";
+    });
+});
 </script>
+
 </body>
 </html>
