Dawn Theme 5.0: The Slideshow looks great on Desktop but on Mobile looks horrible

Store Design
1

Dawn Theme 5.0:

The Slideshow looks great on Desktop. But on Mobile, only a fraction of the image is showing and it looks horrible. It appears as though only the center part of the image is shown on mobile. Is there a way to fix this or not show the slideshow on mobile? In the section “image_banner”, the image is great on mobile and desktop. Is there code I can copy from the liquid or CSS file to fix it on mobile (am not sure what to copy)? (I went through the posts and tried solutions for other themes and none of them worked.)

|My shop: websiteelements.myshopify.com Password: ENTER

Thank you for your help.

Screenshot (251).png
Screenshot (251).png1515×603 593 KB

Screenshot (252).png
Screenshot (252).png768×617 167 KB

2

Hi @Smiley1311 ,

Go to Assets > base.css and paste this at the bottom of the file:

@media only screen and (max-width: 749px) {
	#Slider-template--16045487227126__1652665872c477dca2 .slideshow__text-wrapper {
		min-height: 12rem !important;
	}
	#Slider-template--16045487227126__1652665872c477dca2 .banner__box {
		padding: 0 !important;
	}
}

Hope it helps!

3

Thankyou very much for helping me. It worked! Much appreciated.

I am learning and would like to know how you know which Slider-template- number i.e 16045487227126__1652665872c477dca2 to use?

Thanks.

4

Hi @Smiley1311 ,

It helps this CSS code to work only on a single slideshow section, not all slideshow sections.

Because if change for all, there will be sections affected by this and not working well.

Hope it is clear to you.