From a74eb2989c3ddc91fc1b1252e12c256d3121efd2 Mon Sep 17 00:00:00 2001
From: pathmapper <pathmapper@posteo.de>
Date: Fri, 2 Nov 2018 14:25:31 +0100
Subject: [PATCH] Add helper class and style the helper

---
 src/components/layers/LayerList.jsx | 7 ++++---
 src/styles/_layer.scss              | 7 +++++++
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/components/layers/LayerList.jsx b/src/components/layers/LayerList.jsx
index 9f62856..0b3af80 100644
--- a/src/components/layers/LayerList.jsx
+++ b/src/components/layers/LayerList.jsx
@@ -46,7 +46,7 @@ class LayerListContainer extends React.Component {
     areAllGroupsExpanded: false,
     isOpen: {
       add: false,
-    } 
+    }
   }
 
   toggleModal(modalName) {
@@ -66,12 +66,12 @@ class LayerListContainer extends React.Component {
     this.groupedLayers().forEach(layers => {
       const groupPrefix = layerPrefix(layers[0].id)
       const lookupKey = [groupPrefix, idx].join('-')
-      
+
 
       if (layers.length > 1) {
         newGroups[lookupKey] = this.state.areAllGroupsExpanded
       }
-      
+
       layers.forEach((layer) => {
         idx += 1
       })
@@ -204,6 +204,7 @@ export default class LayerList extends React.Component {
   render() {
     return <LayerListContainerSortable
       {...this.props}
+      helperClass='sortableHelper'
       onSortEnd={this.props.onMoveLayer.bind(this)}
       useDragHandle={true}
     />
diff --git a/src/styles/_layer.scss b/src/styles/_layer.scss
index 920547d..7cbd0f5 100644
--- a/src/styles/_layer.scss
+++ b/src/styles/_layer.scss
@@ -234,3 +234,10 @@
     min-width: 28px;
   }
 }
+
+// Clone of the element which is sorted
+.sortableHelper {
+  font-family: $font-family;
+  z-index: 9999;
+  border: none;
+}