change leaflet-draw button order for mobile display on feature_edit

src/views/feature/Feature_edit.vue

@@ -181,11 +181,6 @@
           />
           <div class="ui tab active map-container" data-tab="map">
             <div id="map" ref="map"></div>
-            <!-- // todo: ajouter v-if -->
-            <!-- {% if serialized_base_maps|length > 0 %} {% include
-            "geocontrib/map-layers/sidebar-layers.html" with
-            basemaps=serialized_base_maps layers=serialized_layers
-            project=project.slug%} {% endif %} -->
             <SidebarLayers v-if="basemaps && map" />
           </div>
         </div>
@@ -850,7 +845,10 @@ export default {
 
       if (this.currentRouteName === "editer-signalement") {
         this.map.addControl(this.drawControlEditOnly);
-      } else this.map.addControl(this.drawControlFull);
+      } else {
+        this.map.addControl(this.drawControlFull);
+      }
+      this.changeMobileBtnOrder();
 
       this.map.on(
         "draw:created",
@@ -984,6 +982,24 @@ export default {
       }
     },
 
+    changeMobileBtnOrder() { //* move large toolbar for polygon creation, cutting map in the middle
+      function changeDisplay() {
+        let buttons = document.querySelector(".leaflet-draw-actions.leaflet-draw-actions-top.leaflet-draw-actions-bottom")
+        if (buttons && buttons.style) {
+          buttons.style.display = "flex"
+          buttons.style["flex-direction"] = "column"
+        }
+      }
+      if (window.screen.availWidth < 767) { //* change button order all the time to keep homogeinity on mobile
+        let wrapper = document.querySelector(".leaflet-top.leaflet-right");
+        if (wrapper) wrapper.appendChild(wrapper.children[0]);
+        if (this.feature_type.geom_type === "polygon") { //* if it's a polygon, change tools direction to vertical
+          let polygonBtn = document.querySelector(".leaflet-draw-draw-polygon"); //* since elements are generated
+          if (polygonBtn) polygonBtn.addEventListener("click", changeDisplay) //* it should be done at each click
+        }
+      }
+    },
+
     getFeatureAttachments() {
       featureAPI
         .getFeatureAttachments(this.$route.params.slug_signal)