[openstreetmap/openstreetmap-website] Migrate the dashboard entry page from leaflet to maplibre (PR #6504)

[Frank Elsinga]

@CommanderStorm commented on this pull request.



> +.maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon {
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='%23ffffff' viewBox='0 0 20 20'%3E%3Cpath d='M16 8H12V4L11 3H10L9 4V8H5L4 9v1l1 1H9v4l1 1h1l1-1V11h4l1-1V9z'/%3E%3C/svg%3E") !important;
+}
+.maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon {
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='%23ffffff' viewBox='0 0 20 20'%3E%3Cpath d='M4 9v1l1 1H16l1-1V9L16 8H5Z'/%3E%3C/svg%3E") !important;
+}
+.maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon {
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='%23ffffff' viewBox='0 0 20 20'%3E%3Cpath d='M10 10v6h2L16 6V4H14L4 8v2Z'/%3E%3C/svg%3E") !important;
+}
+.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active .maplibregl-ctrl-icon {
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='%2376c551' viewBox='0 0 20 20'%3E%3Cpath d='M10 10v6h2L16 6V4H14L4 8v2Z'/%3E%3C/svg%3E") !important;
+}

Not sure which alternative you are suggesting.

I tried to do the following, but the ruby part does not seem to allow this, at least the `inline-image` does not seem to do anything.

```css
   background-image: inline-image('app/assets/images/map-controls/zoomin.svg') !important;
```

https://stackoverflow.com/questions/33299453/inline-svg-from-a-file-with-sass/33302941#33302941

How do I enable this functionality in the asset pipeline?

As I said previusly, I know JS but ruby is not taught in school, so I would need help with the magic there.

I ruled out https://github.com/zemax/node-sass-svg as it does not seem very active.

-- 
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/pull/6504#discussion_r2499170817
You are receiving this because you are subscribed to this thread.

Message ID: <openstreetmap/openstreetmap-website/pull/6504/review/3428462514 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20251106/79a36429/attachment-0001.htm>