Add position marker and hide map element before loading

Smile-SA · Apr 29, 2024 · f81f847 · f81f847
1 parent ce6c4c6
commit f81f847
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 4 deletions.
diff --git a/view/frontend/web/css/source/_module.less b/view/frontend/web/css/source/_module.less
@@ -24,6 +24,8 @@
     }
 
     .catalog-product-stores-availability-content {
+        display: none;
+
         .fulltext-search-wrapper {
             .form {
                 display: flex;
@@ -44,10 +46,8 @@
 
         .store-view-map .map {
             max-width: 100%;
-            height: 400px;
-            background: #666;
+            height: 0;
             z-index: 1;
-            float: left;
             display: inline-block;
             margin-bottom: 20px;
             width: 100%;
@@ -60,7 +60,6 @@
             margin: 10px 0 0;
             padding: 0;
             max-height: 215px;
-            min-height: 215px;
             overflow-y: scroll;
 
             li.result-item {
@@ -115,6 +114,16 @@
     .catalog-product-retailer-availability .showavailability {
         cursor: pointer;
     }
+
+    .modal-popup {
+        .catalog-product-stores-availability-content {
+            display: block;
+        }
+
+        .store-view-map .map {
+            height: 400px;
+        }
+    }
 }
 
 //

diff --git a/view/frontend/web/js/retailer/product-availability.js b/view/frontend/web/js/retailer/product-availability.js
@@ -157,6 +157,7 @@ define([
                 registry.get(this.name + '.map', function (map) {
                     this.map = map;
                     this.map.applyPosition(position);
+                    this.map.addMarkerWithMyPosition(position)
                 }.bind(this));
 
                 this.updateDisplayedOffers();