classes: 'hidden-mobile, hidden-tablet, hidden-desktop' - display:none?
-
-
- Melvin
- Jr. Rocketeer
- Posts: 28
- Thanks: 0
-
Hi,
Just wondering if these classes are using display: none to hide from certain viewports? I already know where I can set the viewport sizes in the Gantry backoffice, but I'm also curious about where the CSS properties are stored. Is there any way to change what happens when I assign these classes?
The reason why I'm asking is because I am currently using jQuery to load up a top menu (Which has the display: none; properties) and this jQuery will also load the blocks in the ID which have the hidden-mobile class set. I'm pretty sure this has to do with jQuery overriding the display: none tags. (!Important would be usefull here, and I would like to add it.)
Thanks in advance! - Last Edit: 6 years 6 months ago by Melvin.
-
-
-
- MrT
- Preeminent Rocketeer
- Posts: 101084
- Thanks: 13481
- Web Designer/Developer
Re: classes: 'hidden-mobile, hidden-tablet, hidden-desktop' - display:none?
Posted 6 years 6 months ago-
Yes they use display none.
No, you should not add !important because of the hierarchical nature of the classes and the fact that you can use more that one at the same time - using !important will break things.
You didn't say what gantry version or template you are using either?
Regards, Mark. - Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
-
-
-
- Melvin
- Jr. Rocketeer
- Posts: 28
- Thanks: 0
Re: classes: 'hidden-mobile, hidden-tablet, hidden-desktop' - display:none?
Posted 6 years 6 months ago-
My bad, Thanks for your quick reply Mark.
I'm using the latest version of Gantry (5.4.18) and the Galatea theme.
Perhaps I should add my own class to the items I'd like jQuery to show instead and select the class instead of selecting the ID.
-
-
-
- MrT
- Preeminent Rocketeer
- Posts: 101084
- Thanks: 13481
- Web Designer/Developer
Re: classes: 'hidden-mobile, hidden-tablet, hidden-desktop' - display:none?
Posted 6 years 6 months ago-
Yes, use your own classes rather than changing the functionality of our classes otherwise you could break things.
Regards, Mark. -
The following users have thanked you: Melvin
- Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
-
-
-
- MrT
- Preeminent Rocketeer
- Posts: 101084
- Thanks: 13481
- Web Designer/Developer
Re: classes: 'hidden-mobile, hidden-tablet, hidden-desktop' - display:none?
Posted 6 years 6 months ago-
Do not change this file at all it is a fundamental part of Gantry 5.
/media/gantry/engines/nucleus/scss/nucleus/theme/breakpoints/_utilities.scss
Regards, Mark. - Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
-
Time to create page: 0.050 seconds