Active Pin Marker Color

[MelvinNeo]

• Issue description: How do I change the pin marker color when a location is selected? The current one is dark red, and I want to change it beige when the location is selected.

• I tried the solution suggested here, but the logo is totally covered by the new color.

• Link to the page with the widget in question: https://73e495879a3241a1867d1ffcafcdedc0.elf.site

[Max]

Hi there and welcome aboard, @MelvinNeo

This CSS code should help you:

.active [class*="marker__Container-sc"] [class*='marker__MarkerBody-sc'] path {
  fill: beige !important;
}

Please try it out and let me know how it worked

[MelvinNeo]

Yes, it works!

Thanks, Max.

[Max]

Awesome, you’re welcome!

In the meantime, we’d like to invite you to participate in our new contest, where you can win a 6-month extension for your subscription - May Contest: Create a Caption for Our Photo and Win 6 Months FREE!

Check the details and join in

[MelvinNeo]

Hi Max,

Since we’re at it, how do I increase the size of the marker icon without considerably increasing the size of the marker?

[Max]

Hi @MelvinNeo

Sure, here is the code

[class*='marker__Icon-sc'] svg {
  height: 30px;
  width: 30px;
}

[MelvinNeo]

Hi, @Max

That works! Thanks.

[Max]

Awesome, you’re welcome