From bf98b307e8aedf126ee6970bd22ea9b2be8064d5 Mon Sep 17 00:00:00 2001
From: Gigi <dergigi@pm.me>
Date: Wed, 15 Oct 2025 17:57:33 +0200
Subject: [PATCH] style: align setting buttons vertically with fixed label
 width

Add min-width: 220px to inline setting labels to create consistent
'tab stops' so buttons align vertically regardless of label length.
Remove constraint on mobile where settings stack vertically.
---
 src/styles/components/forms.css | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/styles/components/forms.css b/src/styles/components/forms.css
index 6335a8a1..c6569e02 100644
--- a/src/styles/components/forms.css
+++ b/src/styles/components/forms.css
@@ -3,7 +3,7 @@
 .setting-group.setting-inline { display: flex; align-items: center; gap: 1rem; }
 .setting-label { text-align: left; flex: 1; }
 .setting-control { display: flex; justify-content: flex-end; align-items: center; }
-.setting-group.setting-inline label { margin-bottom: 0; }
+.setting-group.setting-inline label { margin-bottom: 0; min-width: 220px; }
 .setting-group label { display: block; margin-bottom: 0.5rem; color: var(--color-text); font-weight: 500; text-align: left; }
 .setting-buttons { display: flex; align-items: center; gap: 0.5rem; }
 .color-picker { display: flex; align-items: center; gap: 0.5rem; }
@@ -59,6 +59,10 @@
     gap: 0.75rem;
   }
   
+  .setting-group.setting-inline label {
+    min-width: unset;
+  }
+  
   .setting-inline .setting-select {
     width: 100%;
     min-width: unset;