v3.0 nav menu tweaks

[jeremystretch]

• Reduce left spacing of nav menu items
• Swap group/link colors
• Highlight nav links on hover
• Increase nav link text size
• Increase width of sidebar profile button under mobile view

[thatmattlove]

A couple of issues I see:

When "hidden", the icons aren't aligned:

We need to differentiate the active color vs the hover color, for example (Circuit Types is hovered, but Circuits is active):

I'm not sure I like the child link color being blue, but I'm also not sure I have a better idea :)

In dark mode, I think we need to make the nav link color not white, not sure exactly what though.

Maybe the same CSS/SCSS variable as the light mode color, which should be more muted in dark mode, but maybe something custom.

Let me know if you want me to take a swing at these items, or if you want to.

[thatmattlove]

One other thing: this may or may not have been intentional, but on smaller screens, the profile button is now full-width:

I don't necessarily see this as a bad thing, but wanted to point it out.

[jeremystretch]

When "hidden", the icons aren't aligned:

Thanks, I didn't notice that. Can we just make the NetBox icon the same size as the others? That would look nicer overall I think.

We need to differentiate the active color vs the hover color, for example (Circuit Types is hovered, but Circuits is active):

IMO this isn't really necessary but I'm open to suggestions.

One other thing: this may or may not have been intentional, but on smaller screens, the profile button is now full-width

Yep, that was intentional. Looks more natural IMO than a partial-width button.

[jeremystretch]

I've fixed the icon alignment. Is there anything else we need to do as part of this? Happy to keep experimenting with link & hover colors, but would like to merge this before conflicts start popping up.