Update Mapbox-GL to v1.13.0

package.json

@@ -53,7 +53,7 @@
     "jest": "^25.2.0",
     "jest-extended": "^0.11.2",
     "json-loader": "0.5.7",
-    "mapbox-gl": "^1.11.1",
+    "mapbox-gl": "^1.13.0",
     "mapbox-gl-js-mock": "https://github.com/QwantResearch/mapbox-gl-js-mock.git#7eaee7b",
     "node-sass": "^4.14.1",
     "postcss-import": "12.0.0",

src/scss/includes/app.scss

@@ -49,15 +49,6 @@ noscript {
     height: 100%;
     max-height: none;
   }
-
-  .map_container .map_control__scale_attribute_container {
-    .mapboxgl-ctrl.map_control__scale {
-      position: fixed;
-      left: 32px;
-      bottom: 8px;
-      margin: 0;
-    }
-  }
 }
 
 .map_container .marker-container {

src/scss/includes/map_theme.scss

@@ -1,3 +1,8 @@
+.mapboxgl-ctrl-top-left,
+.mapboxgl-ctrl-top-right,
+.mapboxgl-ctrl-bottom-left,
+.mapboxgl-ctrl-bottom-right  { position:absolute; pointer-events:none; }
+
 .map_control_group {
   margin: 0 10px 5px 0;
   float: right;
@@ -104,8 +109,34 @@
 }
 
 @media(max-width: 640px) {
-  .map_control__scale_attribute_container{
-    .mapboxgl-ctrl.mapboxgl-ctrl-attrib, .mapboxgl-ctrl.map_control__scale {
+  .map_control__scale_attribute_container {
+    .mapboxgl-ctrl-attrib {
+      position: fixed;
+      bottom: 2px;
+      left: 4px;
+
+      .mapboxgl-ctrl-attrib-button {
+        top: auto;
+        right: auto;
+        bottom: 0;
+        left: 0;
+      }
+
+      &.mapboxgl-compact-show {
+        background: rgba(255, 255, 255, 0.9);
+        padding: 2px 8px 2px 28px;
+
+        .mapboxgl-ctrl-attrib-button {
+          background-color: transparent;
+        }
+      }
+    }
+
+    .map_control__scale {
+      position: fixed;
+      left: 32px;
+      bottom: 4px;
+      margin: 0;
       background: rgba(255, 255, 255, 0.9);
     }
   }
@@ -145,10 +176,6 @@
     }
   }
 
-  .map_control__scale_attribute_container {
-    background: none;
-  }
-
   .map_control_group {
     .map_control_group__button__zoom {
       display: none;
@@ -184,25 +211,6 @@
   .mapboxgl-ctrl-bottom-right .mapboxgl-ctrl, .mapboxgl-ctrl.mapboxgl-ctrl-attrib {
     float: inherit;
   }
-
-  .mapboxgl-ctrl-attrib.mapboxgl-compact{
-    margin: 0;
-    padding: 0;
-    border-radius: 12px;
-
-    &::after {
-      position: absolute;
-      bottom: 0;
-      left: 0;
-      display: inline-block;
-      vertical-align: middle;
-    }
-
-    &:hover {
-      padding: 2px 4px 2px 24px;
-    }
-  }
-
 }
 
 .compass-origin {

src/scss/main.scss

@@ -9,7 +9,6 @@ $font_system: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetic
 @import "includes/menu";
 @import "includes/reset";
 @import "./../../node_modules/mapbox-gl/dist/mapbox-gl.css";
-@import "includes/mapbox-gl-override.scss";
 @import "includes/popup";
 
 @import "includes/app";