Only show Upload button on library view
This commit is contained in:
@@ -40,3 +40,6 @@ data/saves/*
|
|||||||
# OS
|
# OS
|
||||||
.DS_Store
|
.DS_Store
|
||||||
Thumbs.db
|
Thumbs.db
|
||||||
|
|
||||||
|
# Gitea
|
||||||
|
.gitea/
|
||||||
@@ -43,7 +43,7 @@
|
|||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Header onUploadClick={() => uploadTriggered++} />
|
<Header onUploadClick={() => uploadTriggered++} hideUpload={route !== "/"} />
|
||||||
|
|
||||||
<main class="container">
|
<main class="container">
|
||||||
{#if route === "/"}
|
{#if route === "/"}
|
||||||
|
|||||||
+13
-8
@@ -98,7 +98,8 @@ h3 { font-size: 1.2rem; }
|
|||||||
/* ═══════════════════════════════════════════════════════════════
|
/* ═══════════════════════════════════════════════════════════════
|
||||||
BUTTONS
|
BUTTONS
|
||||||
═══════════════════════════════════════════════════════════════ */
|
═══════════════════════════════════════════════════════════════ */
|
||||||
.btn {
|
/* Only targets DOStalgia buttons, not js-dos emulator buttons inside .dos-container */
|
||||||
|
.btn.btn:not(.dos-container .btn) {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
@@ -111,32 +112,36 @@ h3 { font-size: 1.2rem; }
|
|||||||
font-size: 0.9rem;
|
font-size: 0.9rem;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
text-transform: none;
|
||||||
|
height: auto;
|
||||||
|
min-height: 0;
|
||||||
|
line-height: normal;
|
||||||
transition: all 0.15s ease;
|
transition: all 0.15s ease;
|
||||||
}
|
}
|
||||||
.btn:hover {
|
.btn.btn:not(.dos-container .btn):hover {
|
||||||
background: var(--phosphor-burn);
|
background: var(--phosphor-burn);
|
||||||
border-color: var(--phosphor);
|
border-color: var(--phosphor);
|
||||||
box-shadow: 0 0 12px var(--phosphor-dark);
|
box-shadow: 0 0 12px var(--phosphor-dark);
|
||||||
}
|
}
|
||||||
.btn:active {
|
.btn.btn:not(.dos-container .btn):active {
|
||||||
transform: scale(0.97);
|
transform: scale(0.97);
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-primary {
|
.btn-primary.btn-primary:not(.dos-container .btn) {
|
||||||
background: var(--phosphor-dark);
|
background: var(--phosphor-dark);
|
||||||
border-color: var(--phosphor);
|
border-color: var(--phosphor);
|
||||||
color: var(--phosphor-glow);
|
color: var(--phosphor-glow);
|
||||||
}
|
}
|
||||||
.btn-primary:hover {
|
.btn-primary.btn-primary:not(.dos-container .btn):hover {
|
||||||
background: var(--phosphor-dim);
|
background: var(--phosphor-dim);
|
||||||
color: var(--bg);
|
color: var(--bg);
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-danger {
|
.btn-danger.btn-danger:not(.dos-container .btn) {
|
||||||
border-color: #cc3333;
|
border-color: #cc3333;
|
||||||
color: #cc3333;
|
color: #cc3333;
|
||||||
}
|
}
|
||||||
.btn-danger:hover {
|
.btn-danger.btn-danger:not(.dos-container .btn):hover {
|
||||||
background: #331111;
|
background: #331111;
|
||||||
border-color: #ff4444;
|
border-color: #ff4444;
|
||||||
color: #ff4444;
|
color: #ff4444;
|
||||||
@@ -187,7 +192,7 @@ input::placeholder {
|
|||||||
@media (max-width: 640px) {
|
@media (max-width: 640px) {
|
||||||
h1 { font-size: 1.5rem; }
|
h1 { font-size: 1.5rem; }
|
||||||
h2 { font-size: 1.25rem; }
|
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 */
|
input, textarea, select { font-size: 16px; } /* prevents iOS zoom */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<script>
|
<script>
|
||||||
let { onUploadClick = () => {} } = $props();
|
let { onUploadClick = () => {}, hideUpload = false } = $props();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<header class="header">
|
<header class="header">
|
||||||
@@ -17,7 +17,9 @@
|
|||||||
<span class="logo-text">DOSTALGIA</span>
|
<span class="logo-text">DOSTALGIA</span>
|
||||||
</a>
|
</a>
|
||||||
<nav>
|
<nav>
|
||||||
<button class="btn" onclick={onUploadClick}>+ Upload</button>
|
{#if !hideUpload}
|
||||||
|
<button class="btn" onclick={onUploadClick}>+ Upload</button>
|
||||||
|
{/if}
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|||||||
@@ -134,7 +134,7 @@
|
|||||||
← {isSetup ? "Back" : game.title}
|
← {isSetup ? "Back" : game.title}
|
||||||
</button>
|
</button>
|
||||||
{#if running}
|
{#if running}
|
||||||
<button class="btn stop-btn" onclick={stopEmulator}>⏹ Stop</button>
|
<button class="btn btn-danger" onclick={stopEmulator}>⏹ Stop</button>
|
||||||
{/if}
|
{/if}
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
@@ -211,14 +211,6 @@
|
|||||||
font-family: var(--font-sans);
|
font-family: var(--font-sans);
|
||||||
}
|
}
|
||||||
.link-button:hover { color: var(--phosphor); }
|
.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 */
|
/* Emulator canvas — always mounted */
|
||||||
.dos-container {
|
.dos-container {
|
||||||
|
|||||||
Reference in New Issue
Block a user