Merge ~ya-bo-ng/maas:pods-empty-state into maas:master

[Anthony Dillon]

LP: #1751900 - Align the empty pod list

## Done
Updated the empty pod list mark up to look like it did originally

## QA
- Go pods list
- Delete all pods
- See that it looks like it originally did

Fixes https://bugs.launchpad.net/maas/+bug/1751900

[Andres Rodriguez (andreserl)]

lgtm!

review: Approve

diff --git a/src/maasserver/static/partials/pods-list.html b/src/maasserver/static/partials/pods-list.html
index ad32f82..4f1e6b3 100644
--- a/src/maasserver/static/partials/pods-list.html
+++ b/src/maasserver/static/partials/pods-list.html
@@ -84,32 +84,31 @@
         <maas-notifications></maas-notifications>
     </div>
     <div class="row">
-        <div class="col-12">
+        <div class="col-12 u-align--center">
             <div data-ng-if="!loading && pods.length == 0" class="p-heading-icon">
-                <div class="p-heading-icon__header">
-                    <svg class="p-heading-icon__img" width="85px" height="104px" viewBox="0 0 85 104" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                        <title>add-pod</title>
-                        <defs></defs>
-                        <g id="Pod-creation" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                            <g id="003_Pod---empty-state" transform="translate(-677.000000, -320.000000)">
-                                <g id="Empty-state" transform="translate(337.000000, 320.000000)">
-                                    <g id="add-pod" transform="translate(340.000000, 0.000000)">
-                                        <path d="M42.2502469,126.44299 L42.2502469,42.4025859" id="path4205" stroke="#888888" stroke-width="4" transform="translate(42.774938, 84.422788) rotate(-90.000000) translate(-42.774938, -84.422788) "></path>
-                                        <path d="M50.6453086,78.1197576 L35.9539506,78.1197576" id="path4207" stroke="#888888" stroke-width="4" transform="translate(43.299630, 78.645010) rotate(-90.000000) translate(-43.299630, -78.645010) "></path>
-                                        <path d="M5.94160494,79.6955152 L22.7317284,79.6955152 L22.7317284,75.4934949 L10.1391358,75.4934949 L10.1391358,-0.142868687 L22.7317284,-0.142868687 L22.7317284,-4.34488889 L5.94160494,-4.34488889 L5.94160494,79.6955152 Z M29.0280247,79.6955152 L45.8181481,79.6955152 L45.8181481,75.4934949 L29.0280247,75.4934949 L29.0280247,79.6955152 Z M29.0280247,-0.0378181818 L45.8181481,-0.0378181818 L45.8181481,-4.23983838 L29.0280247,-4.23983838 L29.0280247,-0.0378181818 Z M52.1144444,79.6955152 L79.3983951,79.6955152 L79.3983951,-4.34488889 L52.1144444,-4.34488889 L52.1144444,-0.142868687 L75.2008642,-0.142868687 L75.2008642,75.4934949 L52.1144444,75.4934949 L52.1144444,79.6955152 Z" id="rect4236" fill="#888888" transform="translate(42.670000, 37.675313) rotate(-90.000000) translate(-42.670000, -37.675313) "></path>
-                                        <path d="M42.2502469,67.6147071 L42.2502469,-16.425697" id="path4238" stroke="#888888" stroke-width="4" transform="translate(42.774938, 25.594505) rotate(-90.000000) translate(-42.774938, -25.594505) "></path>
-                                        <path d="M42.2502469,90.7258182 L42.2502469,6.68541414" id="path4240" stroke="#888888" stroke-width="4" transform="translate(42.774938, 48.705616) rotate(-90.000000) translate(-42.774938, -48.705616) "></path>
-                                        <polygon id="rect4242" fill="#888888" transform="translate(17.522593, 14.553697) rotate(-90.000000) translate(-17.522593, -14.553697) " points="20.6707407 20.8567273 20.6707407 8.25066667 14.3744444 8.25066667 14.3744444 20.8567273"></polygon>
-                                        <polygon id="rect4244" fill="#888888" transform="translate(17.522593, 37.664808) rotate(-90.000000) translate(-17.522593, -37.664808) " points="20.6707407 43.9678384 20.6707407 31.3617778 14.3744444 31.3617778 14.3744444 43.9678384"></polygon>
-                                        <polygon id="rect4246" fill="#888888" transform="translate(17.522593, 60.775919) rotate(-90.000000) translate(-17.522593, -60.775919) " points="20.6707407 67.0789495 20.6707407 54.4728889 14.3744444 54.4728889 14.3744444 67.0789495"></polygon>
-                                        <ellipse id="path4208" fill="#888888" transform="translate(42.708827, 97.542545) rotate(-180.000000) translate(-42.708827, -97.542545) " cx="42.7088272" cy="97.5425455" rx="6.2962963" ry="6.3030303"></ellipse>
-                                    </g>
+                <svg width="85px" height="104px" viewBox="0 0 85 104" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+                    <title>add-pod</title>
+                    <defs></defs>
+                    <g id="Pod-creation" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                        <g id="003_Pod---empty-state" transform="translate(-677.000000, -320.000000)">
+                            <g id="Empty-state" transform="translate(337.000000, 320.000000)">
+                                <g id="add-pod" transform="translate(340.000000, 0.000000)">
+                                    <path d="M42.2502469,126.44299 L42.2502469,42.4025859" id="path4205" stroke="#888888" stroke-width="4" transform="translate(42.774938, 84.422788) rotate(-90.000000) translate(-42.774938, -84.422788) "></path>
+                                    <path d="M50.6453086,78.1197576 L35.9539506,78.1197576" id="path4207" stroke="#888888" stroke-width="4" transform="translate(43.299630, 78.645010) rotate(-90.000000) translate(-43.299630, -78.645010) "></path>
+                                    <path d="M5.94160494,79.6955152 L22.7317284,79.6955152 L22.7317284,75.4934949 L10.1391358,75.4934949 L10.1391358,-0.142868687 L22.7317284,-0.142868687 L22.7317284,-4.34488889 L5.94160494,-4.34488889 L5.94160494,79.6955152 Z M29.0280247,79.6955152 L45.8181481,79.6955152 L45.8181481,75.4934949 L29.0280247,75.4934949 L29.0280247,79.6955152 Z M29.0280247,-0.0378181818 L45.8181481,-0.0378181818 L45.8181481,-4.23983838 L29.0280247,-4.23983838 L29.0280247,-0.0378181818 Z M52.1144444,79.6955152 L79.3983951,79.6955152 L79.3983951,-4.34488889 L52.1144444,-4.34488889 L52.1144444,-0.142868687 L75.2008642,-0.142868687 L75.2008642,75.4934949 L52.1144444,75.4934949 L52.1144444,79.6955152 Z" id="rect4236" fill="#888888" transform="translate(42.670000, 37.675313) rotate(-90.000000) translate(-42.670000, -37.675313) "></path>
+                                    <path d="M42.2502469,67.6147071 L42.2502469,-16.425697" id="path4238" stroke="#888888" stroke-width="4" transform="translate(42.774938, 25.594505) rotate(-90.000000) translate(-42.774938, -25.594505) "></path>
+                                    <path d="M42.2502469,90.7258182 L42.2502469,6.68541414" id="path4240" stroke="#888888" stroke-width="4" transform="translate(42.774938, 48.705616) rotate(-90.000000) translate(-42.774938, -48.705616) "></path>
+                                    <polygon id="rect4242" fill="#888888" transform="translate(17.522593, 14.553697) rotate(-90.000000) translate(-17.522593, -14.553697) " points="20.6707407 20.8567273 20.6707407 8.25066667 14.3744444 8.25066667 14.3744444 20.8567273"></polygon>
+                                    <polygon id="rect4244" fill="#888888" transform="translate(17.522593, 37.664808) rotate(-90.000000) translate(-17.522593, -37.664808) " points="20.6707407 43.9678384 20.6707407 31.3617778 14.3744444 31.3617778 14.3744444 43.9678384"></polygon>
+                                    <polygon id="rect4246" fill="#888888" transform="translate(17.522593, 60.775919) rotate(-90.000000) translate(-17.522593, -60.775919) " points="20.6707407 67.0789495 20.6707407 54.4728889 14.3744444 54.4728889 14.3744444 67.0789495"></polygon>
+                                    <ellipse id="path4208" fill="#888888" transform="translate(42.708827, 97.542545) rotate(-180.000000) translate(-42.708827, -97.542545) " cx="42.7088272" cy="97.5425455" rx="6.2962963" ry="6.3030303"></ellipse>
                                 </g>
                             </g>
                         </g>
-                    </svg>
-                    <h3 class="p-heading-icon__title">You have not added any pods yet. <button class="p-button--positive is-inline ng-scope" data-ng-click="add.open = true" data-ng-if="!add.open">Add pod</button></h3>
-                </div>
+                    </g>
+                </svg>
+                <h3 class="p-heading-icon__title">You have not added any pods yet.</h3>
+                <button class="p-button--positive is-inline ng-scope" data-ng-click="add.open = true" data-ng-if="!add.open">Add pod</button>
             </div>
         </div>
         <div class="row">