CSS dev build is inconsistent with deploy build
Everything looks good and works fine in my react app dev build, but some css styles aren't being correctly applied to the production build i host on my github pages through gh-pages npm package (through this guide https://github.com/gitname/react-gh-pages)
this is my hosted app: https://arthwr.github.io/little-lemon-app/
The problem with mobile version hamburger button.
It works like this: it applies .openMenu class to 2 elements (parent div and nav element) to apply some css styles.
However menu that is supposed to be hidden on left , is seen and by the look of dev tools css styles for default behaviour aren't being loaded correctly or not switching for some reason.
Class is added and changed correctly though.
I attached 2 screenshots so its seen how i want it to look like and how it looks and works correctly on my dev version.
I also attached CSS snapshot for the elements that have this problem :
.navContainer
.navContainer.openMenu
.nav
.nav.openMenu
this is my hosted app: https://arthwr.github.io/little-lemon-app/
The problem with mobile version hamburger button.
It works like this: it applies .openMenu class to 2 elements (parent div and nav element) to apply some css styles.
However menu that is supposed to be hidden on left , is seen and by the look of dev tools css styles for default behaviour aren't being loaded correctly or not switching for some reason.
Class is added and changed correctly though.
I attached 2 screenshots so its seen how i want it to look like and how it looks and works correctly on my dev version.
I also attached CSS snapshot for the elements that have this problem :
.navContainer
.navContainer.openMenu
.nav
.nav.openMenu
Experience Culinary Magic at Little Lemon Restaurant
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Was this page helpful?
