SlideIn size issue on mobile and colour does not match

Hello @jasonsexton

Hope you’re doing well!

1. The colour theme I have set in my Slide-In is Sunrise, however, on all devices the colour stays as the default (but shows as Sunrise in the preview).

Would you please enable Customize colors option and see of the Slide In will show with Sunrise palette at the front end?
Please see this screenshot:
https://monosnap.com/file/wjSNu4tDUMbI51Pgprt19YRnoP7aYb

2. The slide-in loads correctly and works on desktop. On MOBILE however it loads, but it takes up the whole screen and has no scroll bar. I am not able to scroll the text about my newsletter, or get to the ‘I accept the privacy policy’ buttons, meaning that the form cannot work on mobile. It is also very hard to scroll to a point where the close X appears.

I am afraid I can’t replicate this on my end. I’ve tried to visit your site to see the issue although it has “Coming Soon” mode enabled.

Would you please temporary remove the Coming Soon mode so I could have a closer look?

Please let me know when you do!

Cheers,
Nastia

Hello.

Thanks for replying.

I have activated the site and scroll in’s, please go to the link now and it should open.

The button at the top of the site ‘GET IN THE KNOW’ is the on click call button for the slide in, or if you scroll down about 20% is the other trigger.

If tested on mobile you may see the issue I am having.

Hello,

Checking the ‘use custom colours’ button worked for the front end, great!

So just the second issue still left…

On my Samsung Android using Chrome, the slide in appears but only shows text, with no scroll option. I cannot see all the text nor the ‘accept privacy’ button.

After some more testing, and turning off ‘featured image’ for mobiles, all the txt in my description and titles show, but the GDPR check box does not. I cannot scroll or get this to show, so they cannot sign up via mobile devices at the moment.

Your time in checking is appreciated. ??

After some further testing, I have found a workable solution.

.hustle-modal .hustle-modal-close,
.wpmudev-ui .hustle-modal .hustle-modal-close {
position: absolute;
top: 3px;
right: 2px;
}
@media(max-width:768px){
.hustle-modal-one .hustle-modal-body section, .hustle-modal-one .hustle-modal-body section article{
max-height:none !important;
height:auto !important;
}
}

I am using the above CSS.

The first part ‘hustle-modal’ moves my close X into the slide in itself making it far easier to close on mobile.

I have to have ‘turn off featured image’ on mobile, but that makes sense.

The second part of the CSS, from @media, firs the full text and GDPR button on the screen.

My question now is, is there a way to set the max height, so that it always displays on mobiles? For example, if I did have the ‘featured image’ set ON, would the max height make the box scrollable on mobile, or not?

Thanks

Hello,

Same issue on mobile sadly.

The above CSS works on my phone, but in my partners phone browser it is cut off again.

Any assistance welcome please and thank you.

Hi @jasonsexton,

Can you tell us which phone and browser is your partner using so we can check this out?

Cheers,
Predrag

Thanks for the reply.

Using Samsung J5 and Chrome.

Hello,

Thanks for the follow up so far.

Was there any updates fro the dev team regarding mobile?

Thank you

Hi Jason,

Apologies for the long overdue here, we had a release for Hustle last week that addressed some responsive issues, amongst other stuff, and when I check your site on Samsung S8 it looks fine for me https://screencast.com/t/cpqqq6wL
Can they check with cache cleared or opening it in incognito mode?

Cheers,
Predrag

Thanks for the reply.

Does look ok there, it was just the other phone type. Hopefully update has worked, and/or browser issues on user end.

We’ll call this solved for now.

Thanks