IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-01-23 23:13:52 -06:00
Code Issues Packages Projects Releases Wiki Activity

ux(): edit mode polish

Browse Source
This commit is contained in:
Torkel Ödegaard 2016-10-28 14:13:11 +02:00
parent f1a44ad090
commit e215ba821c
4 changed files with 30 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
public/app/features/dashboard/row/add_panel.html
View File

@ -1,9 +1,8 @@
<div class="dash-row-add-panel">
<div class="gf-form-inline">
<div class="gf-form-inline dash-row-add-panel-form">
<div class="gf-form">
<!-- <span class="gf&#45;form&#45;label">Panel search</span> -->
<input type="text" class="gf-form-input max-width-14" ng-model='ctrl.panelSearch' give-focus='true' ng-keydown="ctrl.keyDown($event)" ng-change="ctrl.panelSearchChanged()" placeholder="panel search filter"></input>
<input type="text" class="gf-form-input max-width-14" ng-model='ctrl.panelSearch' give-focus='true' ng-keydown="ctrl.keyDown($event)" ng-change="ctrl.panelSearchChanged()" placeholder="panel search filter" ng-blur="ctrl.panelSearchBlur()"></input>
</div>
</div>

10
public/app/features/dashboard/row/add_panel.ts
View File

@ -27,7 +27,7 @@ export class AddPanelCtrl {
keyDown(evt) {
if (evt.keyCode === 27) {
this.rowCtrl.showOptions = false;
this.rowCtrl.dropView = 0;
return;
}
@ -47,6 +47,12 @@ export class AddPanelCtrl {
}
}
panelSearchBlur() {
this.$timeout(() => {
this.rowCtrl.dropView = 0;
}, 400);
}
moveSelection(direction) {
var max = this.panelHits.length;
var newIndex = this.activeIndex + direction;
@ -90,7 +96,7 @@ export class AddPanelCtrl {
this.rowCtrl.dropView = 0;
this.dashboard.addPanel(panel, this.row);
this.$timeout(() => {
this.$rootScope.broadcast('render');
this.$rootScope.$broadcast('render');
//this.$rootScope.appEvent('panel-change-view', {
// fullscreen: true, edit: true, panelId: panel.id
//});

6
public/app/features/dashboard/row/options.html
View File

@ -1,9 +1,9 @@
<div class="dash-row-options">
<div class="gf-form-group section">
<h5 class="section-heading">Options</h5>
<!-- <h5 class="section&#45;heading">Options</h5> -->
<div class="gf-form-inline">
<div class="gf-form">
<span class="gf-form-label width-6">Title</span>
<span class="gf-form-label width-6">Row Title</span>
<input type="text" class="gf-form-input max-width-14" ng-model='ctrl.row.title'></input>
</div>
<div class="gf-form">
@ -24,7 +24,7 @@
</div>
<div class="gf-form-group section">
<h5 class="section-heading">Row Templating</h5>
<!-- <h5 class="section&#45;heading">Row Templating</h5> -->
<div class="gf-form">
<span class="gf-form-label">Repeat Row</span>

20
public/sass/pages/_dashboard.scss
View File

@ -216,13 +216,20 @@ div.flot-text {
flex-direction: row;
margin-right: $panel-margin;
margin-left: 0;
border-bottom: 1px solid $dark-4;
// border-bottom: 1px solid $dark-4;
&:hover {
.dash-row-header-actions {
display: block;
}
}
.h1 { font-size: $font-size-h1; }
.h2 { font-size: $font-size-h2; }
.h3 { font-size: $font-size-h3; }
.h4 { font-size: $font-size-h4; }
.h5 { font-size: $font-size-h5; }
.h6 { font-size: $font-size-h6; }
}
.dash-row-header-title {
@ -280,7 +287,6 @@ div.flot-text {
.dash-row {
}
.panels-wrapper {
padding: $panel-margin*2 0 0 $panel-margin;
}
}
@ -302,7 +308,8 @@ div.flot-text {
.dash-row-options {
background: $panel-bg;
margin: 0 0 $panel-margin 0;
border: $panel-border;
margin: 0 0 $panel-margin*2 $panel-margin;
padding: $spacer*1.5;
}
@ -311,6 +318,13 @@ div.flot-text {
padding: $panel-margin;
display: flex;
align-items: flex-start;
position: relative;
}
.dash-row-add-panel-form {
position: absolute;
width: 200px;
top: -34px;
}
.add-panel-panels-scroll {