- This topic has 8 replies, 2 voices, and was last updated 6 years, 8 months ago by
.
Hello –
Please fix how the Notice Bar is displayed on mobile devices. Right now the notice bar is hiding behind the logo/navigation and is not accessible to the users. Please fix this asap per the new GDPR regulation requirements. Thank you.
Hi @appetitte,
Sorry to hear of the problem you are having.
I have tested it on my test site and it’s working fine for me using below latest version of Jevelin theme as displayed in the attached screenshot.
Please make sure you are using above latest version of theme and if you still face the issue then could you please share me your site URL where it’s happening so that i can troubleshoot it?
Best regards,
Shufflehound teamThanks for checking this out. I am using the latest version of the theme. However, on mobile devices, the notice bar is still showing up hidden:
Here’s the site: https://appetitte.com
If you could troubleshoot it, that would be great. Thank you.
Solution for this topic
I could confirm the issue on my test site which only occurs after activating Sticky Mobile Header in the theme header settings therefore notified the theme developer about this so that it will be fixed.
The issue will be fixed ASAP.
In the meanwhile you can try resolving the issue by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
.sh-page-notice[style*="display: block"] + header.primary-mobile .sh-sticky-mobile-header { top: 85px; } .sh-page-notice[style*="display: block"] + header.primary-mobile .sh-sticky-mobile-header.sh-sticky-mobile-header-active{ top: 0; }Thank you. However, this did not solve the problem. Now the notice bar is above the logo, but still halfway hidden – see attached screenshot. Also, the “Got it” button goes over the “learn more”. Please fix this. Thank you.
Solution for this topic
Please also use the below custom CSS code.
@media (max-width: 700px){ .sh-page-notice[style*="display: block"] + header.primary-mobile .sh-sticky-mobile-header { top: 165px; } } @media (max-width: 1150px){ .sh-page-notice .sh-page-notice-button { margin-top: 5px; } }That worked. Thank you!
You are most welcome here 🙂
The issue is fixed in the following latest version of theme so please update the theme on your site as described here https://support.shufflehound.com/updating-theme/
