Update cell hover styles, fixing hidden checkboxes

* add cell horizontal borders instead of updating cell background color
iterative · Aug 16, 2022 · dd32e71 · dd32e71
1 parent b803ab7
commit dd32e71
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 14 deletions.
diff --git a/webview/src/experiments/components/table/styles.module.scss b/webview/src/experiments/components/table/styles.module.scss
@@ -133,10 +133,6 @@ $workspace-row-edge-margin: $edge-padding - $cell-padding;
       background-color: $row-hover-background-color;
     }
 
-    .unselectedExperiment .experimentCell:hover & {
-      background-color: $cell-hover-background-color;
-    }
-
     .workspaceWithChanges.unselectedExperiment & {
       border: 1px solid $changed-color;
     }
@@ -162,12 +158,6 @@ $workspace-row-edge-margin: $edge-padding - $cell-padding;
       border-bottom-color: $row-hover-background-color;
     }
 
-    .runningExperiment .experimentCell:hover & {
-      background-color: $cell-hover-background-color;
-      border-left-color: $cell-hover-background-color;
-      border-bottom-color: $cell-hover-background-color;
-    }
-
     .workspaceWithChanges.runningExperiment & {
       border-right-color: $changed-color;
       border-top-color: $changed-color;
@@ -279,9 +269,17 @@ $workspace-row-edge-margin: $edge-padding - $cell-padding;
         background-color: $row-hover-background-color;
       }
 
-      .td:hover:not(.experimentCell),
-      .experimentCell:hover:before {
-        background-color: $cell-hover-background-color;
+      .td:hover {
+        border-right: $row-border;
+        border-left: $row-border;
+
+        &:first-child {
+          border-left: none;
+        }
+
+        &:last-child {
+          border-right: none;
+        }
       }
     }
 

diff --git a/webview/src/shared/variables.scss b/webview/src/shared/variables.scss
@@ -21,7 +21,6 @@ $meta-cell-color: var(--vscode-descriptionForeground);
 
 $hover-background-color: var(--vscode-list-hoverBackground);
 $row-hover-background-color: var(--vscode-list-hoverBackground);
-$cell-hover-background-color: var(--vscode-dropdown-background);
 
 $accent-color: var(--button-primary-background);