Change color in main menu

Solved
Highlighted
New Member
6 0 0

I have different links in my main menu at the home page of my website.

Now I want the "contact us" button to be a different color than the rest.

How do I do this?

I can't seem to find any solutions.

 

Bart

0 Likes
Highlighted
Trailblazer
263 68 74

Hi @BartRauhe 

Thanks Welcome to the Shopify community!
Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
-Want to modify or custom changes on store Hire me.
- Feel free to contact me on vikaschovatiya02@gmail.com regarding any help
If you are happy and want to donate small Click here (Its my paypal)
0 Likes
Highlighted
New Member
6 0 0

https://wall-flair.myshopify.com/

 

I dont know if you need the password but its test12345

0 Likes
Highlighted
Tourist
303 44 67

Hello @BartRauhe Please add this css at the end of theme.scss

.site-nav li .site-nav__link:last-child {
background-color: #ffffff;
color: #000000;
}

 

if this solution works, then please click on accepted solution and please like 

If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Highlighted
New Member
6 0 0

I added that but then all the links got a white square behind them, but the ones with the dropdown menu.

I only want the "contact us" to be dark green

 

Cheers

0 Likes
Highlighted
Tourist
303 44 67

Sorry for that, Please place this code

 

 

.site-nav>li:last-child>a {
    background-color: #4a9351;
    color: #ffffff;
}

 

 

if this solution works, then please click on accepted solution and please like 

 

If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Highlighted
New Member
6 0 0

Screenshot_2020-08-30 Wall Flair.png

 It shows this now, I like the color green but i dont want it to be a green square but the black text to be green

 

thank you for trying to help me

0 Likes
Highlighted
Tourist
303 44 67

This is an accepted solution.

Then change the given code to this

 

.site-nav>li:last-child>a {
    color: #4a9351;  /* color changed */
}
If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Highlighted
New Member
6 0 0

That worked thank you very much

0 Likes