IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Panels: allow interaction in corners when no title exists (#37169)

Browse Source
This commit is contained in:
Ryan McKinley 2021-07-26 10:19:07 -07:00 committed by GitHub
parent 8c8d2fe08b
commit be4b753aa0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 17 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
public/app/features/dashboard/dashgrid/PanelChrome.tsx
View File

@ -403,12 +403,7 @@ export class PanelChrome extends Component<Props, State> {
hasOverlayHeader() { hasOverlayHeader() {
const { panel } = this.props; const { panel } = this.props;
const { errorMessage, data } = this.state; const { data } = this.state;
// always show normal header if we have an error message
if (errorMessage) {
return false;
}
// always show normal header if we have time override // always show normal header if we have time override
if (data.request && data.request.timeInfo) { if (data.request && data.request.timeInfo) {

7
public/app/features/dashboard/dashgrid/PanelChromeAngular.tsx
View File

@ -173,12 +173,7 @@ export class PanelChromeAngularUnconnected extends PureComponent<Props, State> {
hasOverlayHeader() { hasOverlayHeader() {
const { panel } = this.props; const { panel } = this.props;
const { errorMessage, data } = this.state; const { data } = this.state;
// always show normal header if we have an error message
if (errorMessage) {
return false;
}
// always show normal header if we have time override // always show normal header if we have time override
if (data.request && data.request.timeInfo) { if (data.request && data.request.timeInfo) {

16
public/app/features/dashboard/dashgrid/PanelHeader/PanelHeader.tsx
View File

@ -35,15 +35,15 @@ export const PanelHeader: FC<Props> = ({ panel, error, isViewing, isEditing, dat
return ( return (
<> <>
<PanelHeaderLoadingIndicator state={data.state} onClick={onCancelQuery} /> <PanelHeaderLoadingIndicator state={data.state} onClick={onCancelQuery} />
<PanelHeaderCorner
panel={panel}
title={panel.title}
description={panel.description}
scopedVars={panel.scopedVars}
links={getPanelLinksSupplier(panel)}
error={error}
/>
<div className={className}> <div className={className}>
<PanelHeaderCorner
panel={panel}
title={panel.title}
description={panel.description}
scopedVars={panel.scopedVars}
links={getPanelLinksSupplier(panel)}
error={error}
/>
<PanelHeaderMenuTrigger aria-label={selectors.components.Panels.Panel.title(title)}> <PanelHeaderMenuTrigger aria-label={selectors.components.Panels.Panel.title(title)}>
{({ closeMenu, panelMenuOpen }) => { {({ closeMenu, panelMenuOpen }) => {
return ( return (

8
public/sass/components/_panel_header.scss
View File

@ -10,8 +10,14 @@ $panel-header-no-title-zindex: 1;
.panel-container--no-title { .panel-container--no-title {
.panel-header { .panel-header {
position: absolute; position: absolute;
width: 100%; left: min(50px, 10%); // allows space for interaction in the corders
right: min(50px, 10%);
z-index: $panel-header-z-index; z-index: $panel-header-z-index;
&:hover {
left: 0;
right: 0;
}
} }
.panel-content { .panel-content {
height: 100%; height: 100%;