root
/
grafana
mirror of https://github.com/grafana/grafana.git
1
0
Fork 0
Code Issues Actions 142 Packages Projects Releases Wiki Activity

Logs: Fix spacing between the logs volume and logs panel (#111952) 

Logs: fix spacing between volume and logs panel
This commit is contained in:
Gareth 2025-10-03 15:06:25 +08:00 committed by GitHub
parent 7ed46fd321
commit add8beefad
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 28 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/app/features/explore/Explore.tsx
View File

@ -77,7 +77,7 @@ const getStyles = (theme: GrafanaTheme2) => {
label: 'exploreMain', label: 'exploreMain',
// Is needed for some transition animations to work. // Is needed for some transition animations to work.
position: 'relative', position: 'relative',
marginTop: '21px', marginTop: theme.spacing(3),
display: 'flex', display: 'flex',
flexDirection: 'column', flexDirection: 'column',
gap: theme.spacing(1), gap: theme.spacing(1),

49
public/app/features/explore/Logs/Logs.tsx
View File

@ -799,28 +799,30 @@ const UnthemedLogs: React.FunctionComponent<Props> = (props: Props) => {
onClickHideField={hideField} onClickHideField={hideField}
/> />
)} )}
<PanelChrome <div className={styles.logsVolumePanel}>
title={t('explore.unthemed-logs.title-logs-volume', 'Logs volume')} <PanelChrome
collapsible title={t('explore.unthemed-logs.title-logs-volume', 'Logs volume')}
collapsed={!logsVolumeEnabled} collapsible
onToggleCollapse={onToggleLogsVolumeCollapse} collapsed={!logsVolumeEnabled}
> onToggleCollapse={onToggleLogsVolumeCollapse}
{logsVolumeEnabled && ( >
<LogsVolumePanelList {logsVolumeEnabled && (
toggleLegendRef={toggleLegendRef} <LogsVolumePanelList
absoluteRange={absoluteRange} toggleLegendRef={toggleLegendRef}
width={width} absoluteRange={absoluteRange}
logsVolumeData={logsVolumeData} width={width}
onUpdateTimeRange={onChangeTime} logsVolumeData={logsVolumeData}
timeZone={timeZone} onUpdateTimeRange={onChangeTime}
splitOpen={splitOpen} timeZone={timeZone}
onLoadLogsVolume={loadLogsVolumeData} splitOpen={splitOpen}
onDisplayedSeriesChanged={onDisplayedSeriesChanged} onLoadLogsVolume={loadLogsVolumeData}
eventBus={logsVolumeEventBus} onDisplayedSeriesChanged={onDisplayedSeriesChanged}
onClose={() => onToggleLogsVolumeCollapse(true)} eventBus={logsVolumeEventBus}
/> onClose={() => onToggleLogsVolumeCollapse(true)}
)} />
</PanelChrome> )}
</PanelChrome>
</div>
<PanelChrome <PanelChrome
titleItems={[ titleItems={[
config.featureToggles.logsExploreTableVisualisation ? ( config.featureToggles.logsExploreTableVisualisation ? (
@ -1278,6 +1280,9 @@ const getStyles = (theme: GrafanaTheme2, wrapLogMessage: boolean, tableHeight: n
overflow: 'visible', overflow: 'visible',
...(config.featureToggles.logsInfiniteScrolling && { marginBottom: '0px' }), ...(config.featureToggles.logsInfiniteScrolling && { marginBottom: '0px' }),
}), }),
logsVolumePanel: css({
marginBottom: theme.spacing(1.5),
}),
}; };
}; };