starred/netbox
1
0
Fork 0
mirror of https://github.com/netbox-community/netbox.git synced 2026-01-11 21:10:29 +01:00
Code Issues 273 Packages Projects Releases 10 Wiki Activity

Feature Request: Keep background color on connected interfaces for instant recognition #1064

New Issue
Closed
opened 2025-12-29 16:28:27 +01:00 by adam · 6 comments
adam commented 2025-12-29 16:28:27 +01:00
Owner
Copy Link

Originally created by @traveler3468 on GitHub (Jun 28, 2017).

I was thinking that when you connected an interface the background color would stay green. When the page is reloaded the green color goes away. If you add this code to the interface.html file it will keep the green color on the connected interfaces. So when you load a device page page you can just glance at the page without having to read anything and see which interfaces have something connected(Green), which have planned connections (Blue) and which are open interfaces (White)

what it currently is:
<tr class="interface{% if iface.connection and not iface.connection.connection_status %} info{% endif %}">

What I changed it to to show the green for connected interfaces:
<tr class="interface{% if iface.connection and iface.connection.connection_status %} success{% endif %}{% if iface.connection and not iface.connection.connection_status %} info{% endif %}">

Originally created by @traveler3468 on GitHub (Jun 28, 2017). I was thinking that when you connected an interface the background color would stay green. When the page is reloaded the green color goes away. If you add this code to the interface.html file it will keep the green color on the connected interfaces. So when you load a device page page you can just glance at the page without having to read anything and see which interfaces have something connected(Green), which have planned connections (Blue) and which are open interfaces (White) what it currently is: `<tr class="interface{% if iface.connection and not iface.connection.connection_status %} info{% endif %}">` What I changed it to to show the green for connected interfaces: `<tr class="interface{% if iface.connection and iface.connection.connection_status %} success{% endif %}{% if iface.connection and not iface.connection.connection_status %} info{% endif %}">`
adam added the type: feature label 2025-12-29 16:28:27 +01:00
adam closed this issue 2025-12-29 16:28:27 +01:00
adam commented 2025-12-29 16:28:28 +01:00
Author
Owner
Copy Link

@cslingerland commented on GitHub (Jun 28, 2017):

This would be awesome!

@cslingerland commented on GitHub (Jun 28, 2017): This would be awesome!
adam commented 2025-12-29 16:28:28 +01:00
Author
Owner
Copy Link

@bellwood commented on GitHub (Jun 28, 2017):

@traveler3468 would this styling assertion be valuable elsewhere, power, etc?

UI consistency is key =)

@jeremystretch if you're open to PR's on this one I'd be glad to help - just want to make sure we're on the same page for where this would be applicable.

@bellwood commented on GitHub (Jun 28, 2017): @traveler3468 would this styling assertion be valuable elsewhere, power, etc? UI consistency is key =) @jeremystretch if you're open to PR's on this one I'd be glad to help - just want to make sure we're on the same page for where this would be applicable.
adam commented 2025-12-29 16:28:28 +01:00
Author
Owner
Copy Link

@traveler3468 commented on GitHub (Jun 28, 2017):

@bellwood My thought here is that any easily recognizable information is better for users than having to look further into something if its not necessary. Obviously if you're looking for more specific information then you are going to look harder for it. I think that if this kind of styling could be applicable anywhere where that kind of "easy to see" differentiation would be helpful.

@traveler3468 commented on GitHub (Jun 28, 2017): @bellwood My thought here is that any easily recognizable information is better for users than having to look further into something if its not necessary. Obviously if you're looking for more specific information then you are going to look harder for it. I think that if this kind of styling could be applicable anywhere where that kind of "easy to see" differentiation would be helpful.
adam commented 2025-12-29 16:28:28 +01:00
Author
Owner
Copy Link

@Zorlin commented on GitHub (Jun 29, 2017):

Massive +1, this could be a huge improvement.

@Zorlin commented on GitHub (Jun 29, 2017): Massive +1, this could be a huge improvement.
adam commented 2025-12-29 16:28:28 +01:00
Author
Owner
Copy Link

@jeremystretch commented on GitHub (Jun 29, 2017):

To be clear, you just want to see connected interfaces always highlighted in green? And keep the blue highlighting for those in the "planned" state?

@jeremystretch commented on GitHub (Jun 29, 2017): To be clear, you just want to see connected interfaces always highlighted in green? And keep the blue highlighting for those in the "planned" state?
adam commented 2025-12-29 16:28:28 +01:00
Author
Owner
Copy Link

@traveler3468 commented on GitHub (Jun 29, 2017):

Correct. That way when looking at a device page it is easily recognizable which interfaces are free(nothing connected or planned) and which interfaces either A: Have something connected and, B: Have a planned connection.

@traveler3468 commented on GitHub (Jun 29, 2017): Correct. That way when looking at a device page it is easily recognizable which interfaces are free(nothing connected or planned) and which interfaces either A: Have something connected and, B: Have a planned connection.
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
beta
breaking change
complexity: high
complexity: low
complexity: medium
needs milestone
netbox
pending closure
plugin candidate
pull-request
Mirrored from GitHub Pull Request
 severity: high
severity: low
severity: medium
status: accepted
status: backlog
status: blocked
status: duplicate
status: needs owner
status: needs triage
status: revisions needed
status: under review
topic: GraphQL
topic: Internationalization
topic: OpenAPI
topic: UI/UX
topic: cabling
topic: event rules
topic: htmx navigation
topic: industrialization
topic: migrations
topic: plugins
topic: scripts
topic: templating
topic: testing
type: bug
type: deprecation
type: documentation
type: feature
type: housekeeping
type: translation
No Label type: feature
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
adam
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/netbox#1064
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?