From 089d8a4ca776f1edb84cbe1f7ef48a96bc72535e Mon Sep 17 00:00:00 2001
From: tobiu <tobiasuhlig78@gmail.com>
Date: Sun, 1 Sep 2024 14:28:31 +0200
Subject: [PATCH] theme-neo-light: splitter styling #5848

---
 resources/scss/src/component/Splitter.scss    | 11 +++++++-
 .../scss/theme-dark/component/Splitter.scss   |  9 ++++---
 .../scss/theme-light/component/Splitter.scss  |  9 ++++---
 .../theme-neo-light/component/Splitter.scss   | 26 +++++--------------
 src/draggable/DragZone.mjs                    | 11 ++++----
 5 files changed, 34 insertions(+), 32 deletions(-)

diff --git a/resources/scss/src/component/Splitter.scss b/resources/scss/src/component/Splitter.scss
index ef6d2a7fd..0c8a9619d 100644
--- a/resources/scss/src/component/Splitter.scss
+++ b/resources/scss/src/component/Splitter.scss
@@ -1,9 +1,10 @@
 .neo-splitter {
     background-color: var(--splitter-background-color);
     border          : var(--splitter-border);
+    border-radius   : var(--splitter-border-radius);
     transition      : background-color 0.3s ease-in-out, border-color 0.3s ease-in-out;
 
-    &:hover {
+    &:active, &:hover {
         background-color: var(--splitter-hover-color);
         border-color    : var(--splitter-hover-color);
     }
@@ -12,12 +13,14 @@
         border-left : none;
         border-right: none;
         cursor      : ns-resize;
+        margin      : var(--splitter-margin-horizontal);
     }
 
     &.neo-vertical {
         border-bottom: none;
         border-top   : none;
         cursor       : ew-resize;
+        margin      : var(--splitter-margin-vertical);
     }
 }
 
@@ -25,5 +28,11 @@
     &.neo-splitter {
         background-color: var(--splitter-hover-color);
         border-color    : var(--splitter-hover-color);
+
+        &.neo-horizontal, &.neo-vertical {
+            // getBoundingClientRect() already adds margins to positions,
+            // so it would get added twice unless we nullify it.
+            margin: 0;
+        }
     }
 }
diff --git a/resources/scss/theme-dark/component/Splitter.scss b/resources/scss/theme-dark/component/Splitter.scss
index a32881492..0de6e1773 100644
--- a/resources/scss/theme-dark/component/Splitter.scss
+++ b/resources/scss/theme-dark/component/Splitter.scss
@@ -1,5 +1,8 @@
 :root .neo-theme-dark { // .neo-splitter
-    --splitter-background-color: #3c3f41;
-    --splitter-border          : 1px solid #323232;
-    --splitter-hover-color     : #64B5F6;
+    --splitter-background-color : #3c3f41;
+    --splitter-border           : 1px solid #323232;
+    --splitter-border-radius    : 0;
+    --splitter-hover-color      : #64B5F6;
+    --splitter-margin-horizontal: 0;
+    --splitter-margin-vertical  : 0;
 }
diff --git a/resources/scss/theme-light/component/Splitter.scss b/resources/scss/theme-light/component/Splitter.scss
index edf348ad0..604187fd0 100644
--- a/resources/scss/theme-light/component/Splitter.scss
+++ b/resources/scss/theme-light/component/Splitter.scss
@@ -1,5 +1,8 @@
 :root .neo-theme-light { // .neo-splitter
-    --splitter-background-color: #f2f2f2;
-    --splitter-border          : 1px solid #ddd;
-    --splitter-hover-color     : #5d83a7
+    --splitter-background-color : #f2f2f2;
+    --splitter-border           : 1px solid #ddd;
+    --splitter-border-radius    : 0;
+    --splitter-hover-color      : #5d83a7;
+    --splitter-margin-horizontal: 0;
+    --splitter-margin-vertical  : 0;
 }
diff --git a/resources/scss/theme-neo-light/component/Splitter.scss b/resources/scss/theme-neo-light/component/Splitter.scss
index 8dbe8aad8..99fd86245 100644
--- a/resources/scss/theme-neo-light/component/Splitter.scss
+++ b/resources/scss/theme-neo-light/component/Splitter.scss
@@ -1,22 +1,8 @@
 :root .neo-theme-neo-light { // .neo-splitter
-    --splitter-background-color: #f2f2f2;
-    --splitter-border          : 1px solid #ddd;
-    --splitter-hover-color     : #5d83a7;
-
-    .neo-splitter {
-        opacity: 1;
-        margin: 8px 2px;
-        border-radius: 100px;
-        border: unset !important;
-
-        &:hover, &:active {
-            background-color: #5595F5 !important;
-        }
-    }
-
-    .neo-dragproxy {
-        &.neo-splitter {
-            background-color: #5595F5 !important;
-        }
-    }
+    --splitter-background-color : #f2f2f2;
+    --splitter-border           : none;
+    --splitter-border-radius    : 5px;
+    --splitter-hover-color      : #5595F5;
+    --splitter-margin-horizontal: 2px 8px;
+    --splitter-margin-vertical  : 8px 2px;
 }
diff --git a/src/draggable/DragZone.mjs b/src/draggable/DragZone.mjs
index ed2846385..67aeb9e58 100644
--- a/src/draggable/DragZone.mjs
+++ b/src/draggable/DragZone.mjs
@@ -305,16 +305,17 @@ class DragZone extends Base {
      * @param {Object} data
      */
     dragStart(data) {
-        let me      = this,
-            {owner} = me,
-            {cls}   = owner,
-            rect    = me.getDragElementRect(data),
+        let me                         = this,
+            {appName, owner, windowId} = me,
+            {cls}                      = owner,
+            rect                       = me.getDragElementRect(data),
             offsetX, offsetY;
 
         me.setData();
 
         Neo.main.addon.DragDrop.setConfigs({
-            appName: me.appName,
+            appName,
+            windowId,
             ...me.getMainThreadConfigs()
         });