Header opacity help!

Christine1065
New Member
3 0 0

Hello! I wanted to see if I could make my header the same opacity as it is when hovering. I would also like to make the color of the background of menu items transparent when hovering.

 

https://portrait-coffee.myshopify.com/

Replies 4 (4)
BriskDevelopers
Shopify Expert
116 11 20

You just need to add below code in your assets/theme.min.css file,

 

.template-index .header-section:not(.sticky-header) .overlay-header:hover{
background-color: rgba(185, 98, 40, 0.5) !important; 
}

 

 

Regards,
Jay Gandhi

If helpful then please Like and Accept Solution. Want to modify or custom changes on store Hire me. Feel free to contact us regarding any help, below our contact listed:
Shopify Expert Page: https://experts.shopify.com/brisk-developers
Email: support@briskdevelopers.com
Contact us: https://www.briskdevelopers.com/contact-us
Skype: briskdevelopers
Christine1065
New Member
3 0 0

Thank you so much! How can I make the menu items transparent when I hover over them as well? The opacity didn't apply to them!

I also wanted to see if I can make the caption for the photo right below the header have 50% opacity as well.

BriskDevelopers
Shopify Expert
116 11 20

Add this code for menu,

.site-nav__dropdown.standard-dropdown li:hover,.site-nav__dropdown.standard-dropdown li:hover>.site-nav__link,.site-nav__dropdown .site-nav__link {
background-color: rgba(185, 98, 40, 0.5) !important; 
}
If helpful then please Like and Accept Solution. Want to modify or custom changes on store Hire me. Feel free to contact us regarding any help, below our contact listed:
Shopify Expert Page: https://experts.shopify.com/brisk-developers
Email: support@briskdevelopers.com
Contact us: https://www.briskdevelopers.com/contact-us
Skype: briskdevelopers
Christine1065
New Member
3 0 0

last one! How do i change the opacity for the caption on the photo below the header?