Help stying title hover in header Prestige

NZA
Pathfinder
105 12 32

Good day, 

I am trying to add a hover style effect to the header which was native to prestige theme, i don't know if this style got removed in the theme update but i can't find it in the costumizer and i don't know how to do it with CSS.

This is my header:

963d44d5-5161-4d52-ba4222229-d048cec10692.png

This is the desired result:

web-design.png

I tried myself by adding this code to the bottom of css file 

ul.HorizontalList.HorizontalList--spacingExtraLoose a:hover {
background-color: #ff87b0!important;
color: #000!important;
}

but this was the result:

3928df1f-3b7a-4248-a5e9-7e08ad3fe4f9.png

I would really apreciate some help with this!

Store url: https://donutsole-hu.myshopify.com/

Password: twilye

Thank you very much in advance!

Pallavi
Shopify Expert
2221 363 474

Hello There,

1.In your Shopify Admin go to online store > themes > actions > edit code
2.Find Asset >theme.scss.css and paste this at the bottom of the file:

ul.HorizontalList.HorizontalList--spacingExtraLoose a:hover {
background-color: #ff87b0!important;
color: #000!important;
padding: 10% 5% 10% 5%!important;
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
0 Likes
Natztech
Shopify Partner
1370 383 923

hello @NZA 

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

.HorizontalList__Item:hover .MegaMenu  .MegaMenu__Inner .MegaMenu__Item ul.Linklist li.Linklist__Item a.Link {
	color: #ff87b0 !important ;
}

 

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
dmwwebartisan
Shopify Partner
7346 1736 2319

@NZA 

1.In your Shopify Admin go to online store > themes > actions > edit code
2.Find Asset >theme.scss.css and paste this at the bottom of the file:

ul.HorizontalList.HorizontalList--spacingExtraLoose a:hover {
background-color: #ff87b0!important;
color: #000!important;
padding: 10% 5% 10% 5%!important;
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
dfiroz
Excursionist
19 3 6

Hello @NZA 

 

You can use the below code to get rid of your problem.

 

Go to Admin Dashboard > Themes > Action > Edit Code > Assets Folder > theme.css

 

paste the code

.HorizontalList.HorizontalList--spacingExtraLoose a:hover {
	background: #ff87b0 !important;
	color: #000 !important;
	padding: 1rem .5rem !important;
}

 

Screenshot(9).png

 

If this post helps you, like this post and marked as accepted solution.

If helpful, then please Like and Accept Solution.
Want to modify or custom changes on store, hire me.
- Feel free to contact me on imfirozhossain@gmail.com regarding any help
0 Likes