Merge pull request #4133 from AntonKhorev/flex-leaflet-controls

Use multiple columns for map controls if they don't fit vertically

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index 3eedfdbae3d21fed1dcc65986a86e9f6e03ae28b..2386fed824850ef3c5a457c0751a1cd609c9a7f9 100644 (file)
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -351,6 +351,15 @@ body.small-nav {
 
 /* Rules for Leaflet maps */
 
+.leaflet-top.leaflet-right,
+.leaflet-top.leaflet-left {
+  height: 100%;
+  column-gap: 10px;
+  display: flex;
+  flex-direction: column;
+  flex-wrap: wrap-reverse;
+}
+
 .leaflet-control .control-button {
   display: block;
   height: 40px;