From d2ce7f0fdcac85ec0a77b8d73474802c90bda4a9 Mon Sep 17 00:00:00 2001
From: droideparanoico <david.alvarez.81@gmail.com>
Date: Sun, 14 Jun 2026 13:53:20 +0200
Subject: [PATCH] Only show Upload button on library view

---
 .gitignore                     |  3 +++
 frontend/src/App.svelte        |  2 +-
 frontend/src/app.css           | 21 +++++++++++++--------
 frontend/src/lib/Header.svelte |  6 ++++--
 frontend/src/pages/Play.svelte | 10 +---------
 5 files changed, 22 insertions(+), 20 deletions(-)

diff --git a/.gitignore b/.gitignore
index 22cb277..8102bfb 100644
--- a/.gitignore
+++ b/.gitignore
@@ -40,3 +40,6 @@ data/saves/*
 # OS
 .DS_Store
 Thumbs.db
+
+# Gitea
+.gitea/
\ No newline at end of file
diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index 9cef609..a1f7562 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -43,7 +43,7 @@
   });
 </script>
 
-<Header onUploadClick={() => uploadTriggered++} />
+<Header onUploadClick={() => uploadTriggered++} hideUpload={route !== "/"} />
 
 <main class="container">
   {#if route === "/"}
diff --git a/frontend/src/app.css b/frontend/src/app.css
index 0cf7e73..64bc9d1 100644
--- a/frontend/src/app.css
+++ b/frontend/src/app.css
@@ -98,7 +98,8 @@ h3 { font-size: 1.2rem; }
 /* ═══════════════════════════════════════════════════════════════
    BUTTONS
    ═══════════════════════════════════════════════════════════════ */
-.btn {
+/* Only targets DOStalgia buttons, not js-dos emulator buttons inside .dos-container */
+.btn.btn:not(.dos-container .btn) {
   display: inline-flex;
   align-items: center;
   gap: 8px;
@@ -111,32 +112,36 @@ h3 { font-size: 1.2rem; }
   font-size: 0.9rem;
   font-weight: 600;
   cursor: pointer;
+  text-transform: none;
+  height: auto;
+  min-height: 0;
+  line-height: normal;
   transition: all 0.15s ease;
 }
-.btn:hover {
+.btn.btn:not(.dos-container .btn):hover {
   background: var(--phosphor-burn);
   border-color: var(--phosphor);
   box-shadow: 0 0 12px var(--phosphor-dark);
 }
-.btn:active {
+.btn.btn:not(.dos-container .btn):active {
   transform: scale(0.97);
 }
 
-.btn-primary {
+.btn-primary.btn-primary:not(.dos-container .btn) {
   background: var(--phosphor-dark);
   border-color: var(--phosphor);
   color: var(--phosphor-glow);
 }
-.btn-primary:hover {
+.btn-primary.btn-primary:not(.dos-container .btn):hover {
   background: var(--phosphor-dim);
   color: var(--bg);
 }
 
-.btn-danger {
+.btn-danger.btn-danger:not(.dos-container .btn) {
   border-color: #cc3333;
   color: #cc3333;
 }
-.btn-danger:hover {
+.btn-danger.btn-danger:not(.dos-container .btn):hover {
   background: #331111;
   border-color: #ff4444;
   color: #ff4444;
@@ -187,7 +192,7 @@ input::placeholder {
 @media (max-width: 640px) {
   h1 { font-size: 1.5rem; }
   h2 { font-size: 1.25rem; }
-  .btn { padding: 8px 14px; font-size: 0.85rem; min-height: 40px; }
+  .btn.btn:not(.dos-container .btn) { padding: 8px 14px; font-size: 0.85rem; min-height: 40px; }
   input, textarea, select { font-size: 16px; } /* prevents iOS zoom */
 }
 
diff --git a/frontend/src/lib/Header.svelte b/frontend/src/lib/Header.svelte
index a6840c3..ccc7ced 100644
--- a/frontend/src/lib/Header.svelte
+++ b/frontend/src/lib/Header.svelte
@@ -1,5 +1,5 @@
 <script>
-  let { onUploadClick = () => {} } = $props();
+  let { onUploadClick = () => {}, hideUpload = false } = $props();
 </script>
 
 <header class="header">
@@ -17,7 +17,9 @@
       <span class="logo-text">DOSTALGIA</span>
     </a>
     <nav>
-      <button class="btn" onclick={onUploadClick}>+ Upload</button>
+      {#if !hideUpload}
+        <button class="btn" onclick={onUploadClick}>+ Upload</button>
+      {/if}
     </nav>
   </div>
 </header>
diff --git a/frontend/src/pages/Play.svelte b/frontend/src/pages/Play.svelte
index 5604b66..c3a578a 100644
--- a/frontend/src/pages/Play.svelte
+++ b/frontend/src/pages/Play.svelte
@@ -134,7 +134,7 @@
         ← {isSetup ? "Back" : game.title}
       </button>
       {#if running}
-        <button class="btn stop-btn" onclick={stopEmulator}>⏹ Stop</button>
+        <button class="btn btn-danger" onclick={stopEmulator}>⏹ Stop</button>
       {/if}
     {/if}
   </div>
@@ -211,14 +211,6 @@
     font-family: var(--font-sans);
   }
   .link-button:hover { color: var(--phosphor); }
-  .stop-btn {
-    border-color: #cc3333;
-    color: #ff4444;
-  }
-  .stop-btn:hover {
-    background: #331111;
-    box-shadow: 0 0 12px #331111;
-  }
 
   /* Emulator canvas — always mounted */
   .dos-container {