Merge pull request #74 from JPL-Devin/devin/1778527726-splitter-theme-hover-fix

style: theme-aware splitter gradient + restore hover feedback

Author: tariqksoliman

configure/package.json

@@ -1,10 +1,6 @@
 {
   "name": "configure",
-<<<<<<< devin/1778526896-hotkeys-modal-3col
   "version": "5.0.5-20260511",
-=======
-  "version": "5.0.4-20260511",
->>>>>>> development
   "homepage": "./configure/build",
   "private": true,
   "dependencies": {

src/essence/Basics/UserInterface_/components/Splitter/Splitter.jsx

@@ -103,7 +103,7 @@ function Splitter({ type, orientation }) {
         if (!hasViewer) return null
         return (
             <div
-                className={splitterStyles.splitterV}
+                className={`${splitterStyles.splitterV} ${splitterStyles.splitterVGradient}`}
                 id="mapSplit"
                 style={{
                     width: splitterSizeHidden + 'px',
@@ -112,7 +112,6 @@ function Splitter({ type, orientation }) {
                         pxIsViewer -
                         splitterSizeHidden / 2 +
                         'px',
-                    background: 'linear-gradient(90deg, transparent, transparent, rgba(29, 31, 32, 0.4), transparent, transparent)',
                 }}
                 onPointerDown={handlePointerDown}
             >
@@ -216,7 +215,7 @@ function Splitter({ type, orientation }) {
         if (!hasGlobe) return null
         return (
             <div
-                className={splitterStyles.splitterV}
+                className={`${splitterStyles.splitterV} ${splitterStyles.splitterVGradient}`}
                 id="globeSplit"
                 style={{
                     width: splitterSizeHidden + 'px',
@@ -226,7 +225,6 @@ function Splitter({ type, orientation }) {
                         pxIsMap -
                         splitterSizeHidden / 2 +
                         'px',
-                    background: 'linear-gradient(90deg, transparent, transparent, rgba(29, 31, 32, 0.4), transparent, transparent)',
                 }}
                 onPointerDown={handlePointerDown}
             >

src/essence/Basics/UserInterface_/components/Splitter/Splitter.module.css

@@ -12,6 +12,17 @@
     transition: background 0.2s ease-out;
 }
 
+.splitterVGradient {
+    background: linear-gradient(
+        90deg,
+        transparent,
+        transparent,
+        rgba(var(--color-a-rgb, 29, 31, 32), 0.4),
+        transparent,
+        transparent
+    );
+}
+
 .splitterV:hover {
     background: var(--color-mmgis);
     opacity: 0.5;