gamezonline/Moku
1
0
Fork 0
mirror of https://github.com/moku-project/Moku.git synced 2026-06-13 01:09:56 -05:00
Code Issues Packages Projects Releases Wiki Activity

[V1] Redid Series Detail Download Layout

Browse Source
This commit is contained in:
Youwes09
2026-02-24 22:02:53 -06:00
parent ac04c39ead
commit 28e9e3bcf8
3 changed files with 45 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/SeriesDetail.module.css
+35 -5
View File
@@ -973,7 +973,7 @@
}
/* ── Download dropdown extended: Next-N quick buttons + range picker ─────── */
.dlSectionLabel {
padding: 6px var(--sp-3) 2px;
padding: 6px var(--sp-3) 4px;
font-family: var(--font-ui);
font-size: var(--text-2xs);
color: var(--text-faint);
@@ -987,13 +987,14 @@
padding: 2px var(--sp-2) var(--sp-2);
}
/* Clean pill-style buttons — label + count inline, no column stacking */
.dlNextBtn {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
gap: 2px;
padding: 6px 4px;
justify-content: center;
gap: 5px;
padding: 5px 6px;
border-radius: var(--radius-md);
border: 1px solid var(--border-dim);
background: var(--bg-overlay);
@@ -1003,17 +1004,25 @@
letter-spacing: var(--tracking-wide);
cursor: pointer;
transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast);
white-space: nowrap;
}
.dlNextBtn:hover:not(:disabled) {
background: var(--accent-muted);
border-color: var(--accent-dim);
color: var(--accent-fg);
}
.dlNextBtn:hover:not(:disabled) .dlNextSub {
color: var(--accent-fg);
opacity: 0.7;
}
.dlNextBtn:disabled { opacity: 0.3; cursor: default; }
/* The "(n new)" count badge — sits inline as a dimmed suffix */
.dlNextSub {
font-size: var(--text-2xs);
color: var(--text-faint);
font-variant-numeric: tabular-nums;
transition: color var(--t-fast), opacity var(--t-fast);
}
.dlDivider {
@@ -1022,13 +1031,34 @@
margin: var(--sp-1) var(--sp-2);
}
/* Range row: swaps in at the same height as dlItem — no layout shift */
.dlRangeRow {
display: flex;
align-items: center;
gap: 4px;
padding: 2px var(--sp-2) var(--sp-2);
padding: 7px var(--sp-2) 7px var(--sp-2);
border-radius: var(--radius-md);
min-height: 0;
}
.dlRangeBack {
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
width: 20px;
height: 20px;
border-radius: var(--radius-sm);
border: 1px solid var(--border-dim);
background: none;
color: var(--text-faint);
font-size: 14px;
line-height: 1;
cursor: pointer;
transition: color var(--t-fast), border-color var(--t-fast), background var(--t-fast);
}
.dlRangeBack:hover { color: var(--text-muted); border-color: var(--border-strong); background: var(--bg-overlay); }
.dlRangeInput {
flex: 1;
min-width: 0;