diff --git a/src/panel-triggers/components/EventTag.tsx b/src/panel-triggers/components/EventTag.tsx index 30459bb..309ecc6 100644 --- a/src/panel-triggers/components/EventTag.tsx +++ b/src/panel-triggers/components/EventTag.tsx @@ -86,17 +86,18 @@ function djb2(str) { interface EventTagProps { tag: ZBXTag; + highlight?: boolean; } function EventTag(props: EventTagProps) { - const { tag } = props; + const { tag, highlight } = props; const tagColor = getTagColorsFromName(tag.tag); const style: React.CSSProperties = { background: tagColor.color, borderColor: tagColor.borderColor, }; return ( - + {tag.tag}: {tag.value} ); diff --git a/src/panel-triggers/components/Problems.tsx b/src/panel-triggers/components/Problems.tsx index 9c493a2..8e58353 100644 --- a/src/panel-triggers/components/Problems.tsx +++ b/src/panel-triggers/components/Problems.tsx @@ -322,7 +322,9 @@ class ProblemDetails extends PureComponent { }
- {problem.tags && problem.tags.map(tag => )} + {problem.tags && problem.tags.map(tag => + ) + }
{problem.acknowledges && !wideLayout &&
diff --git a/src/sass/_panel-problems.scss b/src/sass/_panel-problems.scss index 4fe0851..718c828 100644 --- a/src/sass/_panel-problems.scss +++ b/src/sass/_panel-problems.scss @@ -145,6 +145,10 @@ } .label-tag, .zbx-tag { margin-right: 0.6rem; + + &.highlighted { + box-shadow: 0 0 10px $orange; + } } } @@ -176,7 +180,7 @@ .problem-details { position: relative; - flex: 10 0 auto; + flex: 10 1 auto; padding: 0.5rem 1rem 0.5rem 1.2rem; display: flex; flex-direction: column; @@ -279,7 +283,7 @@ .problem-details-right { - // flex: 1 0 auto; + flex: 0 0 auto; padding: 0.5rem 2rem; // background: $dark-4; color: $text-color-muted;