style overhaul

1 files changed, 26 insertions, 28 deletions

diff --git a/public/script.js b/public/script.js
index 008cc05..a82229c 100644
--- a/public/script.js
+++ b/public/script.js
@@ -1,29 +1,27 @@
-// Wait for the document to load before running the script 
-(function ($) {
-  
-  // We use some Javascript and the URL #fragment to hide/show different parts of the page
-  // https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#Linking_to_an_element_on_the_same_page
-  $(window).on('load hashchange', function(){
-    
-    // First hide all content regions, then show the content-region specified in the URL hash 
-    // (or if no hash URL is found, default to first menu item)
-    $('.content-region').hide();
-    
-    // Remove any active classes on the main-menu
-    $('.main-menu a').removeClass('active');
-    var region = location.hash.toString() || $('.main-menu a:first').attr('href');
-    
-    // Now show the region specified in the URL hash
-    $(region).show();
-    
-    // Highlight the menu link associated with this region by adding the .active CSS class
-    $('.main-menu a[href="'+ region +'"]').addClass('active'); 
+document.addEventListener("DOMContentLoaded", function() {
+    function loadSection() {
+        // Hide all sections
+        document.querySelectorAll('main > section').forEach(section => {
+            section.style.display = 'none';
+        });
+
+        // Show the section based on the hash
+        const hash = window.location.hash.substring(1);
+        if (hash) {
+            const section = document.getElementById(hash);
+            if (section) {
+                section.style.display = 'block';
+            }
+        } else {
+            // Default to showing the welcome section if no hash is present
+            document.getElementById('welcome').style.display = 'block';
+        }
+    }
+
+    // Load the correct section on initial page load
+    loadSection();
+
+    // Load the correct section when the hash changes
+    window.addEventListener('hashchange', loadSection);
+});
 
-    // Alternate method: Use AJAX to load the contents of an external file into a div based on URL fragment
-    // This will extract the region name from URL hash, and then load [region].html into the main #content div
-    // var region = location.hash.toString() || '#first';
-    // $('#content').load(region.slice(1) + '.html')
-    
-  });
-  
-})(jQuery);