Community forum for knowledge and support

Updated 9 months ago

The best practice for having a dark-themed and a light-theme navbar component

At a glance

The community members are discussing the best practice for having a dark-themed and a light-themed navbar component. The original poster is considering whether to use two different components or try to manage one version of the navbar. Some community members suggest using a toggle option or a style guide to handle the light and dark variations. The discussion focuses on finding a way to manage the different navbar versions without having to create multiple components.

What’s the best practice for having a dark-themed and a light-theme navbar component? Two different components?
The navbar would have two different logos (one light one dark) and the nav link text would be white in one version and black on the other

M
V
7 comments

Toggle Option - in Nav Bar - or in a Banner above Nav Nar.

Light a Horizontal (vertical) Light Switch!

If you want help implementing this for your site - let me know - my team and I are well versed in such amazing boundary-pushing as this.

Hi! Thanks for your response. If I understood correctly, I’m actually not looking to allow the user to toggle, I just need a light navbar version to look good against a dark background, and a dark navbar version to look good against pages with a light background

Trying to figure out how to only manage one version of the navbar instead of having multiple components

Id use the style guide for that -- did you already fine tune your cloned relume 2.1 style guide?

then add to it - for specific use cases like your want to have alternative nav bar options - as well as light and dark variations overall!?

I did a little bit already but I don’t see a nav in there?

There is no nav in there -- that is why I said, you could create space and an area for Nav Bar's - if you wanted to - inside the style guide -- just create a space for a new field - and make it happen with as much plug and play common sense and intuition as you can!

Here to help, if you need it!

Oh I gotcha. That makes sense. THank you!

Add a reply
Sign up and join the conversation on Slack