mirror of
https://github.com/netbox-community/netbox.git
synced 2026-04-01 07:03:22 +02:00
c99d8481b2
Update change data diff styling with CSS custom properties, better color contrast, and consistent borders. Replace btn-group with card-actions for navigation buttons and improve spacing.
51 lines
1.1 KiB
SCSS
51 lines
1.1 KiB
SCSS
@use 'sass:map';
|
|
|
|
// Serialized data from change records
|
|
pre.change-data {
|
|
border-radius: 0;
|
|
padding: 0;
|
|
// Remove card-body padding
|
|
margin-inline: -0.75rem;
|
|
|
|
// Display each line individually for highlighting
|
|
> span {
|
|
display: block;
|
|
padding-inline: map.get($spacers, 2);
|
|
max-width: 100%;
|
|
min-width: fit-content;
|
|
border-left: map.get($spacers, 1) solid transparent;
|
|
|
|
&.added {
|
|
background-color: var(--tblr-green-200);
|
|
border-left-color: var(--tblr-green-darken);
|
|
}
|
|
|
|
&.removed {
|
|
background-color: var(--tblr-red-200);
|
|
border-left-color: var(--tblr-red-darken);
|
|
}
|
|
}
|
|
}
|
|
|
|
// Change data diff w/added & removed data
|
|
pre.change-diff {
|
|
border: var(--tblr-border-width) solid transparent;
|
|
|
|
&.change-added {
|
|
background-color: var(--tblr-green-lt);
|
|
border-color: var(--tblr-green);
|
|
}
|
|
|
|
&.change-removed {
|
|
background-color: var(--tblr-red-lt);
|
|
border-color: var(--tblr-red);
|
|
}
|
|
}
|
|
|
|
// <pre> elements displayed with a border
|
|
pre.block {
|
|
padding: $spacer;
|
|
border: var(--tblr-border-width) solid $border-color;
|
|
border-radius: $border-radius;
|
|
}
|