From 9808d44c7107c47f418d04462e6c21ee06b7b159 Mon Sep 17 00:00:00 2001
From: orangemug <info@orangemug.co.uk>
Date: Fri, 13 Apr 2018 17:00:51 +0100
Subject: [PATCH] Fix to allow layers sections to expand smoothly. Fixes #244

---
 src/components/layers/LayerEditorGroup.jsx | 4 +++-
 src/styles/_react-collapse.scss            | 5 +++++
 src/styles/index.scss                      | 1 +
 3 files changed, 9 insertions(+), 1 deletion(-)
 create mode 100644 src/styles/_react-collapse.scss

diff --git a/src/components/layers/LayerEditorGroup.jsx b/src/components/layers/LayerEditorGroup.jsx
index 7c82fc1c..0a803e05 100644
--- a/src/components/layers/LayerEditorGroup.jsx
+++ b/src/components/layers/LayerEditorGroup.jsx
@@ -21,7 +21,9 @@ export default class LayerEditorGroup extends React.Component {
         <Collapser isCollapsed={this.props.isActive} />
       </div>
       <Collapse isOpened={this.props.isActive}>
-        {this.props.children}
+        <div className="react-collapse-container">
+          {this.props.children}
+        </div>
       </Collapse>
     </div>
   }
diff --git a/src/styles/_react-collapse.scss b/src/styles/_react-collapse.scss
new file mode 100644
index 00000000..a58dddeb
--- /dev/null
+++ b/src/styles/_react-collapse.scss
@@ -0,0 +1,5 @@
+// See <https://github.com/nkbt/react-collapse/commit/4f4fbce7c6c07b082dc62062338c9294c656f9df>
+.react-collapse-container {
+  position: relative;
+  overflow: hidden;
+}
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 1472bf67..64f4be9b 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -36,3 +36,4 @@ $toolbar-offset: 0;
 @import 'zoomproperty';
 @import 'popup';
 @import 'map';
+@import 'react-collapse';