Debut Theme - Slideshow White box to the Right in Mobile - How to remove?

Store Design
1

Hi!

I have gone through all the posts I can find and found a lot of answers about removing the white box at the bottom of the slideshow but nothing about the white box that appears to the right. I am assuming it is there so that the pause button can be seen because it jumps from the bottom to the right side on mobile, but even hiding the pause button I am not able to get rid of that white box on the right.

With box (smaller than 750px):

Screen Shot 2022-01-17 at 10.21.55 AM.png
Screen Shot 2022-01-17 at 10.21.55 AM.png1404×1750 197 KB

Without box (larger than 750px):

Screen Shot 2022-01-17 at 10.22.10 AM.png
Screen Shot 2022-01-17 at 10.22.10 AM.png1504×1352 202 KB

I did see a comment someone mentioned that it is due to having a header and button, and to remove them if we don’t want that box but it makes no sense since the slider is useless without them. How do I get people to go to the advertised item if there is no button? But, I digress. If anyone could help me with this I would be very grateful.

1 Like
2

@NOVUmrktng

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

1 Like
3

Thank you very much for your reply!

My site URL is: https://shop.novuskin.com/

1 Like
4

@NOVUmrktng

great thanks for ulr

sorry bt i can’t see attachment try to upload here

https://pasteboard.co/

1 Like
5

@KetanKumar Sorry, I did not check this earlier, I am not able to get the website you sent me to do anything.

But anyway the issue is if you look at the webpage in mobile or smaller than 750px a white box appears on top of the slider banner on the right side.

1 Like
6

@NOVUmrktng

can you please confirm this issue?

KetanKumar_0-1642790878705.png
KetanKumar_0-1642790878705.png1920×1080 268 KB

1 Like
7

Yes! That is the issue I am having.

8

@KetanKumar

Hi! Sorry to bother you again, but The issue is indeed that white box you showed in your post. Do you have any idea how it can be fixed?

Thank you in advance!

9

@NOVUmrktng

yes, please try 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 (max-width: 749px){
.slick-list {
    padding: 0 0px 0 5px;
}
}
1 Like
10

@KetanKumar Yes! That fixed it! Thank you so much!