From 93984d2efc507988129c78aa03999b53a5cba578 Mon Sep 17 00:00:00 2001
From: Chris Harris <1834925+df2@users.noreply.github.com>
Date: Sat, 26 Feb 2022 06:45:12 -0800
Subject: [PATCH] List group item colors in light and dark modes (#1061)

Co-authored-by: Chris Harris <twoxsquared@gmai.com>
---
 src/scss/layout/_dark.scss | 16 +++++++++++++---
 src/scss/ui/_lists.scss    | 25 +++++++++++++++++++++++++
 2 files changed, 38 insertions(+), 3 deletions(-)

diff --git a/src/scss/layout/_dark.scss b/src/scss/layout/_dark.scss
index 159cfd9d59..5e83b353f0 100644
--- a/src/scss/layout/_dark.scss
+++ b/src/scss/layout/_dark.scss
@@ -158,13 +158,23 @@ body:not(.theme-dark) .hide-theme-light {
     background: transparent;
   }
 
+  .list-group-header {
+    background: $dark-mode-darken;
+  }
+
   .list-group-item {
-    color: $dark-mode-text;
     border-color: $border-color-transparent;
   }
 
-  .list-group-header {
-    background: $dark-mode-darken;
+  .list-group-item:not(.disabled):not(:disabled) {
+    color: $dark-mode-text;
+  }
+
+  .list-group-item {
+    &.disabled,
+    &:disabled {
+      color: $gray-600;
+    }
   }
 
   .apexcharts-radialbar-area {
diff --git a/src/scss/ui/_lists.scss b/src/scss/ui/_lists.scss
index 21baef5895..b62d3624e7 100644
--- a/src/scss/ui/_lists.scss
+++ b/src/scss/ui/_lists.scss
@@ -20,6 +20,31 @@
   }
 }
 
+.list-group-item {
+  background-color: rgba(27,125,241,0.02);
+}
+
+.list-group-item.active {
+  background-color: inherit;
+  border-left: 2px solid $yellow !important;
+}
+
+.list-group-item {
+  &:active,
+  &:focus,
+  &:hover{
+    background-color: inherit;
+  }
+}
+
+.list-group-item {
+  &.disabled,
+  &:disabled {
+    color: $gray-500;
+    background-color: rgba(27,125,241,0.02);
+  }
+}
+
 .list-bordered {
   .list-item {
     border-top: 1px solid $border-color;