Remove Promotion Bar from showing in the mobile version (but still show in desktop)- Venture theme

Solved
ChamanGarg
Excursionist
43 0 12

Hi,

I am using the Venture theme.

Can someone please help me with the code to remove the promotion bar from showing in the venture theme (mobile version) and come only in the desktop version?

Thank you for the help in advance.

 

Store- sohum-linen.myshopify.com

Pass- chaman10

 

0 Likes
dmwwebartisan
Shopify Partner
4509 1014 1301

@ChamanGarg 

Can you please provide a screenshot? which bar do you want to remove from mobile?

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
ChamanGarg
Excursionist
43 0 12

I had shifted my promotion bar from below the header (default) to above the header for desktop version.

However, in the mobile version it isn't working properly. When I drag the screen downwards, I see that the promotion bar is hidden behind the header in the mobile version and it also creates a wierd gap between the header and the content.

Thus, I want the promotion bar to be gone in the mobile version completely. (I hope it will solve the problem of the wierd space too.

 

IMG_6323.PNG

IMG_6324.PNG

dmwwebartisan
Shopify Partner
4509 1014 1301

This is an accepted solution.

@ChamanGarg 

Please add the following code at the bottom of your assets/theme.scss.css file.

@media only screen and (max-width: 749px){
div#NotificationPromo { display: none; }
}

 

This will remove the promotional bar from mobile.

Hope this helps.

Thanks! 

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
ChamanGarg
Excursionist
43 0 12

Thanks a lot. It removed the promotion bar and the weird space got reduced. But there still seems to be a small space (white padding) on all of my pages. Can you tell me how do I remove it?

dmwwebartisan
Shopify Partner
4509 1014 1301

This is an accepted solution.

@ChamanGarg 

Add the following code to remove the remaining sapces.

@media only screen and (max-width: 768px){
.page-container { padding-top: 60px !important; }
}

 

Hope this works.

Thanks! 

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
ChamanGarg
Excursionist
43 0 12

Perfect. Thanks