IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-11 16:15:42 -06:00
Code Issues Packages Projects Releases Wiki Activity

Minor react graph panel refactorings and fixes

Browse Source
This commit is contained in:
Torkel Ödegaard 2018-12-17 15:38:51 +01:00
parent 0fd92ef6fb
commit 0fe452ec26
2 changed files with 11 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/app/core/components/Switch/Switch.tsx
View File

@ -32,7 +32,7 @@ export class Switch extends PureComponent<Props, State> {
const switchClassName = `gf-form-switch ${switchClass} ${transparent ? 'gf-form-switch--transparent' : ''}`;
return (
<label htmlFor={labelId} className="gf-form-switch-container">
<label htmlFor={labelId} className="gf-form gf-form-switch-container">
{label && <div className={labelClassName}>{label}</div>}
<div className={switchClassName}>
<input id={labelId} type="checkbox" checked={checked} onChange={this.internalOnChange} />

29
public/app/plugins/panel/graph2/GraphOptions.tsx
View File

@ -27,26 +27,17 @@ export class GraphOptions extends PureComponent<PanelOptionsProps<Options>> {
return (
<div>
<div className="form-option-box">
<div className="form-option-box__header">Display Options</div>
<div className="section gf-form-group">
<h5 className="section-heading">Draw Modes</h5>
<Switch label="Lines" labelClass="width-5" checked={showLines} onChange={this.onToggleLines} />
<Switch label="Bars" labelClass="width-5" checked={showBars} onChange={this.onToggleBars} />
<Switch label="Points" labelClass="width-5" checked={showPoints} onChange={this.onTogglePoints} />
</div>
<div className="section gf-form-group">
<h5 className="section-heading">Test Options</h5>
<Switch label="Lines" labelClass="width-5" checked={showLines} onChange={this.onToggleLines} />
<Switch label="Bars" labelClass="width-5" checked={showBars} onChange={this.onToggleBars} />
<Switch label="Points" labelClass="width-5" checked={showPoints} onChange={this.onTogglePoints} />
</div>
<div className="section gf-form-group">
<h5 className="section-heading">Draw Modes</h5>
<Switch label="Lines" labelClass="width-5" checked={showLines} onChange={this.onToggleLines} />
<Switch label="Bars" labelClass="width-5" checked={showBars} onChange={this.onToggleBars} />
<Switch label="Points" labelClass="width-5" checked={showPoints} onChange={this.onTogglePoints} />
</div>
<div className="form-option-box">
<div className="form-option-box__header">Axes</div>
</div>
<div className="form-option-box">
<div className="form-option-box__header">Thresholds</div>
<div className="section gf-form-group">
<h5 className="section-heading">Test Options</h5>
<Switch label="Lines" labelClass="width-5" checked={showLines} onChange={this.onToggleLines} />
<Switch label="Bars" labelClass="width-5" checked={showBars} onChange={this.onToggleBars} />
<Switch label="Points" labelClass="width-5" checked={showPoints} onChange={this.onTogglePoints} />
</div>
</div>
);