From f8ca73265bd6043e428081a5abd2eff96d3e975e Mon Sep 17 00:00:00 2001
From: RossAscends <124905043+RossAscends@users.noreply.github.com>
Date: Sat, 27 Apr 2024 13:13:54 +0900
Subject: [PATCH] userSettings expandables get borders

---
 public/index.html | 11 ++++++-----
 public/style.css  | 11 ++++++++++-
 2 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/public/index.html b/public/index.html
index d6718adbc..13295a005 100644
--- a/public/index.html
+++ b/public/index.html
@@ -3582,7 +3582,7 @@
                                 </div>
                             </div>
                             <div data-newbie-hidden class="inline-drawer wide100p flexFlowColumn">
-                                <div class="inline-drawer-toggle inline-drawer-header" title="Specify colors for your theme." data-i18n="[title]Specify colors for your theme.">
+                                <div class="inline-drawer-toggle inline-drawer-header userSettingsInnerExpandable" title="Specify colors for your theme." data-i18n="[title]Specify colors for your theme.">
                                     <b><span data-i18n="Theme Colors">Theme Colors</span></b>
                                     <div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
                                 </div>
@@ -3631,7 +3631,7 @@
                                     </div>
                                 </div>
                             </div>
-
+                            <hr>
                             <div data-newbie-hidden name="FontBlurChatWidthBlock" class="flex-container">
 
                                 <div class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
@@ -3759,9 +3759,10 @@
                                 </div> -->
 
                             </div>
-
+                            <hr>
                             <div name="themeToggles">
-                                <h4 data-i18n="Theme Toggles">Theme Toggles</h4>
+                                <!-- <h4 data-i18n="Theme Toggles">Theme Toggles</h4> -->
+
                                 <label for="reduced_motion" class="checkbox_label" title="Disable animations and transitions" data-i18n="[title]Disables animations and transitions">
                                     <input id="reduced_motion" type="checkbox" />
                                     <small data-i18n="Reduced Motion">Reduced Motion</small>
@@ -4088,7 +4089,7 @@
                                     <small data-i18n="Request token probabilities">Request token probabilities</small>
                                 </label>
                                 <div data-newbie-hidden class="inline-drawer wide100p flexFlowColumn">
-                                    <div class="inline-drawer-toggle inline-drawer-header" title="Automatically reject and re-generate AI message based on configurable criteria." data-i18n="[title]Automatically reject and re-generate AI message based on configurable criteria">
+                                    <div class="inline-drawer-toggle inline-drawer-header userSettingsInnerExpandable" title="Automatically reject and re-generate AI message based on configurable criteria." data-i18n="[title]Automatically reject and re-generate AI message based on configurable criteria">
                                         <b><span data-i18n="Auto-swipe">Auto-swipe</span></b>
                                         <div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
                                     </div>
diff --git a/public/style.css b/public/style.css
index b7b4274f9..4e5385e3b 100644
--- a/public/style.css
+++ b/public/style.css
@@ -3165,6 +3165,15 @@ body.big-avatars .missing-avatar {
     text-align: center;
 }
 
+
+.userSettingsInnerExpandable {
+    border: 1px solid;
+    border-color: var(--SmartThemeBorderColor);
+    border-radius: 5px;
+    padding: 2px 5px !important;
+    margin: 5px 0;
+}
+
 @keyframes ellipsis {
     0% {
         content: ""
@@ -4021,4 +4030,4 @@ body:not(.movingUI) .drawer-content.maximized {
         height: 100vh;
         z-index: 9999;
     }
-}
+}
\ No newline at end of file