Don't show older/newer buttons if all items fit on one page

[rails.git] / app / assets / javascripts / leaflet.layers.js

diff --git a/app/assets/javascripts/leaflet.layers.js b/app/assets/javascripts/leaflet.layers.js
index b78ac6e0742b76830b9e6ef6f3e2e72196b57150..82efab506c80f4d7dbd27f465f04928d383664f9 100644 (file)
--- a/app/assets/javascripts/leaflet.layers.js
+++ b/app/assets/javascripts/leaflet.layers.js
@@ -5,7 +5,7 @@ L.OSM.layers = function (options) {
     var layers = options.layers;
 
     var baseSection = $("<div>")
     var layers = options.layers;
 
     var baseSection = $("<div>")

-      .attr("class", "section base-layers d-grid gap-3")
+      .attr("class", "base-layers d-grid gap-3 p-3 border-bottom border-secondary-subtle")

       .appendTo($ui);
 
     layers.forEach(function (layer, i) {
       .appendTo($ui);
 
     layers.forEach(function (layer, i) {


@@ -22,7 +22,7 @@ L.OSM.layers = function (options) {
         .prop("checked", map.hasLayer(layer))
         .appendTo(buttonContainer);
 
         .prop("checked", map.hasLayer(layer))
         .appendTo(buttonContainer);
 

-      var item = $("<label class='btn btn-outline-primary border-4 rounded-3 bg-transparent position-absolute top-0 start-0 bottom-0 end-0 m-n1 overflow-hidden'>")
+      var item = $("<label class='btn btn-outline-primary border-4 rounded-3 bg-transparent position-absolute p-0 h-100 w-100 overflow-hidden'>")

         .prop("for", id)
         .append($("<span class='badge position-absolute top-0 start-0 rounded-top-0 rounded-start-0 py-1 px-2 bg-body bg-opacity-75 text-body text-wrap text-start fs-6 lh-base'>").append(layer.options.name))
         .appendTo(buttonContainer);
         .prop("for", id)
         .append($("<span class='badge position-absolute top-0 start-0 rounded-top-0 rounded-start-0 py-1 px-2 bg-body bg-opacity-75 text-body text-wrap text-start fs-6 lh-base'>").append(layer.options.name))
         .appendTo(buttonContainer);


@@ -79,12 +79,12 @@ L.OSM.layers = function (options) {
 
     if (OSM.STATUS !== "api_offline" && OSM.STATUS !== "database_offline") {
       var overlaySection = $("<div>")
 
     if (OSM.STATUS !== "api_offline" && OSM.STATUS !== "database_offline") {
       var overlaySection = $("<div>")

-        .attr("class", "section overlay-layers")
+        .attr("class", "overlay-layers p-3")

         .appendTo($ui);
 
       $("<p>")
         .text(I18n.t("javascripts.map.layers.overlays"))
         .appendTo($ui);
 
       $("<p>")
         .text(I18n.t("javascripts.map.layers.overlays"))

-        .attr("class", "text-muted")
+        .attr("class", "text-body-secondary small mb-2")

         .appendTo(overlaySection);
 
       var overlays = $("<ul class='list-unstyled form-check'>")
         .appendTo(overlaySection);
 
       var overlays = $("<ul class='list-unstyled form-check'>")