1
0
mirror of https://github.com/netbox-community/netbox.git synced 2024-05-10 07:54:54 +00:00

Move interface colour logic into SCSS where it belongs

This commit is contained in:
Per von Zweigbergk
2024-01-23 21:33:09 +01:00
parent bf362f4679
commit c93413dc9c
5 changed files with 41 additions and 43 deletions

View File

@@ -835,15 +835,6 @@ table tbody {
}
}
// Expose theme colors as variables. (Useful for dynamic styling of choices etc.)
// Both as opaque colour and translucent (alpha 15%)
:root {
@each $color, $value in $theme-colors {
--nbx-color-#{$color}: #{$value};
--nbx-color-#{$color}-a15: #{rgba($value, 0.15)};
}
}
// Style objects with statuses/roles within a table. As of implementation, used for IP addresses
// assigned to interfaces.
table .table-badge-group {
@@ -1078,4 +1069,41 @@ html {
display: none;
}
}
}
// Apply row colours to interface lists
&[data-netbox-url-name='device_interfaces'] {
tr[data-cable-status=connected] {
background-color: rgba(map.get($theme-colors, "green"), 0.15);
}
tr[data-cable-status=planned] {
background-color: rgba(map.get($theme-colors, "blue"), 0.15);
}
tr[data-cable-status=decommissioning] {
background-color: rgba(map.get($theme-colors, "yellow"), 0.15);
}
tr[data-mark-connected=true] {
background-color: rgba(map.get($theme-colors, "success"), 0.15);
}
tr[data-virtual=true] {
background-color: rgba(map.get($theme-colors, "primary"), 0.15);
}
tr[data-enabled=disabled] {
background-color: rgba(map.get($theme-colors, "danger"), 0.15);
}
// Only show the correct button depending on the cable status
tr[data-cable-status=connected] button.mark-installed {
display: none;
}
tr:not([data-cable-status=connected]) button.mark-planned {
display: none;
}
}
}