fix(annotations): updated annotations query editor

public/app/features/annotations/partials/editor.html

@@ -76,22 +76,24 @@
 						<select class="gf-form-input gf-size-auto" ng-model="currentAnnotation.datasource" ng-options="f.name as f.name for f in datasources" ng-change="datasourceChanged()"></select>
 					</div>
 				</div>
-				<div class="gf-form-inline last-row">
+				<div class="gf-form-inline">
 					<div class="gf-form gf-size-max-xl">
 						<span class="gf-form-label width-10">Icon size</span>
 						<select class="gf-form-input gf-size-md" ng-model="currentAnnotation.iconSize" ng-options="f for f in [7,8,9,10,13,15,17,20,25,30]"></select>
 					</div>
-					<div class="gf-form max-width-10">
-						<spectrum-picker ng-model="currentAnnotation.iconColor"></spectrum-picker>
-						<span class="checkbox-label">Icon color</span>
+					<div class="gf-form">
+						<label class="gf-form-label">
+							<span>Icon color</span>
+							<spectrum-picker ng-model="currentAnnotation.iconColor"></spectrum-picker>
+						</label>
 					</div>
-					<div class="gf-form max-width-10">
+					<div class="gf-form">
+						<label class="gf-form-label">
+							<span>Line color</span>
+							<spectrum-picker ng-model="currentAnnotation.lineColor"></spectrum-picker>
+						</label>
 						<editor-checkbox text="Grid line" model="currentAnnotation.showLine"></editor-checkbox>
 					</div>
-					<div class="gf-form max-width-10">
-						<spectrum-picker ng-model="currentAnnotation.lineColor"></spectrum-picker>
-						<span class="checkbox-label">Line color</span>
-					</div>
 				</div>
 			</div>
 

public/app/plugins/datasource/graphite/partials/annotations.editor.html

@@ -1,10 +1,10 @@
 <div class="gf-form-group">
   <div class="gf-form">
-    <span class="gf-form-label width-14">Graphite target expression</span>
-    <input type="text" class="gf-form-input max-width-20" ng-model='ctrl.annotation.target' placeholder=""></input>
+    <span class="gf-form-label width-13">Graphite metrics query</span>
+    <input type="text" class="gf-form-input" ng-model='ctrl.annotation.target' placeholder=""></input>
   </div>
   <div class="gf-form">
-    <span class="gf-form-label width-14">Graphite event tags</span>
-    <input type="text" class="gf-form-input max-width-20" ng-model='ctrl.annotation.tags' placeholder=""></input>
+    <span class="gf-form-label width-13">Or Graphite events query</span>
+    <input type="text" class="gf-form-input" ng-model='ctrl.annotation.tags' placeholder=""></input>
   </div>
-</div>
+</div>

public/app/plugins/datasource/influxdb/datasource.ts

@@ -85,6 +85,10 @@ export function InfluxDatasource(instanceSettings, $q, backendSrv, templateSrv)
   };
 
   this.annotationQuery = function(options) {
+    if (!options.annotation.query) {
+      return $q.reject({message: 'Query missing in annotation definition'});
+    }
+
     var timeFilter = getTimeFilter({rangeRaw: options.rangeRaw});
     var query = options.annotation.query.replace('$timeFilter', timeFilter);
     query = templateSrv.replace(query);

public/sass/components/_dashboard.scss

@@ -286,8 +286,3 @@ div.flot-text {
   }
 }
 
-.annotations-basic-settings {
-  .last-row {
-    margin-bottom: 20px;
-  }
-}

public/sass/components/_drop.scss

@@ -15,8 +15,8 @@ $easing: cubic-bezier(0, 0, 0.265, 1.00);
     display: block;
   }
 
-  &.drop-open.drop-popover.drop-out-of-bounds,
-  &.drop-open-transitionend.drop-popover.drop-out-of-bounds {
+  &.drop-open.drop-help.drop-out-of-bounds,
+  &.drop-open-transitionend.drop-help.drop-out-of-bounds {
     display: none;
   }
 }

public/sass/components/_sidemenu.scss

@@ -60,6 +60,7 @@
     position: relative;
     @include left-brand-border();
 
+    &.active,
     &:hover {
       background-color: $side-menu-item-hover-bg;
       @include left-brand-border-gradient();