Merge 'origin/feature/new_floating_zoom' into feature/new_editor_toolbar

Fix buttons (change from input to button and use img)

packages/mindplot/test/playground/map-render/css/editor.less

@@ -156,3 +156,34 @@ div#bottom-logo {
 .popover {
     max-width: none;
 }
+
+#zoom-button {
+    height: 100px;
+    width: 50px;
+    border: 0;
+    position: absolute;
+    bottom: 100px;
+    right:10px;
+}
+
+#zoom-plus,
+#zoom-minus {
+    height: 50px;
+    width: 50px;
+    background-repeat: no-repeat;
+    background-size: 40px 40px;
+    background-position: center;
+    cursor: pointer;
+    background-color: lightgray;
+    z-index: 1000;
+}
+
+#zoom-plus {
+    border-radius: 8px 8px 0 0;
+    background-image: url('../images/add-icon.svg')
+}
+
+#zoom-minus {
+    border-radius: 0 0 8px 8px;
+    background-image: url('../images/minus-icon.svg')
+}

packages/mindplot/test/playground/map-render/html/editor.html

@@ -86,10 +86,16 @@
         </div>
         <div id="headerNotifier"></div>
     </div>
-    <div id="bottom-logo">
-    </div>
-
     <div id="mindplot" onselectstart="return false;"></div>
+    <div id="bottom-logo"></div>
+    <div id="zoom-button">
+        <button id="zoom-plus">
+            <img src="images/add-icon.svg" />
+        </button>
+        <button id="zoom-minus">
+            <img src="images/minus-icon.svg" />
+        </button>
+    </div>
 </body>
 
 </html>

packages/mindplot/test/playground/map-render/images/add-icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>

packages/mindplot/test/playground/map-render/images/minus-icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 13H5v-2h14v2z"/></svg>