MOTION THEME - Change navigation icon color

[Winnne0195]

Hello,

I would like to change the color of the navigation icons. Right now the navigation has a white background and black text/icons. When a category is collapsed a black plus icon is visible, but when expanding you should see a black minus but I think it is white, because it dissappears. This problem might have been started when the footer background was changed to black and the text/icons are white. So the nav background is white, the text is black and icons should stay black. The footer background is black and text and icons should stay white. All on mobile view.

Store link: https://groupedamis.com

 

 

[Made4uo-Ribe · Accepted solution]

Hi @Winnne0195 

Do you still knows where you place the code in the footer? 

Try to replace on this code. 

.site-footer .collapsible-trigger.is-open .collapsible-trigger__icon .icon-minus path {
    fill: white !important;
}

And Save. 

It needs to be called in the footer area only not on the drawer. 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

[Made4uo-Ribe · Accepted solution]

Hi @Winnne0195 

Do you still knows where you place the code in the footer? 

Try to replace on this code. 

.site-footer .collapsible-trigger.is-open .collapsible-trigger__icon .icon-minus path {
    fill: white !important;
}

And Save. 

It needs to be called in the footer area only not on the drawer. 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

[Winnne0195]

Thank you @Made4uo-Ribe , it worked! 

There is one last thing, when expanding a category, the minus icon is like moving downwards. It should be in the same position as the plus icon. Now the minus icon is a little lower. This problem occurs in the navigation, footer and product page tabs. Hope you can help me out with this one too. Thanks in advance!

[Made4uo-Ribe · Accepted solution]

Seems like you add some padding on the top but it was too much.

Check this code. If it solve the level. 

.icon-minus {
    padding-top: 5px;
}

You can find this code to the file where you place the previous one the original padding-top size is 10px just change into 5px or add this code. 

Let me know if it wont work. 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

[Winnne0195]

Thank you, it worked!