From 44e2fb4d4e4fb38c6affecc994bcb69d0a8d2281 Mon Sep 17 00:00:00 2001 From: Austin Schaefer Date: Thu, 3 Sep 2026 19:07:51 +0200 Subject: [PATCH] Actually fix the Subscribe button overflow (previous fix was inert) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The prior commit's .subscribe-form .dx-input selector never matched anything: dioxus's #[css_module] macro content-hashes Input's class at build time (e.g. rendered as class="dx-input-83f82cbc", confirmed by inspecting the live DOM), so a selector on the unhashed "dx-input" name was dead CSS from the start — hence the overflow persisting across rebuilds and hard refreshes. Select on the raw tag within .subscribe-form instead, which doesn't depend on the module's per-build hash. Verified against the running dev server (not just visually): the Subscribe button now renders flush with the form's own right edge (both at x=247) instead of spilling to x=314, well inside the sidebar's x=256 boundary. Co-Authored-By: Claude Sonnet 5 Claude-Session: https://claude.ai/code/session_01PqTJmazHBQK878vjQ4JnnF --- crates/web/assets/app.css | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/crates/web/assets/app.css b/crates/web/assets/app.css index f4def21..eff0f5f 100644 --- a/crates/web/assets/app.css +++ b/crates/web/assets/app.css @@ -11,7 +11,10 @@ body { font-family: system-ui, sans-serif; margin: 0; color: #1a1a1a; height: 10 .topics { display: flex; flex-wrap: wrap; gap: 0.3rem; } .error { color: #b00020; } .subscribe-form { display: flex; gap: 0.5rem; margin: 1rem 0; min-width: 0; } -.subscribe-form .dx-input { flex: 1; min-width: 0; } +/* Target the raw tag, not the component's own class: dioxus's #[css_module] + content-hashes Input's class per build (e.g. "dx-input-83f82cbc"), so a + selector on the unhashed name never matches anything. */ +.subscribe-form input { flex: 1 1 0; min-width: 0; } .subscribe-status { margin: 0.25rem 0 1rem; font-size: 0.9rem; } .subscribe-status.success { color: #1a7f37; } .subscribe-status.error { color: #b00020; }