From 09c14f86630c8123d41a80c23c4496f408f95ace Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Fri, 31 Jan 2025 21:50:07 +0200
Subject: [PATCH] style(next): settings/appearance: fix the length of font size
 input boxes

---
 .../app/widgets/type_widgets/options/appearance/fonts.ts | 8 ++++----
 src/public/stylesheets/theme-next/settings.css           | 9 +++++++++
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/public/app/widgets/type_widgets/options/appearance/fonts.ts b/src/public/app/widgets/type_widgets/options/appearance/fonts.ts
index 77030fba2..900c91cba 100644
--- a/src/public/app/widgets/type_widgets/options/appearance/fonts.ts
+++ b/src/public/app/widgets/type_widgets/options/appearance/fonts.ts
@@ -65,7 +65,7 @@ const TPL = `
         <div class="col-6">
             <label for="main-font-size">${t("fonts.size")}</label>
 
-            <div class="input-group">
+            <div class="input-group main-font-size-input-group">
                 <input id="main-font-size" type="number" class="main-font-size form-control options-number-input" min="50" max="200" step="10"/>
                 <span class="input-group-text">%</span>
             </div>
@@ -83,7 +83,7 @@ const TPL = `
         <div class="col-6">
             <label for="tree-font-size">${t("fonts.size")}</label>
 
-            <div class="input-group">
+            <div class="input-group tree-font-size-input-group">
                 <input id="tree-font-size" type="number" class="tree-font-size form-control options-number-input" min="50" max="200" step="10"/>
                 <span class="input-group-text">%</span>
             </div>
@@ -101,7 +101,7 @@ const TPL = `
         <div class="col-6">
             <label for="detail-font-size">${t("fonts.size")}</label>
 
-            <div class="input-group">
+            <div class="input-group detail-font-size-input-group">
                 <input id="detail-font-size" type="number" class="detail-font-size form-control options-number-input" min="50" max="200" step="10"/>
                 <span class="input-group-text">%</span>
             </div>
@@ -119,7 +119,7 @@ const TPL = `
         <div class="col-6">
             <label for="monospace-font-size">${t("fonts.size")}</label>
 
-            <div class="input-group">
+            <div class="input-group monospace-font-size-input-group">
                 <input id="monospace-font-size" type="number" class="monospace-font-size form-control options-number-input" min="50" max="200" step="10"/>
                 <span class="input-group-text">%</span>
             </div>
diff --git a/src/public/stylesheets/theme-next/settings.css b/src/public/stylesheets/theme-next/settings.css
index e2f1b7467..4a77f6228 100644
--- a/src/public/stylesheets/theme-next/settings.css
+++ b/src/public/stylesheets/theme-next/settings.css
@@ -71,3 +71,12 @@
     padding: 0;
     margin-bottom: 1em;
 }
+
+/* Appeareance */
+
+.main-font-size-input-group,
+.tree-font-size-input-group,
+.detail-font-size-input-group,
+.monospace-font-size-input-group {
+    width: fit-content;
+}
\ No newline at end of file