add notice styles

app/styles/app.scss

@@ -38,6 +38,7 @@
 @import "app/modules/media";
 @import "app/modules/switch";
 @import "app/modules/memberlist";
+@import "app/modules/notice";
 
 @import "app/layout";
 @import "app/layouts/dashboard";

app/styles/app/modules/icons.sass

@@ -192,3 +192,6 @@
   border-left  : 5px solid transparent
   border-right : 5px solid transparent
   border-top   : 5px solid $dashboard-text-color
+
+.icon-flag
+  background-image: inline-image('svg/notice-flag.svg')

app/styles/app/modules/notice.sass

@@ -0,0 +1,16 @@
+.notice
+  padding: 0.3em 0.5em 0.2em
+  margin-bottom: .5em
+  background-color: #F9F3D3
+  color: #AF9112
+  border-radius: 4px
+  a
+    color: #AF9112
+    text-decoration: underline
+
+  .icon-flag
+    @extend %icon
+    width: 1.3em
+    height: 1.5em
+    margin: 0 .6em 0 .2em
+    vertical-align: middle

app/templates/jobs/pre.hbs

@@ -5,7 +5,7 @@
     <div class="log-notice">Hang tight, the log cannot be shown until the build has started.</div>
   {{/if}}
   {{#if view.job.isLegacyInfrastructure}}
-    <p class="">This job runs on our legacy infrastructure. Read more about upgrading  <a href="#" title="">in our docs</a></p>
+    <p class="notice"><span class="icon-flag"></span>This job runs on our legacy infrastructure. Read more about upgrading  <a href="#" title="">in our docs</a></p>
   {{/if}}
   <div {{bind-attr class="view.job.notStarted:hidden"}}>
     <menu class="log-header">

public/images/svg/notice-flag.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 18.7 18.7" enable-background="new 0 0 18.7 18.7" xml:space="preserve">
+<path fill="#C9A92D" d="M9.3,0C4.2,0,0,4.2,0,9.3s4.2,9.3,9.3,9.3s9.3-4.2,9.3-9.3S14.5,0,9.3,0z M14.3,8.4L6.9,9.1v5.7H5.6V4.7h0
+	V3.8l8.6,0.8l-2.5,1.8L14.3,8.4z"/>
+</svg>