From 721d7202a08310e8ce542a6c48a6196ada481c3a Mon Sep 17 00:00:00 2001
From: Michael Barrett <991592+mike182uk@users.noreply.github.com>
Date: Fri, 16 Jun 2023 13:14:43 +0100
Subject: [PATCH] Added truncation to custom theme setting description (#17044)

no issue

Added truncation to custom theme setting description to prevent overly
long custom setting descriptions from diminishing the settings UX
---
 ghost/admin/app/components/custom-theme-settings/boolean.hbs | 2 +-
 ghost/admin/app/components/custom-theme-settings/color.hbs   | 2 +-
 ghost/admin/app/components/custom-theme-settings/image.hbs   | 2 +-
 ghost/admin/app/components/custom-theme-settings/select.hbs  | 2 +-
 ghost/admin/app/components/custom-theme-settings/text.hbs    | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/ghost/admin/app/components/custom-theme-settings/boolean.hbs b/ghost/admin/app/components/custom-theme-settings/boolean.hbs
index fa99b4c0de..495a7b070b 100644
--- a/ghost/admin/app/components/custom-theme-settings/boolean.hbs
+++ b/ghost/admin/app/components/custom-theme-settings/boolean.hbs
@@ -12,7 +12,7 @@
             </div>
         </div>
         {{#if @setting.description}}
-            <div class="gh-setting-desc" style="margin-top: 1px">{{@setting.description}}</div>
+            <div class="gh-setting-desc" style="margin-top: 1px">{{truncate @setting.description 100}}</div>
         {{/if}}
     </div>
 </div>
\ No newline at end of file
diff --git a/ghost/admin/app/components/custom-theme-settings/color.hbs b/ghost/admin/app/components/custom-theme-settings/color.hbs
index d544939244..ed43446922 100644
--- a/ghost/admin/app/components/custom-theme-settings/color.hbs
+++ b/ghost/admin/app/components/custom-theme-settings/color.hbs
@@ -4,7 +4,7 @@
             {{humanize-setting-key @setting.key}}
         </label>
         {{#if @setting.description}}
-            <div class="gh-setting-desc">{{@setting.description}}</div>
+            <div class="gh-setting-desc">{{truncate @setting.description 100}}</div>
         {{/if}}
         {{#if this.isInvalid}}
             <div class="gh-setting-error {{if (is-empty @setting.description) "mt3"}}">Enter a color in hex format</div>
diff --git a/ghost/admin/app/components/custom-theme-settings/image.hbs b/ghost/admin/app/components/custom-theme-settings/image.hbs
index 17daaf0950..e0a3ac770f 100644
--- a/ghost/admin/app/components/custom-theme-settings/image.hbs
+++ b/ghost/admin/app/components/custom-theme-settings/image.hbs
@@ -11,7 +11,7 @@
                     <div class="gh-setting-error" data-test-error="icon">{{or error.context error.message}}</div>
                 {{/each}}
                 {{#if @setting.description}}
-                    <div class="gh-setting-desc" style="margin-top: 8px">{{@setting.description}}</div>
+                    <div class="gh-setting-desc" style="margin-top: 8px">{{truncate @setting.description 100}}</div>
                 {{/if}}
             </div>
             <div class="gh-setting-action gh-uploadbutton-container flex flex-column items-stretch">
diff --git a/ghost/admin/app/components/custom-theme-settings/select.hbs b/ghost/admin/app/components/custom-theme-settings/select.hbs
index 4bbd497e0d..fecc9ad8ce 100644
--- a/ghost/admin/app/components/custom-theme-settings/select.hbs
+++ b/ghost/admin/app/components/custom-theme-settings/select.hbs
@@ -15,7 +15,7 @@
             {{svg-jar "arrow-down-small"}}
         </span>
         {{#if @setting.description}}
-            <div class="gh-setting-desc">{{@setting.description}}</div>
+            <div class="gh-setting-desc">{{truncate @setting.description 100}}</div>
         {{/if}}
     </div>
 </div>
\ No newline at end of file
diff --git a/ghost/admin/app/components/custom-theme-settings/text.hbs b/ghost/admin/app/components/custom-theme-settings/text.hbs
index 8dcca964e9..b62c0e79f9 100644
--- a/ghost/admin/app/components/custom-theme-settings/text.hbs
+++ b/ghost/admin/app/components/custom-theme-settings/text.hbs
@@ -13,7 +13,7 @@
             {{on "blur" this.triggerOnChange}}
         />
         {{#if @setting.description}}
-            <div class="gh-setting-desc">{{@setting.description}}</div>
+            <div class="gh-setting-desc">{{truncate @setting.description 100}}</div>
         {{/if}}
     </div>
 </div>
\ No newline at end of file