website

website/assets/map.js

@@ -0,0 +1,28 @@
+const map = new maplibregl.Map({
+  style: 'https://tiles.openfreemap.org/styles/liberty',
+  center: [-0.114, 51.506],
+  zoom: 14.2,
+  bearing: 55.2,
+  pitch: 60,
+  container: 'map',
+  boxZoom: false,
+  doubleClickZoom: false,
+  scrollZoom: false,
+})
+
+let nav = new maplibregl.NavigationControl({ showCompass: false })
+map.addControl(nav, 'top-right')
+
+let scale = new maplibregl.ScaleControl()
+map.addControl(scale)
+
+new maplibregl.Marker().setLngLat([-0.119, 51.507]).addTo(map)
+
+function selectStyle(style) {
+  const styleUrl = 'https://tiles.openfreemap.org/styles/' + style
+  map.setStyle(styleUrl)
+  map.setPitch(0)
+  map.setBearing(0)
+
+  document.getElementById('style-url-code').innerText = styleUrl
+}

website/assets/style.css

@@ -145,6 +145,7 @@ button {
 
 .col-lbl {
   display: block;
+  cursor: pointer;
 }
 
 .col-chk {
@@ -158,6 +159,7 @@ button {
 
 .col-cnt {
   display: none;
+  margin: 1em 0 2em;
 }
 
 .col-chk:checked ~ .col-cnt {