feat(dashboard): add ">= WARN" to the alarm donut

...just to make it clear why the color and/or number of alarms
might not match the alarms you can see when you click-through
to the alarm list.

scss/includes/dashboard.scss

@@ -14,7 +14,7 @@ $shadow-color: rgba(0,0,0,0.3);
 	}
 	.donut-title {
 		z-index: $z-index-view-above;
-		margin-top: -($font-size-large * 1.6);
+		margin-top: -($font-size-large * 1.5);
 		font-size: $font-size-large * 2;
 		left:0;
 		width: 100%;
@@ -23,6 +23,12 @@ $shadow-color: rgba(0,0,0,0.3);
 			font-size: $font-size-base;
 		}
 	}
+
+	/* bump the alarms title up a little bit because it's 2 lines */
+	.alarms .donut-title {
+		margin-top: -($font-size-large * 2.0);
+	}
+
 	.donut-title {
 		top: 50%;
 		position: absolute;

src/app/dashboard/DashboardController.js

@@ -36,6 +36,11 @@
 	var favoriteGraphsTemplate = require('ngtemplate!./dashboard-favorite-graphs.html');
 	var availabilityTemplate = require('ngtemplate!./dashboard-availability.html');
 
+	var types = {
+		outages: 'Outages',
+		alarms: 'Alarms<br>(>= WARN)'
+	};
+
 	var severityOrder = [
 		'INDETERMINATE',
 		'CLEARED',
@@ -213,7 +218,7 @@
 							visible.text('');
 						} else {
 							var html = '<div class="row total"><div class="col">' + total + '</div></div>' +
-								'<div class="row type"><div class="col">' + type + '</div></div>';
+								'<div class="row type"><div class="col">' + types[type] + '</div></div>';
 							visible.html(html);
 							visible.show();
 						}