search

brunob / leaflet.fullscreen

Leaflet.Control.FullScreen for Leaflet
https://brunob.github.io/leaflet.fullscreen/
MIT License
376 stars 107 forks source link

Icon is not visible in stencil #128

Closed EugenTK10 closed 2 months ago

EugenTK10 commented 2 months ago

Hello,

On my leaflet map, the button is showing up but the actual icon is not. I am using stencil.js and leaflet.js. These are the relevant used version and packages: "@stencil/core": "^4.7.0", "@types/leaflet": "^1.9.12", "@typesleaflet.fullscreen/": "^3.0.2", "leaflet.fullscreen": "^3.0.2"

I import it as: import "leaflet.fullscreen"; and use it as map1 = L.map(container, { fullscreenControl: true, fullscreenControlOptions: { position: "topleft", forceSeparateButton: true, }, What should I do to make the icon appear?

brunob commented 2 months ago

We can't help you without any url showing the problem online. Inspect your page with dev tools to see if a personal CSS is overriding the fullscreen icon styles.

EugenTK10 commented 2 months ago

I needed to make the svg icon visible for stencil in the www folder, which required overridding the css with something like

.fullscreen-icon { background-image: url('build/icon-fullscreen.svg'); }

and it worked