Brooklyn theme reducing padding on mobile device

Ernest0706
Tourist
25 0 9

Hello all,

I ran into an issue while designing my homepage and I am using Brooklyn theme. 

I tried using the method of changing this line of code in theme.scss.liquid, hoping to reduce the padding between elements.

.shopify-section {
margin-top: 0px;

However, while this does work on desktop versions of the homepage, I don't see any difference on mobile version. 

How can I do the same on mobile version as well?

 

 

0 Likes
dmwwebartisan
Shopify Partner
5877 1342 1724

@Ernest0706 

Please share your webshop URL & Password.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
Ernest0706
Tourist
25 0 9

@dmwwebartisan 

Website URL: https://ej-story.com/

Password: moclule

Thank you.

0 Likes
dmwwebartisan
Shopify Partner
5877 1342 1724

@Ernest0706 

Please add following Code to your theme CSS file.

 

@media screen and (max-width: 768px){
.index-sections .shopify-section { margin-top: 0px !important;}
}

@media screen and (min-width: 769px){
.index-sections .shopify-section { margin-top: 0px !important;}
}

 

 

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
g33kgirl
Shopify Partner
223 59 75

Hi @Ernest0706, you need to add the media query code to your CSS file as well to make it responsive. Add this code at the end of the CSS file:

.index-sections .shopify-section {
        margin-top: 0;
 }
@media screen and (max-width: 768px) {
    .index-sections .shopify-section {
        margin-top: 0;
    }
}
If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl ☕
If you're not comfortable with code, please modify code files at your own risk.
Do NOT give out your passwords unless absolutely necessary.
0 Likes
Ernest0706
Tourist
25 0 9

Hello, @g33kgirl by css file do you mean the theme.scss.liquid file under assets?  Thanks.

0 Likes
g33kgirl
Shopify Partner
223 59 75

@Ernest0706, yes. Make sure you add at the end of the file. 

If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl ☕
If you're not comfortable with code, please modify code files at your own risk.
Do NOT give out your passwords unless absolutely necessary.
0 Likes