timlrx / tailwind-nextjs-starter-blog

This is a Next.js, Tailwind CSS blogging starter template. Comes out of the box configured with the latest technologies to make technical writing a breeze. Easily configurable and customizable. Perfect as a replacement to existing Jekyll and Hugo individual blogs.
https://tailwind-nextjs-starter-blog.vercel.app/
MIT License
8.64k stars 2.01k forks source link

[Feature request] navbar dropdown #867

Open tddschn opened 7 months ago

tddschn commented 7 months ago

Is your feature request related to a problem? Please describe. A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

I want to add more entries to the nav bar but don't want to create too much visual cluster. A drop down would be nice, as it allows me to group multiple navbar links together, taking less space by default.

Describe the solution you'd like A clear and concise description of what you want to happen.

const headerNavLinks = [
  { href: '/', title: 'Home' },
  { href: '/blog', title: 'Blog' },
  { href: '/tags', title: 'Tags' },
  { title: 'Dropdown 1', children: {
href: '/link1', title: 'title 1',
href: '/link2', title: 'title 2',
} // this becomes a dropdown navbar item
]

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

Additional context Add any other context or screenshots about the feature request here.

timlrx commented 5 months ago

I don't mind supporting such a feature. To avoid creating too much clutter, I think just a one level menu would work and it should display well on mobile as well.

If anyone is interesting in contributing a pull request on this item, let me know, thanks!

pratikkabade commented 5 months ago

@timlrx I'd like to contribute, Would it be okay if I take on this one?

timlrx commented 5 months ago

@timlrx I'd like to contribute, Would it be okay if I take on this one?

Sure! Take a look at the recently updated ThemeSwitch component. It contains a menu implementation using @headlessui/react. Try to follow a similar approach for consistency, thanks!

pratikkabade commented 5 months ago

Exactly what I was planning on doing!