From 7adfa799e96d95ccdc0bc6e807ceb9285b4d8ec8 Mon Sep 17 00:00:00 2001 From: Will Miao Date: Thu, 29 Oct 2026 21:03:57 +0800 Subject: [PATCH] fix(ui): use the shared field radius in the phone header The phone search field was forced to border-radius:999px. That looked out of place next to the 6px used everywhere else, and at that radius the 1px border vanished along both arcs - the element's overflow:hidden rounded clip cuts the outline, so the field read as a broken frame. Use var(--border-radius-sm, 6px), i.e. exactly the wide-screen value. Verified at 320/390/520/600 and focused, light and dark. --- static/css/components/header.css | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/static/css/components/header.css b/static/css/components/header.css index 1d192722..82b46ec4 100644 --- a/static/css/components/header.css +++ b/static/css/components/header.css @@ -937,9 +937,12 @@ margin: 0 4px; } + /* Same corner radius as the wide-screen field. With a pill radius the 1px + border disappeared along both arcs (the container's overflow:hidden + rounded clip), which read as a broken outline. */ .header-search .search-container { width: 100%; - border-radius: 999px; + border-radius: var(--border-radius-sm, 6px); } .header-search input {