CSS: various color fixes between light/dark themes

src/shared/styles/alerts.scss

@@ -0,0 +1,16 @@
+.conversejs {
+    .alert-danger {
+        h3 {
+            color: var(--background);
+            font-size: large;
+        }
+        .disconnect-msg {
+            color: var(--background) !important;
+        }
+
+        color: var(--background);
+        border-color: var(--danger-color-dark);
+        background-color: var(--danger-color);
+    }
+
+}

src/shared/styles/buttons.scss

@@ -30,6 +30,7 @@
         background-color: var(--primary-color) !important;
         border-color: transparent !important;
         &:focus, &:hover, &:active {
+            color: var(--button-text-color);
             background-color: var(--primary-color-dark) !important;
             border-color: transparent !important;
         }

src/shared/styles/forms.scss

@@ -26,7 +26,7 @@
             background-color: var(--background);
             &:focus {
                 color: var(--text-color);
-                background-color: var(--comment);
+                background-color: var(--focus-color);
             }
 
             &::-webkit-input-placeholder { /* Chrome/Opera/Safari */

src/shared/styles/index.scss

@@ -32,6 +32,7 @@
 @import "themes/dracula";
 
 @import "core";
+@import "alerts";
 @import "spinner";
 @import "buttons";
 @import "badges";

src/shared/styles/lists.scss

@@ -6,8 +6,7 @@
             background-color: var(--primary-color);
             border-color: var(--primary-color-dark);
         }
-
-        background-color: var(--comment);
+        background-color: var(--list-group-item-bg-color);
     }
 
     .list-container {

src/shared/styles/themes/classic.scss

@@ -16,6 +16,7 @@
     --chat-color: var(--green);
     --disabled-color: gray;
     --error-color: var(--dark-red);
+    --focus-color: var(--white);
 
     // ---
 
@@ -80,7 +81,7 @@
     --chat-info-color: var(--chatroom-head-bg-color);
 
     --danger-color-dark: #A93415; // darker red
-    --danger-color: #D24E2B; // dark-red
+    --danger-color: var(--redder-orange); // dark-red
     --highlight-color-darker: #B0E8E2;
     --highlight-color: #DCF9F6;
     --primary-color-dark:  #397491;
@@ -166,6 +167,7 @@
     --list-item-open-hover-color: var(--controlbox-head-color);
     --list-dot-circle-color: #f6dec1; // lighten($orange, 25%)
     --list-item-action-hover-color: var(--inverse-link-color);
+    --list-group-item-bg-color: var(--background);
 
     --chat-msg-hover-color: var(--list-item-hover-color);
 }

src/shared/styles/themes/dracula.scss

@@ -19,6 +19,7 @@
     --chat-color: var(--green);
     --disabled-color: var(--comment);
     --error-color: var(--red);
+    --focus-color: var(--comment);
 
     // ---
 
@@ -141,4 +142,5 @@
     --list-item-open-hover-color: var(--current-line);
     --list-dot-circle-color: var(--orange);
     --list-item-action-hover-color: var(--cyan);
+    --list-group-item-bg-color: var(--comment);
 }