From dd1c9a1d1c5967810014cbb9af412e5dde85bbf0 Mon Sep 17 00:00:00 2001
From: Fedor Katurov <gotham48@gmail.com>
Date: Wed, 22 Jan 2020 15:53:15 +0700
Subject: [PATCH] fixed panels behaviour

---
 src/components/panels/UserPanel.tsx | 30 ++++++++++++++---------------
 src/styles/panel.less               | 13 +++++++++++++
 2 files changed, 27 insertions(+), 16 deletions(-)

diff --git a/src/components/panels/UserPanel.tsx b/src/components/panels/UserPanel.tsx
index 008c075..41b5093 100644
--- a/src/components/panels/UserPanel.tsx
+++ b/src/components/panels/UserPanel.tsx
@@ -166,6 +166,20 @@ export class UserPanelUnconnected extends PureComponent<Props, State> {
             </button>
           </div>
 
+          <React.Fragment>
+            <div className="control-sep" />
+
+            <div className="control-bar">
+              <button
+                className={classnames({ active: false, inactive: is_empty })}
+                onClick={this.props.editorGetGPXTrack}
+              >
+                <Tooltip>Экспорт GPX</Tooltip>
+                <Icon icon="icon-gpx-1" />
+              </button>
+            </div>
+          </React.Fragment>
+
           <div className="control-sep" />
 
           <div className="control-bar">
@@ -174,22 +188,6 @@ export class UserPanelUnconnected extends PureComponent<Props, State> {
               <Icon icon="icon-shot-4" />
             </button>
           </div>
-
-          {!is_empty && (
-            <React.Fragment>
-              <div className="control-sep" />
-
-              <div className="control-bar">
-                <button
-                  className={classnames({ active: false })}
-                  onClick={this.props.editorGetGPXTrack}
-                >
-                  <Tooltip>Экспорт GPX</Tooltip>
-                  <Icon icon="icon-gpx-1" />
-                </button>
-              </div>
-            </React.Fragment>
-          )}
         </div>
       </div>
     );
diff --git a/src/styles/panel.less b/src/styles/panel.less
index e88b8ee..76673a3 100644
--- a/src/styles/panel.less
+++ b/src/styles/panel.less
@@ -42,6 +42,19 @@
   }
 
   &__undo {
+    opacity: 0;
+    transform: translate(50px, 0);
+    pointer-events: none;
+    touch-action: none;
+    transition: transform 0.25s, opacity 0.25s;
+    z-index: -1;
+    
+    &.active {
+      opacity: 1;
+      transform: translate(0, 0);
+      pointer-events: all;
+      touch-action: initial;
+    }
   }
 }