Mobile Nav Breakpoint
Permalink Browser Info Environment
I am having a similar problem as "Shutton", but for a different reason.
My client insists on having nine (9!) menu points. I am finished trying to reason, and just want to get the site finished. However, I think it could look reasonable if I can change the breakpoint at which the mobile menu appears.
Is it possible to do this through custom css, or would I have to "fork" the theme?
The Foundation CSS uses "ems" and not pixels for media queries. I am not certain how to implement this.
Can you make a suggestion?
By the way, I just noticed the Parallax capability in the Section block - fantastic! I thought I would have to buy an extra add-on.
Thanks for any help...
Arlene
My client insists on having nine (9!) menu points. I am finished trying to reason, and just want to get the site finished. However, I think it could look reasonable if I can change the breakpoint at which the mobile menu appears.
Is it possible to do this through custom css, or would I have to "fork" the theme?
The Foundation CSS uses "ems" and not pixels for media queries. I am not certain how to implement this.
Can you make a suggestion?
By the way, I just noticed the Parallax capability in the Section block - fantastic! I thought I would have to buy an extra add-on.
Thanks for any help...
Arlene
| Type: | Pre-Sale |
|---|---|
| Status: | In Progress |
As you can imagine, I have forked the theme and added a special preset for my client.
Thank you for your patience - I just want to ask this question because I thought maybe you know the answer right away... I must admit it is all a bit voodoo for me.
I could find 4 files where media queries are mentioned:
- page_theme.php
- main.less
- foundation.less (I think this has to do with grid structure?)
and
- foundation.css
In page_theme.php media queries are presented as an array of values. I tried messing with that but it made no change.
In main.less there are only 4 references for the 40em max and 40.63 min width. I assume this is THE break point for the menu icon to appear? Actually, this is what I am interested in.
However in foundation.less and foundation.css, there are 73 "@media..." in each file, mostly for the 40em/40.063em value.
Question:
Is there one file where I could change the queries for the top nav, or must i change them in all of these files?
I was amazed to note that although I have changed "theme", the Equinox presets in the dashboard are still working/valid. Wonderful.
Thanks -
Thank you for your patience - I just want to ask this question because I thought maybe you know the answer right away... I must admit it is all a bit voodoo for me.
I could find 4 files where media queries are mentioned:
- page_theme.php
- main.less
- foundation.less (I think this has to do with grid structure?)
and
- foundation.css
In page_theme.php media queries are presented as an array of values. I tried messing with that but it made no change.
public function getThemeResponsiveImageMap() { return array( 'xlarge' => '1100px', 'large' => '900px', 'medium' => '768px', 'small' => '0' ); }
In main.less there are only 4 references for the 40em max and 40.63 min width. I assume this is THE break point for the menu icon to appear? Actually, this is what I am interested in.
However in foundation.less and foundation.css, there are 73 "@media..." in each file, mostly for the 40em/40.063em value.
Question:
Is there one file where I could change the queries for the top nav, or must i change them in all of these files?
I was amazed to note that although I have changed "theme", the Equinox presets in the dashboard are still working/valid. Wonderful.
Thanks -
The Em unit is not that complex, there is slightly more to it than this but just think of the numbers as relative to 1 which is your 100%, find the media query that governs your breakpoint and you and tweak the em to achieve the breakpoint you need.