Jump to content

HEADING social icons hover color

By JakeLake, in Fonts, colors and images

Go to solution Solved by Beyondspace,

Recommended Posts

  • Replies 3
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Popular Posts

Beyondspace
Beyondspace

You can try adding to Home > Design > Custom Css :not(.header--menu-open) .header-actions .header-icon:not(.header-icon-border-shape-none).header-icon-border-style-outline:hover { box-shado

JakeLake
JakeLake

EXCELLENT & thank you for your quick reply!

Posted Images

  • Solution
Beyondspace Level 14

Beyondspace

Posted
  • Solution
Posted
5 hours ago, JakeLake said:

Hi - so I've got hover effect in place on social icons, but want the background to shine through so it isn't ALL yellow please?

www.konsulentoppdrag.no

You can try adding to Home > Design > Custom Css 

:not(.header--menu-open) .header-actions .header-icon:not(.header-icon-border-shape-none).header-icon-border-style-outline:hover {
  box-shadow: 0px 0px 0px 1px inset !important;
  color:  #f2ba40 !important;
    background: transparent ;

}

Let me know how it works on your site

Support me by pressing 👍  or marking as solution if this useful for you

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date format)
💫 Animated Buttons (Referral URL)
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment
Beyondspace Level 14

Beyondspace

Posted
Posted

My testing

image.png.3878435812623788da3624e786645aed.png

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date format)
💫 Animated Buttons (Referral URL)
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment
JakeLake Level 5

JakeLake

Posted
  • Author
Posted
17 hours ago, Beyondspace said:

You can try adding to Home > Design > Custom Css 

:not(.header--menu-open) .header-actions .header-icon:not(.header-icon-border-shape-none).header-icon-border-style-outline:hover {
  box-shadow: 0px 0px 0px 1px inset !important;
  color:  #f2ba40 !important;
    background: transparent ;

}

Let me know how it works on your site

Support me by pressing 👍  or marking as solution if this useful for you

EXCELLENT & thank you for your quick reply!

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

Sign Up / Login
Go to topic listing
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Upcoming Webinars →

Hire a Designer

Stand out online with the help of an experienced designer or developer.

Get Matched →

Support

Community

Developers

Resources