Fix(Styles): Redesigned Projects section for cleaner UI and removed hover animations for mobile compatibility.

scripts/scripts.js

@@ -4,7 +4,8 @@ function hookupPage() {
     console.log("Hooking up home page...");
     hookupNav();
     hookupScroll();
-    hookupProjectThumbnails();
+    // hookupProjectThumbnails();
+    hookupProjectDetailButtons();
 }
 function hookupNav() {
     console.log("Hooking up nav...");
@@ -42,6 +43,7 @@ function hookupScroll() {
         });
     });
 }
+/*
 function hookupProjectThumbnails() {
     console.log("Hooking up project thumbnails...");
     let demoButtonSelector = '.project-links .button';
@@ -71,6 +73,26 @@ function getProjectThumbnailContainer(projectName) {
     console.log({container});
     return container;
 }
+*/
+function hookupProjectDetailButtons() {
+    console.log("Hooking up project detail buttons...");
+    let detailButtonSelector = '.project-detail-button';
+    document.querySelectorAll(detailButtonSelector).forEach(detailButton => {
+        console.log("Hooking up project detail button...");
+        detailButton.addEventListener('click', function() {
+            let projectDetailContainer = this.parentElement.querySelector('.project-detail-container');
+            let wasActive = projectDetailContainer.classList.contains(activeFlag);
+            if (wasActive) {
+                projectDetailContainer.classList.remove(activeFlag);
+                detailButton.innerText = 'Show Details';
+            }
+            else {
+                projectDetailContainer.classList.add(activeFlag);
+                detailButton.innerText = 'Hide Details';
+            }
+        });
+    });
+}
 
 // Google Translate 
 function initGoogleTranslateElement() {