From 686596a8c104233aada786792b56cfc29701d44c Mon Sep 17 00:00:00 2001
From: Corban-Lee Jones <corbz.jones@gmail.com>
Date: Sun, 27 Oct 2024 21:28:43 +0000
Subject: [PATCH] custom select on styles

---
 apps/home/static/home/js/tabs/styles.js        | 6 ++++++
 apps/home/templates/home/modals/editStyle.html | 8 ++++----
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/apps/home/static/home/js/tabs/styles.js b/apps/home/static/home/js/tabs/styles.js
index f1b3a9a..e1e1be4 100644
--- a/apps/home/static/home/js/tabs/styles.js
+++ b/apps/home/static/home/js/tabs/styles.js
@@ -290,4 +290,10 @@ async function loadMutatorOptions() {
     });
 
     $inputs.prop("disabled", false);
+
+    // Re-init the component
+    if ($inputs.next('.corbz-select-container').length) {
+        $inputs.next('.corbz-select-container').remove();
+        $inputs.initCorbzSelect();
+    }
 }
diff --git a/apps/home/templates/home/modals/editStyle.html b/apps/home/templates/home/modals/editStyle.html
index d5229c0..6193d62 100644
--- a/apps/home/templates/home/modals/editStyle.html
+++ b/apps/home/templates/home/modals/editStyle.html
@@ -74,8 +74,8 @@
                         <div class="col-lg-6 pe-lg-4">
                             <div class="mb-4 mb-lg-0">
                                 <label for="styleTitleMutator" class="form-label">Title Mutator</label>
-                                <select name="styleTitleMutator" id="styleTitleMutator" class="select-2" data-field="title_mutator" tabindex="8">
-                                    <option value="">-----</option>
+                                <select name="styleTitleMutator" id="styleTitleMutator" class="corbz-select" data-field="title_mutator" tabindex="8">
+                                    <option value="">---</option>
                                 </select>
                                 <div class="form-text">Modify the title in fun ways.</div>
                             </div>
@@ -83,8 +83,8 @@
                         <div class="col-lg-6 ps-lg-4">
                             <div class="">
                                 <label for="styleDescriptionMutator" class="form-label">Description Mutator</label>
-                                <select name="styleDescriptionMutator" id="styleDescriptionMutator" class="select-2" data-field="description_mutator" tabindex="9">
-                                    <option value="">-----</option>
+                                <select name="styleDescriptionMutator" id="styleDescriptionMutator" class="corbz-select" data-field="description_mutator" tabindex="9">
+                                    <option value="">---</option>
                                 </select>
                                 <div class="form-text">Modify the description in fun ways.</div>
                             </div>