Jump to content


Photo
Hero Nav

How do I set the breaking point for Hero Nav?



Best Answer Evan Mattson , 23 March 2015 - 03:16 PM

@napait,

 

This feature has been added since 1.2.0.  You will find it at the bottom of Hero Nav's global options (under Site Options).  It's called "Mobile Break".

 

There, you can specify the width at which Hero Nav's mobile styles should take over.  You can specify either a pixel width (such as 768px or 768), or a less variable (eg @resLargeDesktop).

Go to the full post


  • Please log in to reply
3 replies to this topic

#1 chan08†

chan08

    Advanced Member

  • DMS Subscriber†
  • 37 posts

Posted 30 July 2013 - 07:42 PM

Hi Evan, 

 

Great work on the section! It's been a life saver for me. Just had a quick question, was wondering if it was possible to set Hero Nav to show the mobile menu at a larger resolution. 

 

Currently it seems to break into the mobile menu at around 600px. Can this number be change to something larger. 
 

I'm attaching a screenshot so you can see what I'm talking about. You see how the menu basically slides underneath the logo and some items get hidden? Trying to avoid that. Or you could tell me how to make the logo responsive :)

 



#2 Evan Mattson

Evan Mattson

    Super Member

  • Members

  • 243 posts
  • LocationAnn Arbor, MI
  • Framework Version:latest stable & beta releases
  • Country: Country Flag

Posted 31 July 2013 - 01:53 AM

Hey @chan08†,

 

That's an interesting idea.  The breakpoint is currently set to use the @resPortraitTablet less variable which is set to 767px by default.  There is no option at the moment to change this, but perhaps I'll add it.  If you wanted to change this value, you could do so by copying the core framework's variables.less file into a directory in your child theme named 'less' (filename must be the same).  You could then change the value of that variable to something higher, but it may effect other things as well in a way that may not be practical.  I'm not really sure.

 

Another thing to keep in mind is that the media queries for it only kick in when the site is in some responsive mode (not fixed width), but it looks like you're using one of those.

 

Let me know how that works for you!



#3 napait

napait

    Newbie

  • Members
  • Pip
  • 3 posts
  • Country: Country Flag

Posted 10 March 2015 - 07:02 PM

Hi @evan,

 

Is this something you still thinking about adding into the features of DMS? I really feel it would be helpful due to menu lengths with different sites. Please let me know about any other ideas you might have to make this work. Currently markheroldwines.com is in need it, something to switch to mobile around 1280px. Thanks!



#4 Evan Mattson

Evan Mattson

    Super Member

  • Members

  • 243 posts
  • LocationAnn Arbor, MI
  • Framework Version:latest stable & beta releases
  • Country: Country Flag

Posted 23 March 2015 - 03:16 PM   Best Answer

@napait,

 

This feature has been added since 1.2.0.  You will find it at the bottom of Hero Nav's global options (under Site Options).  It's called "Mobile Break".

 

There, you can specify the width at which Hero Nav's mobile styles should take over.  You can specify either a pixel width (such as 768px or 768), or a less variable (eg @resLargeDesktop).







Also tagged with one or more of these keywords: Hero Nav