LeNPaul / Millennial

A minimalist Jekyll theme for running a blog or publication powered by Jekyll and GitHub Pages
https://lenpaul.github.io/Millennial/
MIT License
436 stars 912 forks source link

No header display when exactly at $container-width #81

Open kyletimmermans opened 9 months ago

kyletimmermans commented 9 months ago

Thank you for creating Millennial, I’ve been using it for a few years now!

I noticed that when the screen width is exactly 1100px wide ($container-width), the header will not display the menu links, nor the dropdown menu.

This is due to 2 conflicting CSS media queries within _sass/_header.scss at:

https://github.com/LeNPaul/Millennial/blob/38541ba61fedaf07ef1e43d08f7ac6b893077017/_sass/_header.scss#L43 https://github.com/LeNPaul/Millennial/blob/38541ba61fedaf07ef1e43d08f7ac6b893077017/_sass/_header.scss#L51

The issue is that the logic of both queries is inclusive, so when the screen width is exactly equal to $container-width, both queries are trying to add their attributes.

The fix will make it so that when the screen width is exactly $container-width, the dropdown menu will show.