Element Padding/Margin Removal on mobile boundless theme

Store Design
1

I want to remove padding, margins, and text but only on the collection list on my home page mobile site. To make the homepage look like a grid. I have figured out a way to do this that affects all collection pages, but I need it to affect homepage featured collection ONLY.

https://here-in-heaven.myshopify.com/

password: sheick

plnmh_0-1657153755952.png
plnmh_0-1657153755952.png774×1508 257 KB

1 Like
2

Hello @plnmh

Greetings!!!

Please follow the steps:

  1. Online store->Themes->Actions->Edit Code->Assets->theme.scss.liquid

  2. Paste the below code at the last of this file theme.scss.liquid

@media only screen and (max-width: 989px){
.template-index .product-item.grid__item{margin-bottom:0;}
.template-index .product-item.small--one-half .product-item__meta__inner {
    position: absolute;
    background: #faebd752;
    left: 0;
    top: 0;
    right: 0;
    margin: 0 auto;
    text-align: center !important;
    bottom: 0;
    display: none;
}
.template-index .product-item.small--one-half .product-item__meta__inner:hover { display: block;}
}