LogContext: Change line highlighting to match the hover state (#56811)

* add hover background also to logs with context

* add inherit display
This commit is contained in:
Sven Grossmann 2022-10-13 11:42:40 +02:00 committed by GitHub
parent d957fe01f4
commit efe214a293
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 7 additions and 4 deletions

View File

@ -166,6 +166,7 @@ class UnThemedLogRow extends PureComponent<Props, State> {
const { errorMessage, hasError } = checkLogsError(row);
const logRowBackground = cx(style.logsRow, {
[styles.errorLogRow]: hasError,
[style.contextBackground]: showContext,
});
const processedRow =

View File

@ -44,6 +44,7 @@ const getStyles = (theme: GrafanaTheme2, showContextButton: boolean, isInDashboa
label: rowWithContext;
z-index: 1;
outline: 9999px solid ${outlineColor};
display: inherit;
`,
horizontalScroll: css`
label: verticalScroll;

View File

@ -45,6 +45,9 @@ export const getLogRowStyles = (theme: GrafanaTheme2, logLevel?: LogLevel) => {
font-size: ${theme.typography.bodySmall.fontSize};
width: 100%;
`,
contextBackground: css`
background: ${hoverBgColor};
`,
logsRow: css`
label: logs-row;
width: 100%;
@ -56,6 +59,8 @@ export const getLogRowStyles = (theme: GrafanaTheme2, logLevel?: LogLevel) => {
visibility: visible;
z-index: 1;
}
background: ${hoverBgColor};
}
td:not(.log-row-menu-cell):last-child {
@ -69,10 +74,6 @@ export const getLogRowStyles = (theme: GrafanaTheme2, logLevel?: LogLevel) => {
border-bottom: 1px solid transparent;
height: 100%;
}
&:hover {
background: ${hoverBgColor};
}
`,
logsRowDuplicates: css`
label: logs-row__duplicates;