Changing Colour of SVG Arrows in Venture Theme on Product Page

[rthwaite]

Hello!

I have a problem with changing the colours of the SVG arrows in the Venture theme, on the product pages.

Currently, the colour is very light, making it hard for customers to change between images easily (see below)

I have found the icon-arrow-up.liquid and icon-arrow-down.liquid snippets - changing the fills to the desired colour does not appear to work (screenshot of code below).

I have also found the slider arrows section of theme.scss.liquid and changed the .icon{ fill to the desired colour #213458, it appears this has worked when the user highlights the arrow, but this doesn't help with discoverability. (screenshot of code below)

Help!

EG: https://yoproessentials.com/products/running-socks-multipacks-x3-x11 

icon-arrow-down.liquid code below

Slider arrows

[Jasoliya · Accepted solution]

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss Or theme.css-> paste bellow code in bottom of file

.product-single__thumbnails.slick-initialized .slick-next .icon, .product-single__thumbnails.slick-initialized .slick-prev .icon{fill:black;}

[Jasoliya · Accepted solution]

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss Or theme.css-> paste bellow code in bottom of file

.product-single__thumbnails.slick-initialized .slick-next .icon, .product-single__thumbnails.slick-initialized .slick-prev .icon{fill:black;}

[Hardik29418 · Accepted solution]

Hello,

Welcome to the shopify Community.

Please Go to Online Store -> Themes -> Edit code -> Assets -> theme.scss.liquid and paste this code at the end of this file.

.icon-arrow-down path, .icon-arrow-down, .icon-arrow-up, .icon-arrow-up path {
fill: #213458 !important;
}

[rthwaite]

Thanks to you both, these methods appear to work