Making a page builder element desktop only…

[MarieWorks]

Hi,

I have added a toggle to work as a filter in the mobile shop (‘Shape Filter’ in the screenshot) – I have tried to stop this from showing up on desktop (were it duplicates functionality in the sidebar) by using the code below (the toggle has a custom class “mobileshapetoggle”)

/*shape filter for mobile shop*/
@media only screen and (min-width: 979px) {
.mobileshapetoggle {
display:none !important;
}
}

Doesn’t seem to of worked (still showing on desktop) ? Have tried moving it to the top of custom css..

Thanks
C

Attachments:

You must be logged in to view attached files.

[Rui Guerreiro – SUPPORT]

Hi,

That’s because it’s wrapped in a media query that is only active till 979px, you should use this instead.

/*shape filter for mobile shop*/

.mobileshapetoggle {
display:none !important;
}

-Rui

[David Martin – Support]

Hi,

This is actually working as expected, the class added is hiding the contents of the dropdown. (See screenshot)

Are you looking to hide the actual toggle?

– David

Attachments:

You must be logged in to view attached files.

[MarieWorks]

Thanks Rui,

Hi David – yep we wanted to hide the whole toggle – whats missing in the css for that ?

Thank you – again 🙂 🙂

[David Martin – Support]

Hi,

The class for that, on that page would be:

.post-type-archive-product .toggle-wrap {
  display: none;
}

You would need to add that into your desired media query, if any.

– David.

[MarieWorks]

Hi David,

Thats brilliant – thank you for your help 🙂

Chris

[Kyle – SUPPORT]

Thanks David