Toggle page header visibility based on banner

When rendering a game, hide the page H1 text via visibility (keeps layout space) if a banner image is present and initialize the banner display. If no banner is available, hide the entire page header (display: none) to avoid an empty header area. Also remove the global CSS rule that previously hid H1s in browse/games.html so the JS can control header visibility instead.

Author: ReenigneArcher

gh-pages-template/assets/js/game_detail.js

@@ -41,9 +41,20 @@ function renderGame(data) {
                 pageHeader.appendChild(imgDesc);
             }
 
+            // Hide the h1 (but keep space) when there's a banner image
+            if (pageHeaderH1) {
+                pageHeaderH1.style.visibility = "hidden";
+            }
+
             // Initialize the image display
             initGameBanner();
         }
+    } else {
+        // No banner image, hide the entire page header
+        const pageHeader = document.querySelector("header.header-section");
+        if (pageHeader) {
+            pageHeader.style.display = "none";
+        }
     }
 
     // Cover

gh-pages-template/browse/games.html

@@ -9,12 +9,6 @@
   - href: https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200
 ---
 
-<style>
-.page-heading h1 {
-  display: none;
-}
-</style>
-
 <script>
 window.GAMEDB_CONFIG = {
   base_path: "{{ site.baseurl }}"