From c7fa2e0f98ae1e077ed26596da497d9551cad0a8 Mon Sep 17 00:00:00 2001 From: Builder Date: Tue, 12 May 2026 16:45:28 -0400 Subject: [PATCH] Fix dangling separator in hero subtitle on narrow Safari viewports MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The " · " before test.describe() was orphaned when .mono became display:block on mobile. Wrap it in .hero__sub-sep and hide it at ≤900px. Also tighten topbar padding at ≤480px for iPhone-mini widths. Add a responsive test asserting the separator is hidden on mobile. Co-authored-by: Cursor --- css/app.css | 12 ++++++++++++ index.html | 6 +++--- tests/portfolio.spec.ts | 9 +++++++++ 3 files changed, 24 insertions(+), 3 deletions(-) diff --git a/css/app.css b/css/app.css index fe256cc..e01d1cf 100644 --- a/css/app.css +++ b/css/app.css @@ -846,6 +846,9 @@ body { .hero__title { font-size: 32px; } .hero__sub { font-size: 12px; word-break: break-word; white-space: normal; } .hero__sub .mono { display: block; margin-top: 4px; } + /* When .mono drops to its own line, the inline " · " in front of it would + dangle as an orphan after "Canadian citizen". Hide it on mobile. */ + .hero__sub .hero__sub-sep { display: none; } .hero__hint { font-size: 12.5px; white-space: normal; word-break: break-word; } .hero--slim { padding: 14px 18px 10px; } .hero--slim .hero__title { font-size: 20px; } @@ -910,6 +913,15 @@ body { .hero__hint { font-size: 11px; } .hero--slim .hero__title { font-size: 18px; } + /* Tighten the topbar so 5 ghost buttons + brand fit on iPhone-mini widths + without horizontal overflow. We keep all controls reachable; just trim + their padding and shrink the brand wordmark. */ + .topbar { gap: 4px; padding: 0 6px; } + .topbar__right { gap: 2px; } + .btn { padding: 0 6px; } + .btn--run { padding: 0 9px; } + .brand__name { font-size: 11.5px; } + .trace-row, .trace-axis { grid-template-columns: 80px 1fr 44px; font-size: 10px; } .trace-head__meta { display: none; } diff --git a/index.html b/index.html index 27cc1d5..ed88f6b 100644 --- a/index.html +++ b/index.html @@ -9,8 +9,8 @@ - - + + @@ -134,7 +134,7 @@
describe

Ilia Dobkin

-

Senior SDET · Remote (ET) · Canadian citizen · test.describe("portfolio")

+

Senior SDET · Remote (ET) · Canadian citizen · test.describe("portfolio")

Click the green ▶ next to any test to run it — or press Run all above.