diff --git a/public/app/features/dashboard/dashgrid/EditorTabBody.tsx b/public/app/features/dashboard/dashgrid/EditorTabBody.tsx index 42c6b33764b..cf85102338c 100644 --- a/public/app/features/dashboard/dashgrid/EditorTabBody.tsx +++ b/public/app/features/dashboard/dashgrid/EditorTabBody.tsx @@ -88,11 +88,14 @@ export class EditorTabBody extends PureComponent { renderOpenView(view: EditorToolBarView) { return ( -
- - {view.render(this.onCloseOpenView)} +
+
+ {view.title} + +
+
{view.render(this.onCloseOpenView)}
); } @@ -115,10 +118,10 @@ export class EditorTabBody extends PureComponent {
- -
{openView && this.renderOpenView(openView)}
-
+ + {openView && this.renderOpenView(openView)} + {children} diff --git a/public/app/features/dashboard/dashgrid/QueriesTab.tsx b/public/app/features/dashboard/dashgrid/QueriesTab.tsx index 31480403743..34490d9a434 100644 --- a/public/app/features/dashboard/dashgrid/QueriesTab.tsx +++ b/public/app/features/dashboard/dashgrid/QueriesTab.tsx @@ -336,23 +336,27 @@ export class QueriesTab extends PureComponent { renderToolbar={this.renderToolbar} toolbarItems={[options, queryInspector, dsHelp]} > -
-
(this.element = element)} /> +
+
+
+
(this.element = element)} /> -
-
- - {!isAddingMixed && ( - - )} - {isAddingMixed && this.renderMixedPicker()} +
+
+ + {!isAddingMixed && ( + + )} + {isAddingMixed && this.renderMixedPicker()} +
+
diff --git a/public/app/features/dashboard/dashgrid/VisualizationTab.tsx b/public/app/features/dashboard/dashgrid/VisualizationTab.tsx index cad204ce712..9c5b865b9a2 100644 --- a/public/app/features/dashboard/dashgrid/VisualizationTab.tsx +++ b/public/app/features/dashboard/dashgrid/VisualizationTab.tsx @@ -105,9 +105,9 @@ export class VisualizationTab extends PureComponent { for (let i = 0; i < panelCtrl.editorTabs.length; i++) { template += ` -
` + - (i > -1 ? `
{{ctrl.editorTabs[${i}].title}}
` : '') + - `
+
` + + (i > -1 ? `
{{ctrl.editorTabs[${i}].title}}
` : '') + + `
diff --git a/public/sass/components/_panel_editor.scss b/public/sass/components/_panel_editor.scss index a836bf3f8cd..fbb5fdeec1d 100644 --- a/public/sass/components/_panel_editor.scss +++ b/public/sass/components/_panel_editor.scss @@ -63,7 +63,7 @@ } .panel-editor__content { - padding: 40px 20px; + padding: 0; } .panel-editor__toolbar-view { @@ -132,7 +132,6 @@ } .viz-picker { - margin-top: -40px; padding: 20px; position: relative; } @@ -303,27 +302,10 @@ width: 30px; } -.form-option-box { - margin-bottom: 20px; -} - -.form-option-box__header { - border-bottom: 2px solid $dark-4; - padding: 5px 0px; - font-size: $font-size-md; - margin-bottom: 20px; -} - -.form-section { - margin-bottom: 10px; -} - -.form-section__header { - padding: 5px 10px; +.panel-option-section__header { + padding: 5px 20px; font-size: $font-size-h5; - margin-bottom: 20px; background: $input-label-bg; - border-radius: 3px; position: relative; .btn { @@ -333,10 +315,6 @@ } } -.form-section__body { - padding: 0 10px; -} - -.panel-editor-tabs__item-popover { - background: $orange; +.panel-option-section__body { + padding: 20px; } diff --git a/public/sass/components/_query_editor.scss b/public/sass/components/_query_editor.scss index 40cee199062..17280a99cc6 100644 --- a/public/sass/components/_query_editor.scss +++ b/public/sass/components/_query_editor.scss @@ -13,6 +13,10 @@ color: $orange; } +.query-editor-rows { + margin-top: 20px; +} + .gf-form-query { display: flex; flex-direction: row;