Fix: colors in table on:hover

covid19india · Jul 6, 2020 · 2a42f3b · 2a42f3b
1 parent 226ae45
commit 2a42f3b
Showing 1 changed file with 28 additions and 6 deletions.
diff --git a/src/dark-theme.scss b/src/dark-theme.scss
@@ -800,13 +800,20 @@ $default-primary: var(--primary-color);
       .row {
         &:nth-child(odd) {
           .cell {
-            background: $gray-light;
+            background: var(--background-color);
           }
         }
 
         &.is-highlighted {
           .cell {
-            background: $gray-hover-opaque !important;
+            background: $gray-opaque !important;
+            color: var(--background-color);
+
+            .delta {
+              &.is-deceased {
+                color: #6c757d !important;
+              }
+            }
           }
         }
 
@@ -816,7 +823,20 @@ $default-primary: var(--primary-color);
             user-select: none;
 
             &:hover {
-              background: $gray-hover-opaque !important;
+              background: $gray-opaque !important;
+              color: var(--background-color);
+
+              .sort-icon {
+                svg {
+                  fill: var(--background-color);
+                }
+              }
+            }
+
+            .sort-icon {
+              svg {
+                fill: var(--primary-color);
+              }
             }
           }
         }
@@ -826,15 +846,16 @@ $default-primary: var(--primary-color);
           top: 0;
 
           .cell {
-            background: $gray-hover-opaque !important;
+            background: $gray-opaque !important;
+            color: var(--background-color);
           }
         }
 
         .cell {
           color: $gray;
 
           &:first-child {
-            background: $gray-hover-darker-opaque;
+            background: var(--background-color);
           }
 
           svg {
@@ -902,7 +923,8 @@ $default-primary: var(--primary-color);
             padding: 0.75rem 0.5rem;
 
             &:hover {
-              background: $gray-hover-opaque !important;
+              background: $gray-opaque !important;
+              color: var(--background-color);
             }
           }