diff --git a/public/app/core/directives/misc.js b/public/app/core/directives/misc.js index d9bd7a38f0c..8e1791af46c 100644 --- a/public/app/core/directives/misc.js +++ b/public/app/core/directives/misc.js @@ -39,7 +39,7 @@ function (angular, coreModule, kbn) { var tip = attrs.tip ? (' ' + attrs.tip + '') : ''; var showIf = attrs.showIf ? (' ng-show="' + attrs.showIf + '" ') : ''; - var template = '
' + + var template = '
' + ' ' + '
- -
@@ -66,28 +64,34 @@
-
-
-
- - -
-
- - -
-
- - +
+
+
+
+ Name + +
+
+ Datasource + +
-
- - -
- -
- - +
+
+ Icon size + +
+
+ + Icon color +
+
+ +
+
+ + Line color +
@@ -96,11 +100,12 @@ -
- - -
-
+
+
+ + +
+
diff --git a/public/app/features/playlist/partials/playlist.html b/public/app/features/playlist/partials/playlist.html index b62d2a22f54..beb311a9e6c 100644 --- a/public/app/features/playlist/partials/playlist.html +++ b/public/app/features/playlist/partials/playlist.html @@ -7,6 +7,8 @@

Edit Playlist

+

A playlist rotates through a pre-selected list of Dashboards. A Playlist can be a great way to build situational awareness, or just show off your metrics to your team or visitors.

+
Name @@ -19,24 +21,28 @@
-
-
Add dashboards
-
- -
-
+

Dashboards

-
Search results ({{ctrl.filteredDashboards.length + ctrl.filteredTags.length}})
+ +
+
+
Available
+
+ +
+
+
+
- +
- -
- {{playlistItem.title}} + +   {{playlistItem.title}} +
-
-
Added dashboards
- +
Selected
+
- - -
- {{playlistItem.title}} + +   {{playlistItem.title}} + {{playlistItem.title}} + @@ -89,7 +95,10 @@
-  Add + Save Cancel diff --git a/public/app/features/playlist/playlist_edit_ctrl.ts b/public/app/features/playlist/playlist_edit_ctrl.ts index 3baa3dd3353..ea018bc0bbb 100644 --- a/public/app/features/playlist/playlist_edit_ctrl.ts +++ b/public/app/features/playlist/playlist_edit_ctrl.ts @@ -11,7 +11,7 @@ export class PlaylistEditCtrl { searchQuery: string = ''; loading: boolean = false; playlist: any = { - interval: '10m', + interval: '5m', }; playlistItems: any = []; dashboardresult: any = []; diff --git a/public/app/plugins/datasource/elasticsearch/partials/annotations.editor.html b/public/app/plugins/datasource/elasticsearch/partials/annotations.editor.html index 8f761b67865..1db00904c04 100644 --- a/public/app/plugins/datasource/elasticsearch/partials/annotations.editor.html +++ b/public/app/plugins/datasource/elasticsearch/partials/annotations.editor.html @@ -1,39 +1,36 @@ -
-
-
Index name
-
- -
+
+
+ Index name +
-
-
Search query (lucene) Use [[filterName]] in query to replace part of the query with a filter value
-
- -
+
+ Search query (lucene) Use [[filterName]] in query to replace part of the query with a filter value +
-
-
-
Field mappings
-
- - +
+
Field mappings
+
+
+ Time +
-
- - +
+ Title +
- -
- - +
+
+
+ Tags +
-
- - +
+ Text +
-
+
\ No newline at end of file diff --git a/public/app/plugins/datasource/graphite/partials/annotations.editor.html b/public/app/plugins/datasource/graphite/partials/annotations.editor.html index ea5c2f7f50f..b7264b5e499 100644 --- a/public/app/plugins/datasource/graphite/partials/annotations.editor.html +++ b/public/app/plugins/datasource/graphite/partials/annotations.editor.html @@ -1,15 +1,10 @@ -
-
- - -
-
- -
-
- - -
-
- - +
+
+ Graphite target expression + +
+
+ Graphite event tags + +
+
\ No newline at end of file diff --git a/public/app/plugins/datasource/influxdb/partials/annotations.editor.html b/public/app/plugins/datasource/influxdb/partials/annotations.editor.html index 03ef1df0b52..3c4634bb657 100644 --- a/public/app/plugins/datasource/influxdb/partials/annotations.editor.html +++ b/public/app/plugins/datasource/influxdb/partials/annotations.editor.html @@ -1,29 +1,27 @@ -
-
-
InfluxDB Query Example: select text from events where $timeFilter
-
- +
+
+
+ InfluxDB Query Example: select text from events where $timeFilter +
- -
-
-
Column mappings If your influxdb query returns more than one column you need to specify the column names below. An annotation event is composed of a title, tags, and an additional text field.
-
- - +
+
Column mappings If your influxdb query returns more than one column you need to specify the column names below. An annotation event is composed of a title, tags, and an additional text field.
+
+
+ Title +
-
- - +
+ Tags +
-
- - +
+ Text +
- diff --git a/public/app/plugins/datasource/prometheus/partials/annotations.editor.html b/public/app/plugins/datasource/prometheus/partials/annotations.editor.html index ffeb7d6deea..5a155b3a1b5 100644 --- a/public/app/plugins/datasource/prometheus/partials/annotations.editor.html +++ b/public/app/plugins/datasource/prometheus/partials/annotations.editor.html @@ -1,28 +1,28 @@ -
-
-
Search expression
-
- +
+
+
+ Search expression +
- -
-
-
Field formats
-
- - +
+
Field formats
+
+
+ Title +
-
- - +
+ Tags +
- -
- - +
+
+
+ Text +
diff --git a/public/sass/components/_dashboard.scss b/public/sass/components/_dashboard.scss index 1ca0c3b9719..8b4b272d523 100644 --- a/public/sass/components/_dashboard.scss +++ b/public/sass/components/_dashboard.scss @@ -285,3 +285,9 @@ div.flot-text { padding: 1.2rem .5rem .4rem .5rem; } } + +.annotations-basic-settings { + .last-row { + margin-bottom: 20px; + } +} diff --git a/public/sass/pages/_playlist.scss b/public/sass/pages/_playlist.scss index cbe94593f0a..f0d1cf4c038 100644 --- a/public/sass/pages/_playlist.scss +++ b/public/sass/pages/_playlist.scss @@ -1,3 +1,8 @@ +.playlist-description { + width: 555px; + margin-bottom: 20px; +} + .playlist-search-container { z-index: 1000; position: relative; @@ -18,6 +23,10 @@ right: 11px; } +.playlist-search-containerwrapper { + margin-bottom: 15px; +} + .playlist-search-field-wrapper { input { width: 100%; @@ -90,3 +99,29 @@ padding-left: 20px; } } + +.playlist-available-list { + td { + line-height: 2rem; + white-space: nowrap; + } + + .add-dashboard { + text-align: center; + } +} + +.playlist-column-header { + border-bottom: thin solid $gray-1; + padding-bottom: 10px; + margin-bottom: 15px; +} + +.selected-playlistitem-settings { + text-align: right; +} + +.tag-result-container { + width: 160px; + float: left; +} \ No newline at end of file