Color Coded alert levels in alerts history

ui/src/alerts/components/AlertsTable.js

@@ -85,7 +85,7 @@ const AlertsTable = React.createClass({
                   return (
                     <tr key={`${name}-${time}-${host}-${value}`}>
                       <td className="monotype">{name}</td>
-                      <td className="monotype">{level}</td>
+                      <td className={`monotype alert-level-${level.toLowerCase()}`}>{level}</td>
                       <td className="monotype">{(new Date(Number(time)).toISOString())}</td>
                       <td className="monotype">{host}</td>
                       <td className="monotype">{value}</td>

ui/src/style/enterprise_style/alerts.scss

@@ -0,0 +1,9 @@
+.alert-level-critical {
+  color: $c-dreamsicle !important;
+}
+.alert-level-warning {
+  color: #fdcf30 !important;
+}
+.alert-level-ok {
+  color: $c-rainforest !important;
+}

ui/src/style/enterprise_style/application.scss

@@ -18,6 +18,7 @@
 @import 'hosts';
 @import 'kapacitor';
 @import 'influx-tooltips';
+@import 'alerts';
 
 // Because of some issues with sharing styles across multiple webpack bundles,
 // we have to import other scss files here instead of in their corresponding