shopify dawn theme - my specific page slideshow MOBILE ONLY to adapt to its first image

Store Design
, ,
1

Hi guys, my desktop has no issue with the slideshow to adapt to first image. However, once I do that my mobile will adapt as well, which I have designed a portrait version of image for my mobile.

My mobile page for https://fonpintar.com.my/pages/instalment-plan current looks like this

KelvinLeow_0-1688480856364.png
KelvinLeow_0-1688480856364.png429×870 81.5 KB

I want to fix this page’s slideshow only, im already happy with my homepage slideshow settings. Through inspect I manage to find that 40rem is the height that I want for my mobile version. But this code I tried putting in Base.css doesnt work.

@media screen and (max-width: 749px) {
    .Slider-template--19422053007679__9b20da74-de0f-437d-9c1a-66f0dbb0e6cd {
    height: 40rem;
    }

Anyone can help with this?

Web password: taclau

2

@KelvinLeow

Please add the following CSS code to your assets/component-slideshow.css bottom of the file.

#shopify-section-template--19422053007679__9b20da74-de0f-437d-9c1a-66f0dbb0e6cd .slideshow.banner {height: 40rem !important;}

Thanks!