Change my Brooklyn theme to display 1 product per row on mobile

Solved
lovechidozie
Excursionist
17 5 3

How can I change my Brooklyn theme to display 1 product per row on mobile only? Please advise.

0 Likes

This is an accepted solution.

Hello,

Thank you for your question. 

Please share your store URL, page URL and also password (if your store has one), I'll help you out to the best of my ability.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Using a free theme? Improve it with copy/paste code snippets clicking here.
◦ Looking to hire an experienced developer? Same day response: ezfycode@gmail.com.
lovechidozie
Excursionist
17 5 3

This is an accepted solution.

Hi,

URL is https://chidozie-omile.myshopify.com/

Please check private message for password.

0 Likes

This is an accepted solution.

@lovechidozie 

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > timber.scss.liquid and paste this at the bottom of the file:

@media (max-width: 600px){
[id] [id][data-section-id="featured-products"] .grid-uniform{
display: flex !important;
flex-direction: column !important;
}

[id] [id][data-section-id="featured-products"] .grid-uniform > *{
width: 100% !important;
}
}


Let me know whether it works please.

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Using a free theme? Improve it with copy/paste code snippets clicking here.
◦ Looking to hire an experienced developer? Same day response: ezfycode@gmail.com.
lovechidozie
Excursionist
17 5 3

Hi @diego_ezfy ,

Worked like a charm. Thanks a bunch!

0 Likes

This is an accepted solution.

You're welcome! Wishing you a nice day.

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Using a free theme? Improve it with copy/paste code snippets clicking here.
◦ Looking to hire an experienced developer? Same day response: ezfycode@gmail.com.