mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-09-21 03:01:27 -03:00
Will Miao
931dfbe1d3
At ~628px the header overflowed horizontally by 53px: the labelled nav held 383px that flex could not reclaim, so the search field was clamped to its 200px floor and had only ~96px of text room, letting the placeholder collide with the Ctrl+F cue and the inline toggles. Three rules drove that: - .header-search had a hard min-width: 200px, so it parked at a fixed width instead of shrinking with the space it was actually given. - The input reserved 6.75rem for "options + filter + clear/cue", but that declaration never applied: search-filter.css is imported after header.css and its .search-container input (equal specificity) set the right padding. The inline chrome actually needs 126px, so text ran underneath it. - Labels stayed on the nav down to 600px, where a labelled nav (~383px) and a readable search field (~300px) cannot coexist. - Drop the min-width floors on .header-search and its container so the field compresses naturally. - Reserve exactly the inline chrome (cue 58 + clear 28 + toggles 56 + gaps and edges 16 = 126px) and document why !important is required here. - Add a 1366px breakpoint that hides the Ctrl+F cue and drops the reservation to 68px; the shortcut itself keeps working, only the visual hint goes. - Move the nav icon fallback from 600px to 700px and keep the <=600px container tightening as its own query. Verified in headless Chrome against the real stylesheet: no horizontal overflow at any width (was 53px at 628px, 80px at 601px), and the placeholder plus Ctrl+F cue never overlap (the same collision existed at ~1250px, where the field now keeps 85px of text room instead of 2.8px).