Fix map pages: force footer to bottom and tidy pedigree map & place hierarchy layouts (#4799)

* Fixes #4789, for all user map pages. It is necessary to give the map and sidebar elements a defined height so that on small devices where the elements are stacked, the footer is pushed below them

* Change inline style to bootstrap class

1 files changed, 2 insertions, 2 deletions

diff --git a/resources/views/modules/pedigree-map/chart.phtml b/resources/views/modules/pedigree-map/chart.phtml
index 2c9b65d60e..85f9d89d6f 100644
--- a/resources/views/modules/pedigree-map/chart.phtml
+++ b/resources/views/modules/pedigree-map/chart.phtml
@@ -13,7 +13,7 @@ use Fisharebest\Webtrees\View;
 
 <div class="row my-4 gchart wt-pedigree-map-wrapper wt-fullscreen-container">
     <div id="wt-map" class="col-sm-9 wt-ajax-load wt-map wt-pedigree-map-map" dir="ltr"></div>
-    <ul class="col-sm-3 wt-pedigree-map-sidebar wt-page-options-value list-unstyled px-1"></ul>
+    <ul class="col-sm-3 wt-pedigree-map-sidebar wt-page-options-value list-unstyled px-1 mb-0"></ul>
 </div>
 
 <?php View::push('javascript') ?>
@@ -97,7 +97,7 @@ use Fisharebest\Webtrees\View;
             }
 
             layer.bindPopup(feature.properties.summary);
-            sidebar.innerHTML += `<li class="gchart my-1" data-wt-feature-id=${feature.id}>${feature.properties.summary}</li>`;
+            sidebar.innerHTML += `<li class="gchart p-1 mb-1" data-wt-feature-id=${feature.id}>${feature.properties.summary}</li>`;
           },
         });
         markers.addLayer(geoJsonLayer);