made navbar and sidebars dynamic, cba editing all of them each time i do an update

components.js

@@ -0,0 +1,110 @@
+document.addEventListener("DOMContentLoaded", function () {
+	// Create the navbar HTML
+	const navbar = `
+        <nav id="navbar" style="margin-bottom: 10px">
+            <ul>
+                <li><a href="index.html">Home</a></li>
+                <li><a href="reviews.html">Reviews</a></li>
+                <li><a href="https://git.moonsbian.gay/">Git</a></li>
+            </ul>
+        </nav>`;
+
+	// Inject it into the placeholder
+	const navPlaceholder = document.getElementById("navbar-container");
+	if (navPlaceholder) navPlaceholder.innerHTML = navbar;
+
+	const leftSidebar = `
+				<h2>Updates (Content)</h2>
+				<div class="box">
+					<p>
+						This is where things like new things put on the website
+						are shown, if I consider them important enough to
+						remember to add :p
+					</p>
+					<ul style="padding-left: 10px">
+						<li>Placeholder</li>
+						<li>Placeholder</li>
+						<li>Placeholder</li>
+						<li>Placeholder</li>
+					</ul>
+				</div>
+				<!--
+				<h2>Hi there!</h2>
+				<h3>Other Tools</h3>
+				<ul>
+					<li>
+						<a
+							href="https://sadgrlonline.github.io/html-cheatsheet/"
+							target="_blank"
+							>HTML Cheatsheet</a
+						>
+					</li>
+					<li>
+						<a
+							href="webmastery/webmaster-links.html"
+							target="_blank"
+							>Webmaster Links</a
+						>
+					</li>
+					<li>
+						<a
+							href="webmastery/downloads/tiledbgs.html"
+							target="_blank"
+							>Tiled BGs</a
+						>
+					</li>
+					<li>
+						<a
+							href="webmastery/downloads/fonts.html"
+							target="_blank"
+							>Fonts</a
+						>
+					</li>
+					<li>
+						<a href="projects/ideas/" target="_blank">Site Ideas</a>
+					</li>
+				</ul>
+    `;
+
+	const rightSidebar = `
+				<h2>Updates (Website)</h2>
+				<div class="box">
+					<p>
+						Updates regarding the website, style, layout, new
+						features
+					</p>
+					<ul style="padding-left: 10px">
+						<li>
+							No longer just a white blank page with placeholder
+							text on it
+						</li>
+						<li>Reviews page</li>
+					</ul>
+				</div>
+				<h2>:3</h2>
+				<h3>Other Sites/Tools I like</h3>
+				<ul>
+					<li>
+						<a href="https://sadgrl.online/" target="_blank"
+							>Sadgrl.online</a
+						>
+					</li>
+					<li>
+						<a href="https://neocities.org/" target="_blank"
+							>Neocities</a
+						>
+						<p>Go make a personal website, it's fun!</p>
+					</li>
+				</ul>
+    `;
+
+	const leftSidebarPlaceholder = document.getElementById(
+		"leftSidebarPlaceholder",
+	);
+	const rightSidebarPlaceholder = document.getElementById(
+		"rightSidebarPlaceholder",
+	);
+	if (leftSidebarPlaceholder) leftSidebarPlaceholder.innerHTML = leftSidebar;
+	if (rightSidebarPlaceholder)
+		rightSidebarPlaceholder.innerHTML = rightSidebar;
+});