Custom website menu style

Site URL: https://kazoo-bulldog-snp5.squarespace.com/

Hi everyone,

I am creating a new website via Squarespace platform. The template is Brine Family 7.0.
https://kazoo-bulldog-snp5.squarespace.com/
Password to access is: 1234

You can see my current menu style. This is out of the box with Squarespace, I want to custom it with some code.

And Reuse this menu effect:
http://editionsmego.com/

However, with another color, the blue of our site.

Do you have any code suggestion for that?

Thanks a lot for your kind help!

up svp 🙂

Hey @oxmoserecords - I can help ya 🙂  That low highlight effect can be done with a little clever background gradient code. I have a tutorial about it on my youtube channel here. Long story short, this code will add that effect for active links:

.Header-nav-item--active{ background: linear-gradient(to bottom, #FFF 50%, #0015ff 50%)!important; color: #000!important}

And this one will do it for you on a hover.

.Header-nav-item:hover{background: linear-gradient(to bottom, #FFF 50%, #0015ff 50%)!important; color: #000!important}

You can play around with those percentages to make it perfect for your own site aesthetic 🙂 Hope this helps - let me know how it goes!

Fantastic help inside_the_square
🙂

Thanks a lot, this is exactly what I needed, the menu of our site is looking great now!