Navbar fix for FireFox - #179

Finally!

Sorry about this, but the stylelint test not show error to me..

Thanks Totomlnc! Best regards.

@Phreshhh there is a small problem, the navbar seems to take too much height when not opened. This is happening on Chrome, Firefox and Safari, other than that everything works well.

Before:

After:

After investigation, this is due to the div.collapsible element which is taking the space, it seems to be due to the margin-top: 50px.

Also you can notice the burger menu button is missing the border.

@Phreshhh next step is to add back the border on the burger button.

Seems good for me! Waiting for @rhyneav review, don't worry this review can take some days. It will be merged by rhyneav. Thanks again for contributing to PaperCSS.

All feature bugs cleared. Thanks me too for the framework ;)

Hey @Phreshhh thank you for the PR! What exactly was this fixing in Firefox?

I also saw that you had changed the markup from a button to a label. This is fine since it fixes the bug, but I do think that we should keep the button selector in the LESS as well. This way it is still backwards compatible with anyone using the navigation with abutton. What do you think?

EDIT: Oops, forgot we use SCSS now...
EDIT 2: It fixes #173... oops!

Hi @rhyneav !

I thinked about it when i changed, but i did't see other solution for fix it then change the markup. :(

I think either-or.

I think you can leave both with maybe a comment about why both are there. It's not the prettiest thing, but is safe until we launch the next major version.

.collapsible > button, // Leaving for backwards compatibility. See docs for proper usage
.collapsible > label {
  // those pretty styles
}

I put back the button styles, now works with old layout also same as before.
The old (with button) is not works FireFox but works in Edge and Chrome and the new (without button) works in all browser.

Thank you for updating!