From de6c01aee99b1a63102ccbb5858cd15e71b1f55a Mon Sep 17 00:00:00 2001
From: phroggster <phroggster@users.noreply.github.com>
Date: Sat, 6 Jul 2024 02:18:12 -0500
Subject: [PATCH] Fix: styling issues in import setup dialogs

The import .firebotsetup dialogs had some style issues, notably evident
in the application light theme, and the popout description dialog has
white text on a white background regardless of theme. This should
address both issues.
---
 .../app/directives/modals/setups/import-setup-modal.js   | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/gui/app/directives/modals/setups/import-setup-modal.js b/src/gui/app/directives/modals/setups/import-setup-modal.js
index 2c8751f5f..77884a188 100644
--- a/src/gui/app/directives/modals/setups/import-setup-modal.js
+++ b/src/gui/app/directives/modals/setups/import-setup-modal.js
@@ -24,7 +24,7 @@
                         </file-chooser>
                     </div>
                     <div ng-if="$ctrl.setupSelected">
-                        <div style="padding: 15px;background: #242529;border-radius: 5px;">
+                        <div class="effect-list" style="padding: 15px;border-radius: 5px;">
                             <div class="script-name" style="font-size: 30px;font-weight: 100;">{{$ctrl.setup.name || "Unnamed Setup"}} <span class="script-version muted">v{{$ctrl.setup.version}}</span></div>
                             <div style="font-size: 13px;">by <span class="script-author">{{$ctrl.setup.author}}</span></div>
                             <div class="script-description" ng-bind-html="$ctrl.setup.description"></div>
@@ -36,7 +36,7 @@
                             <div ng-repeat="(key, name) in $ctrl.componentTypes">
                                 <div ng-repeat="component in $ctrl.setup.components[key]">
                                     <div style="display: flex;align-items: center;">
-                                        <span style="padding: 2px 7px;font-size: 13px;background: #242529;border-radius: 3px;">{{name}}</span>
+                                        <span class="list-group-item" style="padding: 2px 7px;font-size: 13px;border-radius: 3px;">{{name}}</span>
                                         <span style="margin-left: 5px;font-size: 20px;font-weight: 500;">{{component.trigger || component.name}}</span>
                                         <span ng-show="$ctrl.currentIds[component.id]" style="color:red;margin-left: 4px;"><i class="far fa-exclamation-triangle" uib-tooltip="This {{name}} already exists for you. If you import this Setup, the {{name}} will be replaced by the version in this setup."></i></span>
                                     </div>
@@ -46,9 +46,9 @@
 
                         <div ng-show="$ctrl.setup.requireCurrency" style="margin-top: 25px;">
                             <h4 class="muted">Currency To Use:</h4>
-                            <p class="muted">This setup requires that you select one of your currencies so it can be used in the included effects, variables, and restrictions.</p>
+                            <h5>This setup requires that you select one of your currencies so it can be used in the included effects, variables, and restrictions.</h5>
                             <select
-                                class="fb-select"
+                                class="form-control fb-select"
                                 ng-model="$ctrl.selectedCurrency"
                                 ng-options="currency as currency.name for currency in $ctrl.currencies">
                                 <option value="" disabled selected>Select currency...</option>
@@ -140,7 +140,6 @@
                     `);
 
                     modal.document.title = `Firebot Setup - ${$ctrl.setup.name}`;
-                    modal.document.body.style.color = "white";
                     modal.document.body.style.fontFamily = "sans-serif";
                 };