How can I edit mobile product page layout?

Store Design
1

Hi,

How would I remove the black box on the product categories and move the category name below the image on mobile view?

Page: https://stmnt-streetwear.myshopify.com/collections

mobile app.jpg
mobile app.jpg828×1565 98.2 KB

Thank you,

Marco

2

@mabrunhosa

can you please confirm

KetanKumar_0-1629957657110.png
KetanKumar_0-1629957657110.png1920×1080 489 KB

2 Likes
3

Hi Ketan

Placement is perfect, is it possible to change the text background to white and the font to black?

Thank you for your help!

Marco

1 Like
4

@mabrunhosa

yes its possible

1 Like
5

Thank you! How would I implement these 2 changes?

1 Like
6

@mabrunhosa

yes please add this code

@media only screen and (max-width: 749px) {
.collection-grid__title {
background-color: #fff;
    color: #1b100e;
}
.collection-grid__title-wrapper {top: 130px;}
.collection-grid__link-overlay, .collection-grid__link {overflow: visible;}
.collection-grid__item {
height: 300px;
    overflow: visible;
    padding-bottom: 100px;
}
}
1 Like