Storefront Handheld Menu Height

With Storefront you can have a separate menu for mobile and desktop. They are listed as Primary for the Desktop, and Handheld for Mobile:

If you are wondering, the Secondary Menu is for the Header.

The Handheld Menu is specific to mobile devices, and it looks like this:

One of the nice visual queues is that it uses an animation to “open up” the menu. Since animations require a height in order to work, it has to have a set “max-height” in CSS:

.handheld-navigation,.main-navigation.toggled .menu>ul:not(.nav-menu),.main-navigation.toggled ul[aria-expanded=true]

The problem then becomes, what if you have more menu items than that height can hold? In my tests it can hold up to about 30 items.

Honestly, if you have more than 8, it’s a bad idea.

However, if you want need to have more than 30ish, you can just use some custom CSS like this:

.handheld-navigation { max-height: 2000px !important; }

That should make the menu up to 2000px in height.

Desk: A nice (but expensive) distraction-free writing experience

Desk is a new publishing app for OS X.

With Desk, you can publish from your desktop to your WordPress, Blogger, Tumblr, Squarespace, Movable Type (is that still around?), Typepad, and even Facebook Notes.

You are a storyteller, passionate about crafting narratives that capture, express, and delight in what it means to be human.

Desk is built with that intent and mission in mind: To reduce the clutter, the noise, the distractions and the obstructions that keep us from writing and sharing those stories.

Fall in love with writing, again.

As a blogger who loves using WordPress to share stories, pictures, and life with my friends and family – I was excited to hear about a new app that could potentially make this experience better and easier.  So, I bought the app for $30, and started typing this review.

Continue reading “Desk: A nice (but expensive) distraction-free writing experience”