Fix elements overflowing on map modal

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

js/src/views/Event/Event.vue

@@ -328,21 +328,6 @@
                       >{{ $t("Show map") }}</span
                     >
                   </div>
-                  <b-modal
-                    v-if="physicalAddress && physicalAddress.geom"
-                    :active.sync="showMap"
-                    scroll="keep"
-                  >
-                    <div class="map">
-                      <map-leaflet
-                        :coords="physicalAddress.geom"
-                        :marker="{
-                          text: physicalAddress.fullName,
-                          icon: physicalAddress.poiInfos.poiIcon.icon,
-                        }"
-                      />
-                    </div>
-                  </b-modal>
                 </div>
               </event-metadata-block>
               <event-metadata-block :title="$t('Date and time')" icon="calendar">
@@ -504,6 +489,17 @@
             </section>
           </div>
         </b-modal>
+        <b-modal v-if="physicalAddress && physicalAddress.geom" :active.sync="showMap">
+          <div class="map">
+            <map-leaflet
+              :coords="physicalAddress.geom"
+              :marker="{
+                text: physicalAddress.fullName,
+                icon: physicalAddress.poiInfos.poiIcon.icon,
+              }"
+            />
+          </div>
+        </b-modal>
       </div>
     </transition>
   </div>
@@ -1174,12 +1170,6 @@ div.sidebar {
           }
         }
       }
-
-      div.map {
-        height: 900px;
-        width: 100%;
-        padding: 25px 5px 0;
-      }
     }
 
     span.online-address {
@@ -1270,4 +1260,10 @@ a.participations-link {
 .event-status .tag {
   font-size: 1rem;
 }
+
+div.map {
+  height: 900px;
+  width: 100%;
+  padding: 25px 5px 0;
+}
 </style>