datascijedi / website

https://datascijedi.org
Creative Commons Attribution Share Alike 4.0 International
5 stars 2 forks source link

Fix for changing nav height issue #81

Closed ravicodelabs closed 1 year ago

ravicodelabs commented 1 year ago

Keeps the nav height consistent across web pages by hard coding its value. Previously, the nav height increased on the JEDI Corner page, as discussed in issue #30.

A min-width of 992 is used since the hard coded nav does not work well with the drop down style nav, and by inspection seems to appear when the screen width is 991px or less. This works since the nav height is consistent when the drop down style nav is present anyway.

Edit: Currently this approach works locally, but does not work in the deploy preview. Edit: This approach is working on a desktop browser, but the nav on a mobile browser becomes buggy currently.

netlify[bot] commented 1 year ago

Deploy Preview for datascijedi ready!

Name Link
Latest commit 786e452172bf9e01dd3af9d45473160e72cf3e83
Latest deploy log https://app.netlify.com/sites/datascijedi/deploys/6420e5945ffa0300085c30fa
Deploy Preview https://deploy-preview-81--datascijedi.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

ravicodelabs commented 1 year ago

Found a new solution that uses a CSS !important rule instead of the previous hard coded solution. This is probably better since the hard coded nav height had a dependency on the screen width threshold at which the nav becomes a drop down.

Will push the new approach shortly.

ravicodelabs commented 1 year ago

New solution added in PR #82, which supersedes the hard coded approach here.