search

sgobotta / aplicativos-libres-client

MIT License
0 stars 1 forks source link

Fix Leaflet marker assets path #85

Open sgobotta opened 6 years ago

sgobotta commented 6 years ago

Webpack is used to compile the dev and prod environment. For some reason the marker asset is not assigned properly:

<img src="http://localhost:3000/2273e3d8ad9264b7daa5bdbf8e6b47f8.png&quot;)marker-icon.png" class="leaflet-marker-icon leaflet-zoom-animated leaflet-interactive" style="margin-left: -12px; margin-top: -41px; width: 25px; height: 41px; transform: translate3d(600px, 175px, 0px); z-index: 175;" alt="" tabindex="0">

The img source should not have the ")marker-icon.png declaration

sgobotta commented 6 years ago

Current workaround is to override some css rules (since leaflet.css import with webpack attemps to override most of the custom leaflet map css rules) like this:

img.leaflet-marker-icon {
  content: url($media-path + 'maps/marker-icon.png') !important;
}

This is working fine in Chrome

Firefox aproach would be

img.leaflet-marker-icon::after {
  content: url($media-path + 'maps/marker-icon.png') !important;
}