From e90fea48a0ce5182298edca0c7dd609b04f6c154 Mon Sep 17 00:00:00 2001
From: gabeszm <vgabor92@protonmail.com>
Date: Thu, 16 Oct 2025 18:07:17 +0200
Subject: [PATCH] Add customizable CTA arrow icons for all cards

- Add cta_card_X_cta_icon settings for each CTA card (1-4)
- Default to "angle-double-right" icon for all cards
- Allow admin to customize arrow icon per card (e.g., 'arrow-right', 'chevron-right', etc.)
- Update component template to use settings instead of hardcoded icon
- Each CTA card now has independent control over its arrow/action icon
---
 .../discourse/components/welcome-banner.gjs   |  9 +++---
 settings.yml                                  | 28 +++++++++++++++++++
 2 files changed, 32 insertions(+), 5 deletions(-)

diff --git a/javascripts/discourse/components/welcome-banner.gjs b/javascripts/discourse/components/welcome-banner.gjs
index c5fe40b..dd3e86c 100644
--- a/javascripts/discourse/components/welcome-banner.gjs
+++ b/javascripts/discourse/components/welcome-banner.gjs
@@ -86,7 +86,7 @@ export default class WelcomeBanner extends Component {
                       <span class="cta-title">{{settings.cta_card_1_title}}</span>
                       <span class="cta-desc">{{settings.cta_card_1_description}}</span>
                       <span class="cta-cta">
-                        {{icon "angle-double-right"}}
+                        {{icon settings.cta_card_1_cta_icon}}
                         {{settings.cta_card_1_cta_text}}
                       </span>
                     </div>
@@ -108,7 +108,7 @@ export default class WelcomeBanner extends Component {
                       <span class="cta-title">{{settings.cta_card_2_title}}</span>
                       <span class="cta-desc">{{settings.cta_card_2_description}}</span>
                       <span class="cta-cta">
-                        {{icon "angle-double-right"}}
+                        {{icon settings.cta_card_2_cta_icon}}
                         {{settings.cta_card_2_cta_text}}
                       </span>
                     </div>
@@ -130,8 +130,7 @@ export default class WelcomeBanner extends Component {
                       <span class="cta-title">{{settings.cta_card_3_title}}</span>
                       <span class="cta-desc">{{settings.cta_card_3_description}}</span>
                       <span class="cta-cta">
-                      <p>»</p>
-                        {{icon "angle-double-right"}}
+                        {{icon settings.cta_card_3_cta_icon}}
                         {{settings.cta_card_3_cta_text}}
                       </span>
                     </div>
@@ -153,7 +152,7 @@ export default class WelcomeBanner extends Component {
                       <span class="cta-title">{{settings.cta_card_4_title}}</span>
                       <span class="cta-desc">{{settings.cta_card_4_description}}</span>
                       <span class="cta-cta">
-                        {{icon "angle-double-right"}}
+                        {{icon settings.cta_card_4_cta_icon}}
                         {{settings.cta_card_4_cta_text}}
                       </span>
                     </div>
diff --git a/settings.yml b/settings.yml
index c952d9a..742af0b 100644
--- a/settings.yml
+++ b/settings.yml
@@ -161,6 +161,13 @@ cta_card_1_cta_text:
     en: CTA card 1 call-to-action text
     hu: 1. CTA kártya cselekvésre ösztönző szöveg
 
+cta_card_1_cta_icon:
+  default: "angle-double-right"
+  type: string
+  description:
+    en: "CTA card 1 arrow icon (Font Awesome). Examples: 'angle-double-right', 'arrow-right', 'chevron-right', 'long-arrow-alt-right'"
+    hu: "1. CTA kártya nyíl ikon (Font Awesome). Példák: 'angle-double-right', 'arrow-right', 'chevron-right', 'long-arrow-alt-right'"
+
 cta_card_1_url:
   default: "https://www.nyiltvilag.hu/c/tudasbazis/9"
   type: string
@@ -224,6 +231,13 @@ cta_card_2_cta_text:
     en: CTA card 2 call-to-action text
     hu: 2. CTA kártya cselekvésre ösztönző szöveg
 
+cta_card_2_cta_icon:
+  default: "angle-double-right"
+  type: string
+  description:
+    en: "CTA card 2 arrow icon (Font Awesome). Examples: 'angle-double-right', 'arrow-right', 'chevron-right', 'long-arrow-alt-right'"
+    hu: "2. CTA kártya nyíl ikon (Font Awesome). Példák: 'angle-double-right', 'arrow-right', 'chevron-right', 'long-arrow-alt-right'"
+
 cta_card_2_url:
   default: "https://www.nyiltvilag.hu/c/altalanos/4"
   type: string
@@ -287,6 +301,13 @@ cta_card_3_cta_text:
     en: CTA card 3 call-to-action text
     hu: 3. CTA kártya cselekvésre ösztönző szöveg
 
+cta_card_3_cta_icon:
+  default: "angle-double-right"
+  type: string
+  description:
+    en: "CTA card 3 arrow icon (Font Awesome). Examples: 'angle-double-right', 'arrow-right', 'chevron-right', 'long-arrow-alt-right'"
+    hu: "3. CTA kártya nyíl ikon (Font Awesome). Példák: 'angle-double-right', 'arrow-right', 'chevron-right', 'long-arrow-alt-right'"
+
 cta_card_3_url:
   default: "https://www.nyiltvilag.hu/c/fejlesztes/7"
   type: string
@@ -350,6 +371,13 @@ cta_card_4_cta_text:
     en: CTA card 4 call-to-action text
     hu: 4. CTA kártya cselekvésre ösztönző szöveg
 
+cta_card_4_cta_icon:
+  default: "angle-double-right"
+  type: string
+  description:
+    en: "CTA card 4 arrow icon (Font Awesome). Examples: 'angle-double-right', 'arrow-right', 'chevron-right', 'long-arrow-alt-right'"
+    hu: "4. CTA kártya nyíl ikon (Font Awesome). Példák: 'angle-double-right', 'arrow-right', 'chevron-right', 'long-arrow-alt-right'"
+
 cta_card_4_url:
   default: "https://www.nyiltvilag.hu/c/biztonsag/8"
   type: string