Make the error handling look prettier on compare view

ui/js/directives/perf/compare.js

@@ -48,3 +48,18 @@ treeherder.directive(
             }
         };
     });
+
+treeherder.directive(
+    'compareError', function() {
+        return {
+            templateUrl: 'partials/perf/comparerror.html',
+            restrict: 'E',
+            scope: {
+                errors: '=',
+                originalProject: '=',
+                originalRevision: '=',
+                newProject: '=',
+                newRevision: '='
+            }
+        };
+    });

ui/partials/perf/comparectrl.html

@@ -4,8 +4,8 @@
       Loading all results, please wait a minute...
       <img src="img/dancing_cat.gif" />
     </div>
-    <div id="error" ng-if="!dataLoading && errors.length" ng-repeat="error in errors">
-      <div>{{error}}</div>
+    <div id="error" ng-if="!dataLoading && errors.length">
+      <compare-error errors="errors" original-revision="originalRevision" original-project="originalProject" new-revision="newRevision" new-project="newProject"></compare-error>
     </div>
     <div id="subtest-summary" ng-if="!dataLoading && !errors.length">
       <h1>Perfherder Compare Revisions</h1>

ui/partials/perf/comparerror.html

@@ -0,0 +1,6 @@
+<div class="alert alert-danger" role="alert">
+    <p ng-repeat="error in errors">
+        <span class="fa fa-warning"></span> {{error}}
+    </p>
+<p><a class="alert-link" href="#/comparechooser?originalProject={{originalProject}}&originalRevision={{originalRevision}}&newProject={{newProject}}&newRevision={{newRevision}}">Modify choice</p>
+</div>

ui/partials/perf/comparesubtestctrl.html

@@ -9,7 +9,7 @@
     <revision-information original-project="originalProject" original-revision="originalRevision" original-result-set="originalResultSet" new-project="newProject" new-revision="newRevision" new-result-set="newResultSet"></revision-information>
     <p><a href="perf.html#/compare?originalProject={{originalProject.name}}&originalRevision={{originalRevision}}&newProject={{newProject.name}}&newRevision={{newRevision}}">Show all tests and platforms</a></p>
     <div id="error" ng-if="!dataLoading && errors.length" ng-repeat="error in errors">
-      <div>{{error}}</div>
+      <compare-error errors="errors" original-revision="originalRevision" original-project="originalProject" new-revision="newRevision" new-project="newProject"></compare-error>
     </div>
     <ph-compare-table
        titles="titles"