Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Create reusable sticky navigation bar #41

Open
elainen opened this issue Feb 20, 2020 · 3 comments
Open

Create reusable sticky navigation bar #41

elainen opened this issue Feb 20, 2020 · 3 comments

Comments

@elainen
Copy link
Contributor

elainen commented Feb 20, 2020

Is your feature request related to a problem? Please describe.

We have a sticky nav that we have been recreating for a lot our sites that have the same kind of behaviors:

  • Logo on the left
    • Clickable to Home
  • Navigation items on the right
    • Sometimes a "utility" nav with smaller text on top
  • Sub nav items showing on hover
  • Logo on the left on mobile
  • Hamburger icon on the right
  • Nav tends to be part of the page when its at the top
  • Nav becomes sticky when scrolling past the top fold
  • Nav disappears when scrolling past the top fold
  • Nav reappears when user scrolls back up

Describe the solution you'd like

Let's turn this into a HZ Core component! Retrieve all the current navs that have the same basic behavior from recent projects and create a functional (not design heavy, but design flexible) nav component.

Describe alternatives you've considered

We have so far just copy pasta'd other components from other projects or we've just built it from scratch all over again.

Additional context

Some recent-ish sites that have this kind of nav:
http://2u.com/
https://www.45rockefellerpenthouse.com/
https://open.maryland.gov/
https://organicvalleyingredients.coop/

@lettertwo
Copy link
Contributor

@lettertwo
Copy link
Contributor

There's also a 'scroll up bar' example on the hzcore useScrollDirection hook: https://hz-core.netlify.com/use-scroll-direction#examples

@lettertwo
Copy link
Contributor

#42 could be useful for this

@elainen elainen removed their assignment Jan 6, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants