Hiding/moving banner rotation buttons on mobile browsers

Store Design
1

Hi!

My page url is https://shiokadooo.com.sg/

If you check the link in a mobile browser, you can see the ‘rotation buttons’ are visible at the bottom of the homepage banners… is there a way I can do to hide it?

Zack_97_0-1637131969519.png
Zack_97_0-1637131969519.png329×712 137 KB

I want to somewhat move the sliders away from the banners so it won’t block the banners. Something like this:

Zack_97_1-1637132137814.png
Zack_97_1-1637132137814.png332×715 135 KB

2

Welcome to the Shopify community!

Please follow these steps:

  • Step 1: Go to Online store > Themes > Actions > Edit code.
  • Step 2: Go to Assets > theme.scss.liquid and paste this at the bottom of the file:
@media only screen and (max-width: 749px) {
    .slideshow__text-wrap--mobile {
      top: 0 !important;
    } 
}
3

Hi,

Thanks for the reply.

However I can only find these under my ‘Assets’. There’s no theme.scss.liquid

Zack_97_0-1637147377396.png
Zack_97_0-1637147377396.png271×564 7.54 KB

4

every theme is different. do this in theme.css

5

Thank you.

It has been fixed!

6

If you need any further help you can contact me directly here at [email removed] cheers!

7

Hi @ProfitLabs

what’s the way to totally hide it instead? For mobile only

Thanks

8

Please add this to your theme.scss or theme.css file at the bottom

@media only screen and (max-width: 749px) {
    .slideshow__text-wrap--mobile {
      display:none!important;
    } 
}