Using different banner image for mobile

Site URL: https://www.promomomma.com/

Hello,

The banner image I am using on the home page of my website looks great on desktop view, but doesn't translate to mobile. Is there a way to use a different banner image on my mobile site?

20 hours ago, MeaghanPM said:

Site URL: https://www.promomomma.com/

Hello,

The banner image I am using on the home page of my website looks great on desktop view, but doesn't translate to mobile. Is there a way to use a different banner image on my mobile site?

It looks like you solved? Do you want to solve banner on tablet?

and some other. Do you want to fix these?

Site URL – https://www.promomomma.com/

1. (Tablet-Footer) Make these text one line?

2. (Tablet-Homepage) Make fields same line?

3. (Tablet-Homepage) Resize banner?

4. (Mobile-Footer) Increase footer width?

5. (Mobile-About) resize slide?

6. (Tablet-About) resize slide?

7. (Tablet-Contact) Want to stacked text/form?

8. (Mobile-Contact) Want to resize form?

9. (Mobile-Products) Want to add breadcrumbe or back to shop button on top of product?

10. (Mobile-Products) Want to add an arrow slide, instead of 1/8

11. (Mobile-Products) When added product to cart, I don’t see Cart icon appear. Do you want to add a link/button “Go to cart”?

Yes to everything, please - if you don't mind!

On 5/3/2021 at 2:11 AM, MeaghanPM said:

Yes to everything, please - if you don't mind!

Q1. Add to Design > Custom CSS

/* tablet footer */
@media screen and (max-width:991px) and (min-width:768px) {
footer.sections .content-wrapper {
    padding-left: 0 !important;
}
footer.sections .content {
    width: 95% !important;
}
footer.sections .content * {
    white-space: nowrap;
}
footer.sections .content .sqs-block {
    padding-left: 5px;
    padding-right: 5px !important;
}
}

Other questions. Next comment

On 5/3/2021 at 2:11 AM, MeaghanPM said:

Yes to everything, please - if you don't mind!

Q2. Q3. Add to Design > Custom CSS

/* tablet-newsletter */
@media screen and (max-width:991px) and (min-width:768px) {
.newsletter-block .newsletter-form-field-wrapper {
    min-width: unset !important;
}
body.homepage article section:first-child {
    min-height: unset !important;
    height: 30vh;
    margin-top: 5vh;
}
}