Cómo personalizo el diseño en el componente LPopup de leafletjs. Siguiendo esta guía de:
https://vue2-leaflet.netlify.app/components/LPopup.html#demo
Inspeccioné el Lpopup en el devtool, y luego tomé la llamada del selector 'leaflet-popup-content-wrapper' y luego le agregué un poco de estilo Css (vea la imagen a continuación) pero no da el border-radius: 0px. se muestra dentro de esa ventana emergente. que no quiero.
<l-popup class="map-popup"> <h1>{{ name.toLocaleUpperCase().substring(0, 2) }}</h1> <h3>{{ address }}</h3> </l-popup>
y mi CSS:
.map-popup, .leaflet-popup-content-wrapper { background: #2c3e50; color: #fff; font-size: 16px; line-height: 24px; border-radius: 0px; }
// also tried this way, but nothing seems to work for me: .leaflet-popup-content-wrapper { background: #2c3e50; color: #fff; font-size: 16px; line-height: 24px; border-radius: 0px; }
Quiero tener el aspecto de abajo sin 'border-radius'. ¿Cómo puedo lograr eso? Cualquier ayuda de usted es muy apreciada. ¡Gracias de antemano!