Logs panel: Fix spacing when log details disabled (#87431)

* Logs panel: Fix spacing when log details disabled

* Fix error spacing
This commit is contained in:
Ivana Huckova 2024-05-07 14:27:44 +02:00 committed by GitHub
parent a597300027
commit 12a87c0899
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 14 additions and 5 deletions

View File

@ -253,18 +253,23 @@ class UnThemedLogRow extends PureComponent<Props, State> {
{processedRow.duplicates && processedRow.duplicates > 0 ? `${processedRow.duplicates + 1}x` : null}
</td>
)}
<td className={hasError ? '' : `${levelStyles.logsRowLevelColor} ${styles.logsRowLevel}`}>
<td
className={hasError ? styles.logsRowWithError : `${levelStyles.logsRowLevelColor} ${styles.logsRowLevel}`}
>
{hasError && (
<Tooltip content={`Error: ${errorMessage}`} placement="right" theme="error">
<Icon className={styles.logIconError} name="exclamation-triangle" size="xs" />
</Tooltip>
)}
</td>
{enableLogDetails && (
<td title={showDetails ? 'Hide log details' : 'See log details'} className={styles.logsRowToggleDetails}>
<td
title={enableLogDetails ? (showDetails ? 'Hide log details' : 'See log details') : ''}
className={enableLogDetails ? styles.logsRowToggleDetails : ''}
>
{enableLogDetails && (
<Icon className={styles.topVerticalAlign} name={showDetails ? 'angle-down' : 'angle-right'} />
</td>
)}
)}
</td>
{showTime && <td className={styles.logsRowLocalTime}>{this.renderTimeStamp(row.timeEpochMs)}</td>}
{showLabels && processedRow.uniqueLabels && (
<td className={styles.logsRowLabels}>

View File

@ -58,6 +58,10 @@ export const getLogRowStyles = memoizeOne((theme: GrafanaTheme2) => {
left: ${theme.spacing(0.5)};
}
`,
// Compared to logsRowLevel we need to make error logs wider to accommodate the icon
logsRowWithError: css({
maxWidth: `${theme.spacing(1.5)}`,
}),
logsRowMatchHighLight: css`
label: logs-row__match-highlight;
background: inherit;