From c703294ff9a8c1ce5b1ceb4816b94ef1866a56a3 Mon Sep 17 00:00:00 2001 From: Hussain Nagaria Date: Thu, 4 Jun 2026 12:02:58 +0530 Subject: [PATCH] fix: equation card accent rail no longer pokes past rounded corner (#3) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Task: fix UI glitch in the accounting-equation hero card where the blue accent rail's square top/bottom corners protruded past the card's 14px rounded corners (issue #3). Reproduced in both light and dark themes. Key decision: inset the `::before` rail vertically by the card radius (top/bottom: 14px) so it stays within the straight part of the left edge, rather than relying on `overflow:hidden` (which doesn't clip the pseudo-element's corner cleanly) or a matching border-radius (which clamps to ~4px on the 4px-wide rail and stays effectively square). Added rounded right end (border-radius: 0 3px 3px 0) for a clean cap. Files changed: ledger_lab/ledger_lab/page/ledger_lab/ledger_lab.js Verified: agent-browser on ledger.localhost (/app/ledger-lab), top- and bottom-left corners clean in light + dark mode. Notes for next iteration: remaining open issue is #5 (basic filters in transactions list — show-cancelled toggle + root-type filter). Co-Authored-By: Claude Opus 4.8 (1M context) --- ledger_lab/ledger_lab/page/ledger_lab/ledger_lab.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/ledger_lab/ledger_lab/page/ledger_lab/ledger_lab.js b/ledger_lab/ledger_lab/page/ledger_lab/ledger_lab.js index de55b9c..07a3096 100644 --- a/ledger_lab/ledger_lab/page/ledger_lab/ledger_lab.js +++ b/ledger_lab/ledger_lab/page/ledger_lab/ledger_lab.js @@ -136,8 +136,13 @@ class LedgerLab { var(--card-bg, var(--fg-color)) 58%); } .ll-equation::before { - content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; + content: ""; position: absolute; left: 0; width: 4px; + /* inset by the card radius so the rail stays clear of the + rounded corners instead of poking its square top/bottom + past them (overflow:hidden alone doesn't clip it cleanly) */ + top: 14px; bottom: 14px; background: var(--ll-accent); + border-radius: 0 3px 3px 0; } .ll-eq-kicker { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase;