jozamudi/ani-web
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Episode grid: move names out of the button into the tooltip

Browse Source 
The visible names made the grid uneven (long titles wrapped to 2-3
lines). Buttons now show only the E-number; the full name lives in
the title attribute (hover tooltip: 'E1 — Ryomen Sukuna'). Dropped
the now-unused .ep-name CSS.
This commit is contained in:
jozamudi committed 2026-08-31 01:55:10 +00:00
1 parent 343628a2e3
commit aeab72162e
2 files changed
-3
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

static/app.js
-1
View File
@@ -685,7 +685,6 @@ function renderEps() {
const b = el("button", "ep" + (e.filler ? " filler" : "")); const b = el("button", "ep" + (e.filler ? " filler" : ""));
const done = watchDone.has(String(e.id)); const done = watchDone.has(String(e.id));
b.textContent = done ? "E" + e.number + " \u2713" : "E" + e.number; b.textContent = done ? "E" + e.number + " \u2713" : "E" + e.number;
if (e.name) b.append(el("span", "ep-name", e.name));
b.title = `E${e.number}${e.name ? " — " + e.name : ""}`; b.title = `E${e.number}${e.name ? " — " + e.name : ""}`;
if (done) b.classList.add("done"); if (done) b.classList.add("done");
const pct = epProg.get(String(e.id)); const pct = epProg.get(String(e.id));
static/style.css
-2
View File
@@ -164,8 +164,6 @@ button.tiny.on { border-color: var(--acc); color: var(--acc); }
.eps { display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: 0.4rem; } .eps { display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: 0.4rem; }
.ep { position: relative; font-size: 0.9rem; } .ep { position: relative; font-size: 0.9rem; }
.ep-name { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
overflow: hidden; font-size: .68rem; color: var(--muted); margin-top: .2rem; line-height: 1.2; }
.ep.filler { opacity: 0.55; } .ep.filler { opacity: 0.55; }
.ep.done { opacity: 0.5; } .ep.done { opacity: 0.5; }
.ep.nextup { border-color: #4b5568; background: #1f2130; } .ep.nextup { border-color: #4b5568; background: #1f2130; }