Change Mobile navigation color for Symmetry theme

[Lars_Veldman]

Hi All, 

In the Symmetry theme, I would like to change the color of the mobile navigation text in the navigation drawer. By default, the text is black, but I want to make the "Sale" header red using custom CSS. I was able to achieve this for the desktop view, but I'm having trouble getting it to work for the mobile view. How can I adjust the CSS to specifically target the "Sale" link in the mobile navigation?

[Made4uo-Ribe]

Hi @Lars_Veldman 

Would you mind sharing your store URL? Thanks!

[Lars_Veldman]

Hi,

The url is: refined-melbourne.com

[Made4uo-Ribe · Accepted solution]

Thanks for the info, check this one. 

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

.navigation__item a[href="/collections/spring-sale"] {
    color: red;
}

And Save. 

Result:

You also have some code, but it needs to be edit. If you know where this code is, you can simply edit it. This file is located in the theme.liquid.

You have this code. 

Now you can replace on this or edit it. 

.navigation__link[href="/collections/spring-sale"] {
    color: red;
}

And Save. 

This will show both mobile and dekstop. 

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