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

wip: testing new styles

Browse Source
This commit is contained in:
Torkel Ödegaard 2018-12-13 13:14:39 +01:00
parent 5fde977185
commit fe0f66b3f2
2 changed files with 9 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -331,12 +331,9 @@ export class QueriesTab extends PureComponent<Props, State> {
}; };
return ( return (
<EditorTabBody <EditorTabBody heading="Data" renderToolbar={this.renderToolbar} toolbarItems={[options, queryInspector, dsHelp]}>
heading="Queries"
renderToolbar={this.renderToolbar}
toolbarItems={[options, queryInspector, dsHelp]}
>
<div className="panel-option-section"> <div className="panel-option-section">
<div className="panel-option-section__header">Queries</div>
<div className="panel-option-section__body"> <div className="panel-option-section__body">
<div className="query-editor-rows gf-form-group"> <div className="query-editor-rows gf-form-group">
<div ref={element => (this.element = element)} /> <div ref={element => (this.element = element)} />

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

@ -32,7 +32,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex-grow: 1; flex-grow: 1;
background: $page-bg; background: $input-bg;
margin: 0 20px 0 84px; margin: 0 20px 0 84px;
border-radius: 3px; border-radius: 3px;
box-shadow: $panel-editor-shadow; box-shadow: $panel-editor-shadow;
@ -63,12 +63,7 @@
} }
.panel-editor__content { .panel-editor__content {
padding: 0; padding: 10px;
}
.panel-editor__toolbar-view {
background: $panel-editor-toolbar-view-bg;
padding: 20px;
} }
.panel-in-fullscreen { .panel-in-fullscreen {
@ -142,8 +137,8 @@
} }
.viz-picker__item { .viz-picker__item {
background: $panel-bg; background: $panel-editor-viz-item-bg;
border: $panel-border; border: $panel-editor-viz-item-border;
border-radius: 3px; border-radius: 3px;
height: 100px; height: 100px;
width: 150px; width: 150px;
@ -242,64 +237,13 @@
} }
} }
.ds-picker-list {
display: flex;
flex-wrap: wrap;
margin-bottom: 13px;
flex-direction: column;
}
.ds-picker-list__item {
background: $panel-editor-viz-item-bg;
border: $panel-editor-viz-item-border;
border-radius: 3px;
display: flex;
cursor: pointer;
margin-bottom: 3px;
padding: 5px 15px;
align-items: center;
height: 44px;
&--selected {
background: $panel-editor-viz-item-bg-hover;
border: $panel-editor-viz-item-border-hover;
box-shadow: $panel-editor-viz-item-shadow-hover;
}
&--active {
box-shadow: 0 0 6px $orange;
border: 1px solid $orange;
.ds-picker-list__name {
color: $text-color;
}
}
}
.ds-picker { .ds-picker {
position: relative; position: relative;
min-width: 200px; min-width: 200px;
} }
.ds-picker-menu { .panel-option-section {
min-width: 400px; margin-bottom: 10px;
max-width: 500px;
position: absolute;
background: $panel-editor-toolbar-view-bg;
padding: 5px;
overflow: auto;
}
.ds-picker-list__name {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-size: $font-size-md;
padding-left: 15px;
}
.ds-picker-list__img {
width: 30px;
} }
.panel-option-section__header { .panel-option-section__header {
@ -317,4 +261,5 @@
.panel-option-section__body { .panel-option-section__body {
padding: 20px; padding: 20px;
background: $page-bg;
} }