Merge ~ya-bo-ng/maas:event-logs-vanilla into maas:master

[Anthony Dillon]

Fix the machine details log layout

## Done
- Updated the code-line pattern to use the new Vanilla 2.0 classnames.
- Drive by fix up the layout of the empty pod view

## QA
- I have pushed the branch to karura so visit: http://karura.internal:5240/MAAS/#/machine/dxsdpb?area=logs

## Screenshot
https://drive.google.com/file/d/1vPA9ol1t6rTeFkApWwcXfBVLalpjT6Wc/view?usp=sharing

[Steve Rydz (steverydz)]

LGTM +1

review: Approve

[MAAS Lander (maas-lander)]

LANDING
-b event-logs-vanilla lp:~ya-bo-ng/maas/+git/maas into -b master lp:~maas-committers/maas

STATUS: FAILED BUILD
LOG: http://maas-ci-jenkins.internal:8080/job/maas/job/branch-tester/5989/consoleText

502d4b4... by Anthony Dillon on 2019-07-11

Fix lint

diff --git a/src/maasserver/static/js/angular/directives/code_lines.js b/src/maasserver/static/js/angular/directives/code_lines.js
index 49b66d2..e1a7aa1 100644
--- a/src/maasserver/static/js/angular/directives/code_lines.js
+++ b/src/maasserver/static/js/angular/directives/code_lines.js
@@ -30,7 +30,8 @@ function maasCodeLines() {
         // Each line is to be wrapped by a span which is style & given
         // its appropriate line number
         angular.forEach(lines, function(line) {
-          insert += newLine + '<span class="code-line">' + line + "</span>";
+          insert +=
+            newLine + '<span class="p-code-numbered__line">' + line + "</span>";
         });
         insert += "</code>";
 
diff --git a/src/maasserver/static/js/angular/directives/tests/test_code_lines.js b/src/maasserver/static/js/angular/directives/tests/test_code_lines.js
index 09802e3..2bf91b0 100644
--- a/src/maasserver/static/js/angular/directives/tests/test_code_lines.js
+++ b/src/maasserver/static/js/angular/directives/tests/test_code_lines.js
@@ -40,6 +40,8 @@ describe("maasCodeLines", function() {
     };
 
     var directive = compileDirective("getText()");
-    expect(directive.find("code span").hasClass("code-line")).toBe(true);
+    expect(directive.find("code span").hasClass("p-code-numbered__line")).toBe(
+      true
+    );
   });
 });
diff --git a/src/maasserver/static/partials/pods-list.html b/src/maasserver/static/partials/pods-list.html
index 5655193..3b9d478 100644
--- a/src/maasserver/static/partials/pods-list.html
+++ b/src/maasserver/static/partials/pods-list.html
@@ -131,8 +131,8 @@
                         </g>
                     </g>
                 </svg>
-                <h3 class="p-heading-icon__title p-heading--four">You have not added any KVMs yet.</h3>
-                <button class="p-button--positive is-inline ng-scope" data-ng-click="addPod()" data-ng-if="!add.open && canAddPod()">Add {$ getPageHeading() $}</button>
+                <h3 class="p-heading-icon__title p-heading--four u-no-max-width u-sv3">You have not added any KVMs yet.</h3>
+                <button class="p-button--positive is-inline u-no-margin--left ng-scope" data-ng-click="addPod()" data-ng-if="!add.open && canAddPod()">Add {$ getPageHeading() $}</button>
             </div>
         </div>
         <div class="row">
diff --git a/src/maasserver/static/scss/_patterns_code.scss b/src/maasserver/static/scss/_patterns_code.scss
new file mode 100644
index 0000000..5f692b1
--- /dev/null
+++ b/src/maasserver/static/scss/_patterns_code.scss
@@ -0,0 +1,5 @@
+@mixin maas-p-code {
+  .p-code-numbered__line {
+    display: block;
+  }
+}
diff --git a/src/maasserver/static/scss/build.scss b/src/maasserver/static/scss/build.scss
index c3ae410..d6f2802 100644
--- a/src/maasserver/static/scss/build.scss
+++ b/src/maasserver/static/scss/build.scss
@@ -19,6 +19,7 @@
 @import 'patterns_action-button';
 @import 'patterns_button';
 @import 'patterns_cta';
+@import 'patterns_code';
 @import 'patterns_icons';
 @import 'patterns_navigation';
 @import 'patterns_page-header';
@@ -66,6 +67,7 @@
 @include maas-tag-input;
 @include maas-p-buttons;
 @include maas-p-cta;
+@include maas-p-code;
 @include maas-p-forms;
 @include maas-p-hr;
 @include maas-p-notifications;