mirror of
https://github.com/grafana/grafana.git
synced 2025-08-01 04:01:49 +08:00
LogsPanel: Remove top margin (#69847)
* LogsPanel: Remove top margin * Fixing
This commit is contained in:
@ -1,4 +1,4 @@
|
|||||||
import { css } from '@emotion/css';
|
import { css, cx } from '@emotion/css';
|
||||||
import React, { useCallback, useMemo, useRef, useLayoutEffect, useState } from 'react';
|
import React, { useCallback, useMemo, useRef, useLayoutEffect, useState } from 'react';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
@ -42,7 +42,7 @@ export const LogsPanel = ({
|
|||||||
id,
|
id,
|
||||||
}: LogsPanelProps) => {
|
}: LogsPanelProps) => {
|
||||||
const isAscending = sortOrder === LogsSortOrder.Ascending;
|
const isAscending = sortOrder === LogsSortOrder.Ascending;
|
||||||
const style = useStyles2(getStyles(title, isAscending));
|
const style = useStyles2(getStyles);
|
||||||
const [scrollTop, setScrollTop] = useState(0);
|
const [scrollTop, setScrollTop] = useState(0);
|
||||||
const logsContainerRef = useRef<HTMLDivElement>(null);
|
const logsContainerRef = useRef<HTMLDivElement>(null);
|
||||||
|
|
||||||
@ -95,7 +95,7 @@ export const LogsPanel = ({
|
|||||||
}
|
}
|
||||||
|
|
||||||
const renderCommonLabels = () => (
|
const renderCommonLabels = () => (
|
||||||
<div className={style.labelContainer}>
|
<div className={cx(style.labelContainer, isAscending && style.labelContainerAscending)}>
|
||||||
<span className={style.label}>Common labels:</span>
|
<span className={style.label}>Common labels:</span>
|
||||||
<LogLabels labels={commonLabels ? (commonLabels.value as Labels) : { labels: '(no common labels)' }} />
|
<LogLabels labels={commonLabels ? (commonLabels.value as Labels) : { labels: '(no common labels)' }} />
|
||||||
</div>
|
</div>
|
||||||
@ -127,20 +127,21 @@ export const LogsPanel = ({
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const getStyles = (title: string, isAscending: boolean) => (theme: GrafanaTheme2) => ({
|
const getStyles = (theme: GrafanaTheme2) => ({
|
||||||
container: css`
|
container: css({
|
||||||
margin-bottom: ${theme.spacing(1.5)};
|
marginBottom: theme.spacing(1.5),
|
||||||
//We can remove this hot-fix when we fix panel menu with no title overflowing top of all panels
|
}),
|
||||||
margin-top: ${theme.spacing(!title ? 2.5 : 0)};
|
labelContainer: css({
|
||||||
`,
|
margin: theme.spacing(0, 0, 0.5, 0.5),
|
||||||
labelContainer: css`
|
display: 'flex',
|
||||||
margin: ${isAscending ? theme.spacing(0.5, 0, 0.5, 0) : theme.spacing(0, 0, 0.5, 0.5)};
|
alignItems: 'center',
|
||||||
display: flex;
|
}),
|
||||||
align-items: center;
|
labelContainerAscending: css({
|
||||||
`,
|
margin: theme.spacing(0.5, 0, 0.5, 0),
|
||||||
label: css`
|
}),
|
||||||
margin-right: ${theme.spacing(0.5)};
|
label: css({
|
||||||
font-size: ${theme.typography.bodySmall.fontSize};
|
marginRight: theme.spacing(0.5),
|
||||||
font-weight: ${theme.typography.fontWeightMedium};
|
fontSize: theme.typography.bodySmall.fontSize,
|
||||||
`,
|
fontWeight: theme.typography.fontWeightMedium,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
Reference in New Issue
Block a user