Use standard padding size for map-ui sidebar

The previous padding didn't match the main sidebar, and also used
sass division as part of the calculation.

diff --git a/app/assets/javascripts/leaflet.layers.js b/app/assets/javascripts/leaflet.layers.js
index 1aa3824b05c68897fbcb88d5c784e215a551d717..27311f7c1441c3d22acde08cbcc526702b0e7e4e 100644 (file)
--- a/app/assets/javascripts/leaflet.layers.js
+++ b/app/assets/javascripts/leaflet.layers.js
@@ -8,7 +8,7 @@ L.OSM.layers = function (options) {
       .attr("class", "section base-layers")
       .appendTo($ui);
 
-    var baseLayers = $("<ul class='list-unstyled'>")
+    var baseLayers = $("<ul class='list-unstyled mb-0'>")
       .appendTo(baseSection);
 
     layers.forEach(function (layer) {

diff --git a/app/assets/javascripts/leaflet.sidebar-pane.js b/app/assets/javascripts/leaflet.sidebar-pane.js
index d8213a3767a948aee2c0a9cdadc5498cbf1d4208..5e5006fb0c0269bfb6d60ec164099d61855ed08d 100644 (file)
--- a/app/assets/javascripts/leaflet.sidebar-pane.js
+++ b/app/assets/javascripts/leaflet.sidebar-pane.js
@@ -20,7 +20,7 @@ L.OSM.sidebarPane = function (options, uiClass, buttonTitle, paneTitle) {
     var $ui = $("<div>")
       .attr("class", uiClass + "-ui");
 
-    $("<div class='sidebar_heading d-flex'>")
+    $("<div class='d-flex p-3 pb-0'>")
       .appendTo($ui)
       .append($("<h4 class='flex-grow-1 text-break'>")
         .text(I18n.t(paneTitle)))

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index 5fcbd83ab5e081d23271080659e7468a12dc4914..2dabe8939e0ef8c521f7c9af4af2ab0cd72f84f4 100644 (file)
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -486,7 +486,7 @@ body.small-nav {
 
     .section {
       border-bottom: 1px solid $grey;
-      padding: 10px 20px;
+      padding: $spacer;
     }
   }
 }
@@ -606,13 +606,6 @@ body.small-nav {
 
 /* Rules for the sidebar */
 
-.sidebar_heading {
-  position: relative;
-  padding: $lineheight/2 $lineheight;
-  // background: $offwhite;
-  // border-bottom: 1px solid $grey;
-}
-
 #browse_status {
   input {
     display: block;

diff --git a/app/views/site/key.html.erb b/app/views/site/key.html.erb
index 370ae3b645b3ee68e069f365a225f8ef302892cc..949121d96f2f64aae1b325d473bbde2f59baa6db 100644 (file)
--- a/app/views/site/key.html.erb
+++ b/app/views/site/key.html.erb
@@ -1,5 +1,5 @@
 <div id="mapkey">
-  <table class="table table-sm table-borderless mapkey-table">
+  <table class="table table-sm table-borderless mapkey-table mb-0">
     <% YAML.load_file(Rails.root.join("config/key.yml")).each do |name,data| %>
       <% data.each do |entry| %>
         <tr class="mapkey-table-entry" data-layer="<%= name %>" data-zoom-min="<%= entry["min_zoom"] %>" data-zoom-max="<%= entry["max_zoom"] %>">