From 61ed8aa7f2b2ff81c7df2d729e7bb06e3e6e3fe8 Mon Sep 17 00:00:00 2001 From: librelad Date: Sat, 23 May 2026 13:21:34 +0100 Subject: [PATCH] style(config): match toggle box height to input fields The config-grid toggle box used the input's 12px vertical padding, but its 24px pill made it render 48px tall vs the inputs' 44px, so it sat too tall to read as inline. Trim vertical padding to 10px so the box is 44px. Co-Authored-By: Claude Opus 4.7 Signed-off-by: librelad --- containers/libreportal/frontend/css/forms.css | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/containers/libreportal/frontend/css/forms.css b/containers/libreportal/frontend/css/forms.css index 5b18a11..80330ec 100644 --- a/containers/libreportal/frontend/css/forms.css +++ b/containers/libreportal/frontend/css/forms.css @@ -351,13 +351,16 @@ select.form-control:focus { } /* Config page checkboxes — mirror the .form-control field box (same radius, - padding, fill and border) so a toggle reads as the same field surface as the - inputs beside it instead of a lighter, slightly-off box. */ + fill and border) so a toggle reads as the same field surface as the inputs + beside it instead of a lighter, slightly-off box. Vertical padding is 10px + (not the input's 12px): the 24px toggle pill is taller than input text, so + the trimmed padding keeps the box at the inputs' 44px height (24 + 10 + 10) + instead of overshooting to 48px. */ .checkbox-label { display: flex; align-items: center; cursor: pointer; - padding: 12px 16px; + padding: 10px 16px; min-height: 44px; border-radius: 8px; transition: background 0.18s ease, border-color 0.18s ease;