How can I adjust the size of a mobile slideshow section?

Store Design
1

Hi All,

I have managed to create a slideshow section, 1 for mobile and 1 for desktop. The desktop version is great, but the mobile version, the slideshow images are cut off top and bottom.

Could you please help me with adjusting this?

Site is https://cossetspace.com.au/

Mobile version

cossetspace_0-1628998654270.png
cossetspace_0-1628998654270.png603×397 72.2 KB

1 Like
2

@cossetspace

sorry for that issue please add this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@media only screen and (max-width: 749px)  {
.slideshow__image {background-size: contain;}
}
3

Hi @KetanKumar ,

I have changed the image size to Large which worked OK for mobile, but now the desktop is cut off

cossetspace_0-1629005074765.png
cossetspace_0-1629005074765.png1847×833 269 KB

FYI, I have followed a tutorial online so I no longer using .slideshow liquid but am using specific-device-slideshow.liquid

1 Like
4

@cossetspace

yes is possible if you need desktop and mobile separate image custom code