How to change hover color and Instagram icon in Narrative Theme?

Technical Q&A
1

Hi,

I’m using Narrative Theme and would like to change the hover colour in the main menu drop down to 91F7B3.

I’d also like to change the Instagram icon in the same menu to f5985b.

Any help would be much appreciated.

Thanks!

2

Hi Mungo, happy to take a look. Do you have a link to your website?

3

@Mungo_1 Can you please send me store url?

4

Hi @Mungo_1 ,

Please send your site and if your site is password protected, please send me the password. I will check it.

5

https://www.mungomungo.com.au/

6

Thanks @Mungo_1 , what is the password for your site?

7

liasti

8

If you insert the code below into your theme’s CSS file, it should change your hover link color to the color you’re after, as well as your Instagram logo. If you’re inserting into a direct CSS file, you won’t need the tags. Otherwise, insert this code into your theme.liquid file within the tags as close to the tag as possible towards the bottom.

Screenshot 2022-08-15 020811.png
Screenshot 2022-08-15 020811.png426×619 8.54 KB

9

Hi @Mungo_1 ,

Go to Assets > theme.scss.liquid and paste this at the bottom of the file:

.navigation__link>a:hover {
	color: #91F7B3 !important;
}
.navigation__link>a:after {
	background-color: #91F7B3 !important;
}
.navigation__social-sharing svg {
	fill: #f5985b !important;
}

Hope it helps!