Update static/style.css

static/style.css

@@ -69,6 +69,8 @@ button:hover {
     scrollbar-width: thin;
     scrollbar-color: #665c54 var(--bg-statusline1);
     border-radius: 0.5rem;
+    z-index: 50;
+    position: relative;
 }
 
 /* Scrollbar WebKit */
@@ -132,18 +134,16 @@ form#chatForm {
   height: 8px;
   margin: 0 4px;
   background-color: var(--aqua);
-    border-radius: 50%;
+  border-radius: 50%;
   animation: bounce 1.4s infinite ease-in-out both;
 }
 
 .animation-delay-150 {
   animation-delay: 0.15s;
 }
-
 .animation-delay-300 {
   animation-delay: 0.3s;
 }
-
 .bg-aqua {
   background-color: var(--aqua);
 }
@@ -155,7 +155,6 @@ form#chatForm {
   transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
 }
 
-/* When collapsed into minimal */
 #configPanel.minimal {
   max-height: 120px;
   padding-top: 0.5rem;
@@ -163,20 +162,25 @@ form#chatForm {
   opacity: 0.95;
 }
 
-/* Full expanded config */
 #configPanel.expanded {
   max-height: 1000px;
 }
 
-/* Smaller model labels */
+/* Hide/show label vs model name */
+#configPanel.minimal .model-label {
+  display: none;
+}
+#configPanel.minimal .model-name {
+  display: inline-block;
+}
+#configPanel.expanded .model-name {
+  display: none;
+}
+
+/* Layout for each model zone */
 .model-zone {
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
 }
-
-/* Hide dropdown and show only label and loader when minimal */
-#configPanel.minimal .model-dropdown {
-  display: none;
-}