Hi guys, this is my store https://sarasthreads.com/ I’m using the theme showcase and I want to remove the white band at the top of the homepage that becomes visible upon hovering… i have already tried the solutions suggested in a similar forum (https://community.shopify.com/c/shopify-design/spotlight-theme-remove-white-band/m-p/2741064#M717780) but unfortunately it didn’t work for me.. anyone has any idea on how to solve this?
Hi @Saretta99 ,
Go to Online Store, then Theme, and select Edit Code.
Search for base.css/theme.css/style.css file Add the provided code at the end of the file.
@media (min-width: 768px) {
.site-control.nav-inline-desktop:hover {
background-color: transparent !important;
}
}
Hi @Saretta99 ,
Please go to Actions > Edit code > Assets > styles.css file and paste this at the bottom of the file:
@media (min-width: 768px) {
.nav-mega-open .site-control.nav-inline-desktop, .site-control.nav-inline-desktop:hover {
background-color: transparent !important;
}
.nav-mega-open .site-control.nav-inline-desktop .site-control__inner a, .nav-mega-open .site-control.nav-inline-desktop .site-control__inner .disclosure__toggle, .site-control.nav-inline-desktop:hover .site-control__inner a, .site-control.nav-inline-desktop:hover .site-control__inner .disclosure__toggle {
color: #fff !important;
}
.nav-mega-open .site-control.nav-inline-desktop .site-control__inner svg, .nav-mega-open .site-control.nav-inline-desktop .site-control__inner .cart, .site-control.nav-inline-desktop:hover .site-control__inner svg, .site-control.nav-inline-desktop:hover .site-control__inner .cart {
fill: #fff !important;
color: #fff !important;
}
}
Hi Saretta99
- You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file styles.css and add this code at the end of the file
@media (min-width: 768px) {
.nav-mega-open .site-control.nav-inline-desktop, .site-control.nav-inline-desktop:hover {
background-color: transparent !important;
}
}
Result:
Best,
Esther