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

added header section to legacy tabs

Browse Source
This commit is contained in:
Torkel Ödegaard 2018-11-20 11:06:36 +01:00
parent 7f46b75330
commit 0575307786
3 changed files with 26 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
public/app/features/dashboard/dashgrid/VisualizationTab.tsx
View File

@ -81,7 +81,14 @@ export class VisualizationTab extends PureComponent<Props> {
let template = '';
for (let i = 0; i < panelCtrl.editorTabs.length; i++) {
template += '<panel-editor-tab editor-tab="ctrl.editorTabs[' + i + ']" ctrl="ctrl"></panel-editor-tab>';
template += `
<div class="form-section" ng-cloak>
<div class="form-section__header">{{ctrl.editorTabs[${i}].title}}</div>
<div class="form-section__body">
<panel-editor-tab editor-tab="ctrl.editorTabs[${i}]" ctrl="ctrl"></panel-editor-tab>
</div>
</div>
`;
}
const loader = getAngularLoader();

6
public/app/plugins/panel/graph/module.ts
View File

@ -135,9 +135,9 @@ class GraphCtrl extends MetricsPanelCtrl {
}
onInitEditMode() {
this.addEditorTab('Axes', axesEditorComponent, 2);
this.addEditorTab('Legend', 'public/app/plugins/panel/graph/tab_legend.html', 3);
this.addEditorTab('Display', 'public/app/plugins/panel/graph/tab_display.html', 4);
this.addEditorTab('Display options', 'public/app/plugins/panel/graph/tab_display.html');
this.addEditorTab('Axes', axesEditorComponent);
this.addEditorTab('Legend', 'public/app/plugins/panel/graph/tab_legend.html');
// if (config.alertingEnabled) {
// this.addEditorTab('Alert', alertTab, 5);

15
public/sass/components/_panel_editor.scss
View File

@ -206,3 +206,18 @@
font-size: $font-size-md;
margin-bottom: 20px;
}
.form-section {
margin-bottom: 10px;
}
.form-section__header {
border-bottom: 2px solid $dark-4;
padding: 5px 0px;
font-size: $font-size-h5;
margin-bottom: 20px;
}
.form-section__body {
background: $dark-1;
}