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

ux: dashboard settings progress

Browse Source
This commit is contained in:
Torkel Ödegaard
2017-12-11 13:29:23 +01:00
parent a682475152
commit 61dbcfd35b
4 changed files with 38 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
public/app/features/annotations/partials/editor.html
View File

@@ -7,26 +7,6 @@
</h3>
<div ng-if="ctrl.mode === 'list'">
<!-- empty list cta, there is always one built in query -->
<div ng-if="ctrl.annotations.length === 1">
<div class="empty-list-cta">
<div class="empty-list-cta__title">There are no custom annotation queries added yet</div>
<a ng-click="ctrl.setupNew()" class="empty-list-cta__button btn btn-xlarge btn-success">
<i class="gicon gicon-dashboard-new"></i>
Add Annotation Query
</a>
<div class="grafana-info-box">
<h5>What are Annotations?</h5>
<p>
Annotations provide a way to integrate event data into your graphs. They are visualized as vertical lines and icons
on all graph panels. When you hover over an annotation icon you can get event text &amp; tags for the event. You can add annotation events
directly from grafana by holding CTRL or CMD + click on graph (or drag region). These will be stored in Grafana's annotation database.
</p>
Checkout the <a class="external-link" target="_blank" href="http://docs.grafana.org/reference/annotations/">Annotations documentation</a> for more information.
</div>
</div>
</div>
<div class="page-action-bar" ng-if="ctrl.annotations.length > 1">
<div class="page-action-bar__spacer"></div>
<a type="button" class="btn btn-success" ng-click="ctrl.setupNew();"><i class="fa fa-plus" ></i> New</a>
@@ -63,6 +43,26 @@
</tr>
</tbody>
</table>
<!-- empty list cta, there is always one built in query -->
<div ng-if="ctrl.annotations.length === 1" class="p-t-2">
<div class="empty-list-cta">
<div class="empty-list-cta__title">There are no custom annotation queries added yet</div>
<a ng-click="ctrl.setupNew()" class="empty-list-cta__button btn btn-xlarge btn-success">
<i class="gicon gicon-dashboard-new"></i>
Add Annotation Query
</a>
<div class="grafana-info-box">
<h5>What are Annotations?</h5>
<p>
Annotations provide a way to integrate event data into your graphs. They are visualized as vertical lines and icons
on all graph panels. When you hover over an annotation icon you can get event text &amp; tags for the event. You can add annotation events
directly from grafana by holding CTRL or CMD + click on graph (or drag region). These will be stored in Grafana's annotation database.
</p>
Checkout the <a class="external-link" target="_blank" href="http://docs.grafana.org/reference/annotations/">Annotations documentation</a> for more information.
</div>
</div>
</div>
</div>
<div class="annotations-basic-settings" ng-if="ctrl.mode === 'edit' || ctrl.mode === 'new'">

10
public/app/features/dashboard/dashnav/dashnav.html
View File

@@ -27,23 +27,23 @@
<i class="gicon gicon-add-panel"></i>
</button>
<button class="btn navbar-button" ng-show="::ctrl.dashboard.meta.canStar" ng-click="ctrl.starDashboard()" bs-tooltip="'Mark as favorite'" data-placement="bottom">
<button class="btn navbar-button navbar-button--star" ng-show="::ctrl.dashboard.meta.canStar" ng-click="ctrl.starDashboard()" bs-tooltip="'Mark as favorite'" data-placement="bottom">
<i class="fa" ng-class="{'fa-star-o': !ctrl.dashboard.meta.isStarred, 'fa-star': ctrl.dashboard.meta.isStarred}"></i>
</button>
<button class="btn navbar-button" ng-show="::ctrl.dashboard.meta.canShare" ng-click="ctrl.shareDashboard(0)" bs-tooltip="'Share dashboard'" data-placement="bottom">
<button class="btn navbar-button navbar-button--share" ng-show="::ctrl.dashboard.meta.canShare" ng-click="ctrl.shareDashboard(0)" bs-tooltip="'Share dashboard'" data-placement="bottom">
<i class="fa fa-share-square-o"></i></a>
</button>
<button class="btn navbar-button" ng-show="::ctrl.dashboard.meta.canSave" ng-click="ctrl.saveDashboard()" bs-tooltip="'Save dashboard <br> CTRL+S'" data-placement="bottom">
<button class="btn navbar-button navbar-button--save" ng-show="::ctrl.dashboard.meta.canSave" ng-click="ctrl.saveDashboard()" bs-tooltip="'Save dashboard <br> CTRL+S'" data-placement="bottom">
<i class="fa fa-save"></i>
</button>
<button class="btn navbar-button" ng-if="::ctrl.dashboard.snapshot.originalUrl" ng-href="{{ctrl.dashboard.snapshot.originalUrl}}" bs-tooltip="'Open original dashboard'" data-placement="bottom">
<button class="btn navbar-button navbar-button--snapshot-origin" ng-if="::ctrl.dashboard.snapshot.originalUrl" ng-href="{{ctrl.dashboard.snapshot.originalUrl}}" bs-tooltip="'Open original dashboard'" data-placement="bottom">
<i class="fa fa-link"></i>
</button>
<button class="btn navbar-button" ng-click="ctrl.toggleSettings()" bs-tooltip="'Settings'" data-placement="bottom">
<button class="btn navbar-button navbar-button--settings" ng-click="ctrl.toggleSettings()" bs-tooltip="'Settings'" data-placement="bottom">
<i class="fa fa-cog"></i>
</button>
</div>

6
public/sass/components/_empty_list_cta.scss
View File

@@ -1,7 +1,7 @@
.empty-list-cta {
background-color: $search-filter-box-bg;
text-align: center;
padding: 2rem;
padding: $spacer*2;
border-radius: $border-radius;
.grafana-info-box {
@@ -11,12 +11,12 @@
}
.empty-list-cta__title {
padding-bottom: 30px;
padding-bottom: $spacer*3;
font-style: italic;
}
.empty-list-cta__button {
margin-bottom: 50px;
margin-bottom: $spacer*3;
}
.empty-list-cta__pro-tip-link {

12
public/sass/components/_navbar.scss
View File

@@ -23,7 +23,10 @@
@include navbar-alt-look();
}
.navbar-buttons--actions,
.navbar-button--add-panel,
.navbar-button--star,
.navbar-button--share,
.navbar-button--settings,
.navbar-page-btn .fa-caret-down,
.gf-timepicker-nav {
display: none;
@@ -39,7 +42,11 @@
@include navbar-alt-look();
}
.navbar-buttons--actions {
.navbar-button--add-panel,
.navbar-button--star,
.navbar-button--save,
.navbar-button--settings,
.navbar-page-btn .fa-caret-down {
display: none;
}
@@ -90,6 +97,7 @@
&--close {
display: none;
margin-right: 0;
}
}