From 9f75cdb0dc29289ea9710eccc06063d6816589b1 Mon Sep 17 00:00:00 2001 From: adlee-was-taken Date: Sun, 22 Feb 2026 20:34:27 -0500 Subject: [PATCH] Pin Hole and End Game flush to screen edges with half-pill shape Zero horizontal padding on bottom bar, remove border on flush side, use half-rounded pill shape so they sit against the screen edges. Co-Authored-By: Claude Opus 4.6 --- client/style.css | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/client/style.css b/client/style.css index d3410a6..903319e 100644 --- a/client/style.css +++ b/client/style.css @@ -5406,12 +5406,12 @@ body.mobile-portrait #mobile-bottom-bar { gap: 8px; background: none; flex-shrink: 0; - padding: 6px 8px; + padding: 6px 0; padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px)); z-index: 900; } -/* Hole indicator — pinned left */ +/* Hole indicator — flush left edge */ body.mobile-portrait #mobile-bottom-bar .mobile-round-info { margin-right: auto; color: rgba(255, 255, 255, 0.9); @@ -5421,15 +5421,19 @@ body.mobile-portrait #mobile-bottom-bar .mobile-round-info { letter-spacing: 0.03em; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.15); - border-radius: 20px; - padding: 4px 9px; + border-left: none; + border-radius: 0 20px 20px 0; + padding: 4px 10px 4px 8px; } -/* End Game — pinned right */ +/* End Game — flush right edge */ body.mobile-portrait #mobile-bottom-bar .mobile-leave-btn { margin-left: auto; background: rgba(180, 60, 60, 0.3) !important; border-color: rgba(220, 80, 80, 0.4) !important; + border-right: none !important; + border-radius: 20px 0 0 20px !important; + padding-right: 8px !important; color: rgba(255, 120, 120, 0.9) !important; }