Add GitHub button to app header in index.html; implement URL opening functionality in main.ts; update styles.css to include new button in layout.

Author: CyberMist2

index.html

@@ -17,6 +17,7 @@ <h1>RealmLister</h1>
         <div class="app-header-right">
           <nav>
             <a href="#/" class="nav-link" data-route="main">Servers</a>
+            <button type="button" id="btn-github" class="nav-link nav-link-btn">Github</button>
             <a href="#/settings" class="nav-link" data-route="settings">Settings</a>
           </nav>
         </div>

src/main.ts

@@ -1,5 +1,6 @@
 import { invoke } from "@tauri-apps/api/core";
 import { open } from "@tauri-apps/plugin-dialog";
+import { openUrl } from "@tauri-apps/plugin-opener";
 
 // Background image: place src/assets/background.jpg for it to show
 import("./assets/background.jpg")
@@ -365,6 +366,10 @@ function bindMainView() {
 
   document.getElementById("btn-add-server")?.addEventListener("click", showAddForm);
 
+  document.getElementById("btn-github")?.addEventListener("click", () => {
+    openUrl("https://github.com/CodebyVision/RealmLister");
+  });
+
   document.getElementById("btn-remove-server")?.addEventListener("click", removeCurrentServer);
 
   document.getElementById("remove-modal-cancel")?.addEventListener("click", hideRemoveModal);

src/styles.css

@@ -104,8 +104,9 @@ body::after {
   gap: 1rem;
 }
 
-/* Servers, Settings, Add server – same size */
+/* Servers, Settings, Github, Add server – same size */
 .app-header .nav-link,
+.app-header .nav-link-btn,
 .app-header .btn {
   padding: 0.5em 1em;
   font-size: 0.95rem;