qmk / qmk_firmware

Open-source keyboard firmware for Atmel AVR and Arm USB families
https://qmk.fm
GNU General Public License v2.0
17.8k stars 38.15k forks source link

Change hamburger menu placement #2918

Closed skullydazed closed 6 years ago

skullydazed commented 6 years ago

As pointed out on reddit we need to change how the hamburger menu works: https://www.reddit.com/r/olkb/comments/8huf00/qmk_proposed_replacement_for_gitbook_feedback/dyn8qoi/

We're looking for a frontend developer who can either work some CSS magic or write a docsify plugin to make that menu behave more sanely.

aergonaut commented 6 years ago

Looking at the CSS in qmk.css, the hamburger has position: fixed and bottom: 0, which is what sticks it to bottom. Changing to top: 0 instead would stick it to the top, but that leads to the hamburger overlapping the search field:

hamburger overlaps search field when stuck to top

You could shift the search bar down, but that ends up leaving about 40px (I eyeballed) of negative space:

negative space left in sidebar

I thought the negative space would look stranger, but after trying it out, it doesn't really look that weird. So that could be an option.

The CSS for when the sidebar is collapsed seems to just leave a gutter where the hamburger sits, so moving it up to the top doesn't seem to affect the usability of the site in that state.

skullydazed commented 6 years ago

@aergonaut thanks for taking a look! This seems like a good direction to pursue. We should probably create a new CSS file for this so we make it easier on #2917, we currently don't have any CSS files that aren't theme related. Would you like to put a PR together so you get the credit? :D If not I'll dig into this in a couple days to see what I can do.

aergonaut commented 6 years ago

@skullydazed yes, I'd be happy to make a PR. I'll need to read a little about how docsify works, since I've never used it before, but I should be able to get a PR up for you in the next couple of days.