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

Fixed Gauge being cropped when resizing panel

Browse Source 
Enabled import of SASS viariables into TS
This commit is contained in:
Dominik Prokop 2019-01-14 09:45:55 +01:00
parent 9d4354b7c9
commit b3b1c21d77
4 changed files with 27 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
public/app/plugins/panel/gauge/GaugePanel.tsx
View File

@ -3,6 +3,7 @@ import { GaugeOptions, PanelProps, NullValueMode } from '@grafana/ui';
import { getTimeSeriesVMs } from 'app/viz/state/timeSeries'; import { getTimeSeriesVMs } from 'app/viz/state/timeSeries';
import Gauge from 'app/viz/Gauge'; import Gauge from 'app/viz/Gauge';
import variables from 'sass/_variables.scss';
interface Props extends PanelProps<GaugeOptions> {} interface Props extends PanelProps<GaugeOptions> {}
@ -15,6 +16,13 @@ export class GaugePanel extends PureComponent<Props> {
nullValueMode: NullValueMode.Ignore, nullValueMode: NullValueMode.Ignore,
}); });
return <Gauge timeSeries={vmSeries} {...this.props.options} width={width} height={height} />; return (
<Gauge
timeSeries={vmSeries}
{...this.props.options}
width={width - 2 * variables.panelHorizontalPadding}
height={height - variables.panelVerticalPadding}
/>
);
} }
} }

9
public/sass/_variables.scss
View File

@ -189,7 +189,9 @@ $side-menu-width: 60px;
// dashboard // dashboard
$panel-margin: 10px; $panel-margin: 10px;
$dashboard-padding: $panel-margin * 2; $dashboard-padding: $panel-margin * 2;
$panel-padding: 0px 10px 5px 10px; $panel-horizontal-padding: 10;
$panel-vertical-padding: 5;
$panel-padding: 0px $panel-horizontal-padding+0px $panel-vertical-padding+0px $panel-horizontal-padding+0px;
// tabs // tabs
$tabs-padding: 10px 15px 9px; $tabs-padding: 10px 15px 9px;
@ -202,3 +204,8 @@ $external-services: (
oauth: (bgColor: #262628, borderColor: #393939, icon: '') oauth: (bgColor: #262628, borderColor: #393939, icon: '')
) )
!default; !default;
:export {
panelHorizontalPadding: $panel-horizontal-padding;
panelVerticalPadding: $panel-vertical-padding;
}

8
public/sass/_variables.scss.d.ts vendored Normal file
View File

@ -0,0 +1,8 @@
export interface GrafanaVariables {
'panelHorizontalPadding': number;
'panelVerticalPadding': number;
}
declare const variables: GrafanaVariables;
export default variables;

3
tsconfig.json
View File

@ -28,7 +28,8 @@
"pretty": true, "pretty": true,
"typeRoots": ["node_modules/@types", "types"], "typeRoots": ["node_modules/@types", "types"],
"paths": { "paths": {
"app": ["app"] "app": ["app"],
"sass": ["sass"]
} }
}, },
"include": ["public/app/**/*.ts", "public/app/**/*.tsx", "public/test/**/*.ts"] "include": ["public/app/**/*.ts", "public/app/**/*.tsx", "public/test/**/*.ts"]