dark mode borders

enjalot · Nov 30, 2024 · e9a1db8 · e9a1db8
1 parent cf80337
commit e9a1db8
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 5 deletions.
diff --git a/web/src/components/Explore/FilterActions.css b/web/src/components/Explore/FilterActions.css
@@ -14,6 +14,7 @@
 .filter-actions-button {
   border-radius: 4px !important;
   padding: 0.25rem 0.5rem !important;
+  font-size: 0.875rem !important;
 }
 
 .filter-actions-button.active {
@@ -38,3 +39,9 @@
 .filter-actions-button.active {
   background-color: var(--interactions---primary-color-interaction-primary-active);
 }
+
+@media (prefers-color-scheme: dark) {
+  .filter-actions-button {
+    border: .5px solid var(--neutrals-color-neutral-3) !important;
+  }
+}
diff --git a/web/src/components/Explore/LeftPane.css b/web/src/components/Explore/LeftPane.css
@@ -59,6 +59,8 @@
 
 @media (prefers-color-scheme: dark) {
     .left-pane-container {
+        border-right: 1px solid var(--borders-color-border-3);
         background-color: #111;
     }
+
 }
diff --git a/web/src/components/SubNav.module.css b/web/src/components/SubNav.module.css
@@ -74,5 +74,8 @@
 @media (prefers-color-scheme: dark) {
     .subHeaderContainer {
         background-color: #111;
+        border-bottom: 1px solid var(--borders-color-border-3);
     }
+
+
 }
diff --git a/web/src/pages/Explore.css b/web/src/pages/Explore.css
@@ -298,9 +298,9 @@
     background: #111
   }
 
-  /* .visualization-pane-container {
-    border-left: 1px solid #555;
-  } */
+  .visualization-pane-container {
+    border-left: 1px solid var(--borders-color-border-3);
+  }
 }
 
 
@@ -446,3 +446,4 @@
 .full-screen-explore-container {
   height: 100%;
 }
+
diff --git a/web/src/pages/FullScreenExplore.jsx b/web/src/pages/FullScreenExplore.jsx
@@ -435,10 +435,10 @@ function Explore() {
   const styles = {
     dragHandle: {
       position: 'absolute',
-      right: -4,
+      right: -8,
       top: 0,
       bottom: 0,
-      width: 8,
+      width: 30,
       cursor: 'ew-resize',
       backgroundColor: 'transparent',
       transition: 'background-color 0.2s',