schaefera/feedsignal
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

Fix Subscribe button overflowing the sidebar's fixed width

Browse source 
Not an article-row or hot-reload issue after all — the Subscribe
button in the sidebar header was genuinely spilling past the sidebar's
16rem width into the main content column. The sidebar panel is
position: fixed; z-index: 10 (dx-sidebar-container in the vendored
sidebar CSS), so that overflow floated on top of whatever main content
happened to sit at the same height, which was the first article row's
button — hence it only ever looked broken there.

Root cause: .subscribe-form .dx-input had flex: 1 but no min-width: 0,
so flexbox's default min-width: auto stopped it shrinking below its
content-based minimum once the Subscribe button took its share of the
row — a classic flexbox overflow gotcha. Added min-width: 0 to both
the input and the form row.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PqTJmazHBQK878vjQ4JnnF
This commit is contained in:
Austin Schaefer 2026-09-03 18:18:49 +02:00
parent 21103b1f25
commit 86863d809d
1 changed files with 2 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
crates/web/assets/app.css
View file

@ -10,8 +10,8 @@ body { font-family: system-ui, sans-serif; margin: 0; color: #1a1a1a; height: 10
.summary { color: #444; margin: 0; }
.topics { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.error { color: #b00020; }
.subscribe-form { display: flex; gap: 0.5rem; margin: 1rem 0; }
.subscribe-form .dx-input { flex: 1; }
.subscribe-form { display: flex; gap: 0.5rem; margin: 1rem 0; min-width: 0; }
.subscribe-form .dx-input { flex: 1; min-width: 0; }
.subscribe-status { margin: 0.25rem 0 1rem; font-size: 0.9rem; }
.subscribe-status.success { color: #1a7f37; }
.subscribe-status.error { color: #b00020; }