Hi, i'm trying to make all the navigation links bold when hover and when active. I've achieved it but the cart icon it resists to appear bold when its active.
I've added this css so far:
/* Nav item hover color */
.header-nav-item>a:hover {
font-weight: 600 !important;
}
.header-nav-folder-item:hover a {
font-weight: 600 !important;
}
/* Nav item active color */
.header-nav-item--active a {
font-weight: 600 !important;
}
How to make the cart icon active on navigation?
in Customize with code
Posted
Site URL: https://nonagon-accordion-zx5m.squarespace.com/
Hi, i'm trying to make all the navigation links bold when hover and when active. I've achieved it but the cart icon it resists to appear bold when its active.
I've added this css so far:
/* Nav item hover color */
.header-nav-item>a:hover {
font-weight: 600 !important;
}
.header-nav-folder-item:hover a {
font-weight: 600 !important;
}
/* Nav item active color */
.header-nav-item--active a {
font-weight: 600 !important;
}
/* cart */
.header-actions-action--cart .icon--cart:hover .icon--cart {
stroke-width: 2px !important;
}
.header-actions-action--cart .icon--cart--active .icon--cart {
stroke-width: 2px !important;
}
/* Remove Navigation Link Underline */
.header-nav-item--active a{
background: unset !important;
}
And this code injection in header:
<style>
#header a:active{
font-weight: 600 !important;
}
#header a:hover{
font-weight: 600 !important;
}
div.folder.active{
font-weight: 600 !important;
}
</style>