diff --git a/app.js b/app.js index d91f9a1..d55ec24 100644 --- a/app.js +++ b/app.js @@ -910,7 +910,7 @@ function buildSetRow(a, model, ex, entry, i) { chk.type = "button"; chk.setAttribute("aria-pressed", entry.done ? "true" : "false"); chk.setAttribute("aria-label", t("set_done_aria", { n: i + 1 })); - chk.appendChild(el("span", "set-check-label", "S")); + chk.appendChild(el("span", "set-check-label", "Set")); chk.appendChild(el("span", "set-check-num", String(i + 1))); chk.appendChild(el("span", "set-check-box", entry.done ? "✓" : "")); chk.addEventListener("click", () => toggleSetDone(a, model, ex.key, i, chk)); @@ -932,9 +932,10 @@ function buildSetRow(a, model, ex, entry, i) { entry.wInput = wBox.querySelector("input"); entry.rInput = rBox.querySelector("input"); - const reset = el("button", "icon-btn", resetSvg()); + const reset = el("button", "icon-btn", ""); reset.type = "button"; reset.setAttribute("aria-label", t("reset_set_title")); + reset.appendChild(resetSvg()); reset.addEventListener("click", () => resetSet(a, model, ex.key, i, entry)); row.appendChild(reset); diff --git a/styles.css b/styles.css index 54eb617..f3a7ddb 100644 --- a/styles.css +++ b/styles.css @@ -251,16 +251,15 @@ h3 { font-size: 15px; font-weight: 700; } display: inline-flex; align-items: center; justify-content: center; - width: 28px; - height: 28px; + width: 26px; + height: 26px; border: 2px solid var(--border); background: transparent; color: var(--muted); font: inherit; - font-size: 14px; + font-size: 13px; line-height: 1; cursor: pointer; - flex-shrink: 0; } .icon-btn:hover { border-color: var(--border-hover); color: var(--text); background: var(--bg-hover); } @@ -438,9 +437,8 @@ h3 { font-size: 15px; font-weight: 700; } .set-rows { padding: 0; } .set-row { - display: flex; - flex-wrap: nowrap; - width: 100%; + display: grid; + grid-template-columns: auto 1fr 1fr auto auto; gap: 6px; align-items: center; padding: 6px 8px; diff --git a/tests/test_ui.js b/tests/test_ui.js index 7b185fb..6e6ca60 100644 --- a/tests/test_ui.js +++ b/tests/test_ui.js @@ -122,7 +122,7 @@ async function main() { const firstBlock = () => gymCard().querySelector(".ex-block"); const chk1 = () => firstBlock().querySelectorAll(".set-check")[0]; check("Set-Button mit Label 'Set' + Box", - chk1().querySelector(".set-check-label").textContent === "S" + chk1().querySelector(".set-check-label").textContent === "Set" && !!chk1().querySelector(".set-check-box")); check("Set-Button: Box leer (nicht abgehakt)", chk1().querySelector(".set-check-box").textContent === ""); firstBlock().querySelectorAll(".set-check")[2].click();