Removing Collection Title Overlay on Mobile Only (Boundless Theme)

_Artlush_
Tourist
4 0 0

Hey all,

I've found some great advice about removing the Collection title text but it applies to both mobile and desktop. I really like and want to keep the effect of my collection titles appearing when you hover over them on desktop, but I'd like to remove them altogether from the mobile version as they look out of place and block pre-existing text in the collection images. Any advice on how to remove them from mobile only would be greatly appreciated! 

Replies 4 (4)

Toorbia
Shopify Partner
142 18 33

I can check and suggest a solution if you share your store url.

- If I solved your question, click Accept as a solution
-for custom solutions contact me by mail | henrijeair@gmail.com
_Artlush_
Tourist
4 0 0

artlushshop.com

Thanks! 

Kinjaldavra
Shopify Partner
2302 570 1422

hello @_Artlush_ 

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media only screen and (max-width: 989px){
.template-list-collections .supports-csstransforms3d .collection-grid__title {
display: none !important;
}
}

 

LitExtension
Shopify Partner
4860 1001 1132

Please follow the steps:
- Step 1: Go to Online store > Themes > Actions > Edit code.
- Step 2: Go to Assets > theme.scss.liquid and paste this at the bottom of the file:
@media only screen and (max-width: 989px){
.supports-csstransforms3d .collection-grid__title {
display: none !important;
}
}

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify