v3.0-beta1 UI tweaks

[jeremystretch]

Proposed Changes

This issue serves as an umbrella for small changes to the desktop UI which don't warrant their own bug reports. Please comment below with any issues you encounter within the UI and we'll add it here.

For the sake of limiting scope, let's focus on issues observed on non-mobile platforms in this thread. Please note any issues with the mobile UI under #6828. Thanks!

• Fix "flashing" from light mode when loading pages with dark mode enabled (@bellwood)
• Duplicate search fields w/same ID throws error in browser dev console (@bellwood)
• Login banner text colors not consistent with light/dark theme (@jeremystretch)
• Sidebar footer disappears after login in Chrome (@michaelklose)
• Sidebar "button" links render incorrectly under Safari (and other browsers?) (@bellwood)
• "Refine search" buttons in global search results not properly spaced (@hoalex)
• Double scrolling inside expanded nav menu (@ndom91)
• Link color inside toasts can be difficult to read (@n0emis)
• Utilization bars with low percentages are hard to read (@nahun)
• Add cable length & type to SVG traces (@Jackbennett)
• Device type images are not scaled to fit available space (@JeffTadashi)
• Remove fade effect when hovering over dropdown items (@bluikko)
• Visually distinguish custom links from built-in buttons (@rodvand)
• Expanding a new menu section should close others (@jeremystretch)

Justification

Clean up the user interface and achieve a greater overall user experience.

[jeremystretch]

The purpose of this thread is to call out specific, reproducible bugs, not to debate the overall design. (Feel free to start a separate thread for that.) Let's please try to stay on topic so that we can focus on knocking out these bugs. Thanks!

[thatmattlove]

Folks, now that all tasks on this issue are completed, I'm closing this out. Please open separate issues for any new issues you discover.

[jeremystretch]

Thanks everyone who participated above for the detailed feedback!

[candlerb]

Is it too late for a new comment? I've only just installed the beta :-)

I note that when you do the following:

• Open any of the left sidebar blocks, e.g. "IPAM"
• Click on one of the links revealed in that block, e.g. "VLAN Groups"

then the sidebar block shrinks back down again as the page refreshes. This makes it a bit more painful than necessary if you just want to browse through all the options one by one.

Would it be possible to leave the panel open? It doesn't consume any real-estate, and the user can always close it manually - or when they click on some other sidebar panel, that closes the first anyway.

[Jackbennett]

The current https://beta-demo.netbox.dev/ doesn't have that behaviour. you want your own build or wait for a newer beta release. #6800 (comment) comment is newer than the github listed beta release. I guess the beta demo app is tracking a branch head.

[jeremystretch]

Correct, the public demo is rebuilt nightly from the feature branch.

While we are still taking bug reports for the beta, as noted above please open a new issue for each so that they can be tracked appropriately.