How can I change the green tick color and size on Pickup Available?

Store Design
1

Hey all,

I’ve been tweaking how the Pickup Available bit looks on my website. Ive managed to change fonts and sizes but not sure where I’d need to go to change the green tick that’s before the word “Pickup”. I would like to change it to a more apparent vibrant green colour and be able to make it bigger.

https://scenicskateshop.co.uk/products/fracture-adswarm-2-the-golden-ratio-deck-7-75

Regards,

Jason

2

Hi @JJBDude

I’m Richard Nguyen from PageFly- Free Landing Page Builder

You can try with this code.

Follow this:

Go to Online Store->Theme->Edit code->base.css->paste bellow code in bottom of file

.icon.icon-tick {

height: 3rem !important;

}

path {

fill: #15b01d;

}

Hope that my solution works for you.

Best regards,

Richard | PageFly

3

Hello Richard,

When I added this code it also changed the colour of every other icon on the site. Is there anyway it can be done just for the tick? Thanks

Jason

4

@JJBDude

You can try again with this code:

.icon.icon-tick path {
fill: #2be31a;

}

5

Looks like that did change the colour pop the tick but it has an outline that’s white. I’d like to get rid of that too so it’s just a clear tick if possible.

Edit: - Or be able to make the outline black and maybe fiddle with how thick it is?

6

HI @JJBDude

you can try this:

.icon.icon-tick path {
fill: #2be31a;
stroke: none;
}

1 Like
7

That will do. Thanks Richard!