Help with Boundless theme index page icon colors (hamburger, search and cart)

New Member
3 0 0

Hi all!

I'm just about to launch the store that I have been working on for the last few months, and I was wondering if anyone knows how to change the color of the icons on the index page.

The theme is boundless. At the moment the hamburger, search and cart icons are white, and my hero images are predominantly light, so I'd like the icons to be black if possible.

They are black versions in use on other pages on the store, like the product product pages, so I'm hoping it's possible to set on the main page. I've been looking around the CSS and liquid files and haven't got anywhere, so any help gratefully received! 

Mark

 

0 Likes
Tourist
18 0 2

Those icons are webfont icons, which means you can just change the color css variable for each icon, for example:

.icon-hamburger:before {
   content: "\e601";
   color: black;
}

 

Created ProCodes: Custom Shortcodes for Shopify. Custom themer. Founder of mintdesigncompany.com
1 Like
New Member
3 0 0

Wow, 20 minutes and problem solved.

Japhia, thank you!

Mark

0 Likes
New Member
2 0 0

Many thanks for the solution :)

For other novices like me: check theme.scss.liquid from row 905 for icons.

M

0 Likes
New Member
2 0 0

Ok, well for us regular coding-challenged people.   How do I do this?   ;)

0 Likes
New Member
1 0 0

@co1 click on Actions, edit code and then go to the theme.scss.liquid file and search for .icon-hamburger and it will show all the one's you need...then just add the color: black; part to the end of the line of code.

 

0 Likes