Merge ~deadlight/maas:expanding-tables into ~ya-bo-ng/maas:vanilla

[Karl Williams]

Added col-12 to all of the expanding table cells to force them to be full width

[Anthony Dillon (ya-bo-ng)]

Looks good, thanks.

review: Approve

diff --git a/src/maasserver/static/partials/boot-images.html b/src/maasserver/static/partials/boot-images.html
index 4139539..9fe1ad3 100644
--- a/src/maasserver/static/partials/boot-images.html
+++ b/src/maasserver/static/partials/boot-images.html
@@ -143,7 +143,7 @@
                         <td class="u-align--right">
                             <button data-ng-if="(isSuperUser() && canBeRemoved(image))" class="p-button--negative" aria-label="Remove" data-ng-click="deleteImage(image)">Remove</button>
                         </td>
-                        <td colspan="6" class="p-table-expanding__panel" data-ng-if="canBeRemoved(image) && ubuntuDeleteId === image.resourceId">
+                        <td colspan="6" class="p-table-expanding__panel col-12" data-ng-if="canBeRemoved(image) && ubuntuDeleteId === image.resourceId">
                             <p><i class="p-icon--warning">Warning:</i> Are you sure you want to remove this image?</p>
                             <button class="p-button--neutral is-inline" data-ng-click="deleteImage()">Cancel</button>
                             <button class="p-button--negative" data-ng-click="confirmDeleteImage()">Remove</button>
@@ -285,7 +285,7 @@
                     <td class="u-align--right">
                         <button class="p-button--negative" aria-label="Remove" data-ng-click="quickRemove(image)">Remove image</button>
                     </td>
-                    <td class="p-table-expanding__panel" data-ng-if="isShowingDeleteConfirm(image)">
+                    <td class="p-table-expanding__panel col-12" data-ng-if="isShowingDeleteConfirm(image)">
                         <h2 data-ng-click="cancelRemove()" class="u-float--left">Remove image</h2>
                         <p><i class="p-icon--warning">Warning: </i> Are you sure you want to remove this image?</p>
                         <div class="u-float--right">
@@ -330,7 +330,7 @@
                     <td class="u-align--right">
                         <a aria-label="Remove" data-ng-click="toggleMenu(); quickRemove(image)">Remove image</a>
                     </td>
-                    <td class="p-table-expanding__panel" data-ng-if="isShowingDeleteConfirm(image)">
+                    <td class="p-table-expanding__panel col-12" data-ng-if="isShowingDeleteConfirm(image)">
                         <h2 data-ng-click="cancelRemove()">Remove image</h2>
                         <p><i class="p-icon--warning">Warning: </i> Are you sure you want to remove this image?</p>
                         <button class="p-button--neutral is-inline" type="button" data-ng-click="cancelRemove()">Cancel</button>
diff --git a/src/maasserver/static/partials/ipranges.html b/src/maasserver/static/partials/ipranges.html
index b81bcf9..af2d826 100755
--- a/src/maasserver/static/partials/ipranges.html
+++ b/src/maasserver/static/partials/ipranges.html
@@ -26,7 +26,7 @@
                             data-ng-click="toggleMenu(); ipRangeEnterDeleteMode(iprange)">Remove</button>
                     </div>
                 </td>
-                <td class="is-active p-table-expanding__panel" col-span="6" data-ng-if="isIPRangeInDeleteMode(iprange)">
+                <td class="is-active p-table-expanding__panel col-12" col-span="6" data-ng-if="isIPRangeInDeleteMode(iprange)">
                     <hr />
                     <div class="row u-no-margin--top">
                         <div class="col-6">
@@ -38,7 +38,7 @@
                         </div>
                     </div>
                 </td>
-                <td class="is-active p-table-expanding__panel" col-span="6" data-ng-if="isIPRangeInEditMode(iprange)">
+                <td class="is-active p-table-expanding__panel col-12" col-span="6" data-ng-if="isIPRangeInEditMode(iprange)">
                     <hr />
                     <maas-obj-form obj="iprange" manager="iprangeManager" table-form="true"
                     save-on-blur="false" after-save="ipRangeClearEditMode">
@@ -82,7 +82,7 @@
             <tr data-ng-if="subnetIPRanges.length === 0 && !newRange">
                 <td class="col-12">No IP ranges have been reserved for this subnet.</td>
             </tr>
-            <tr class="p-table-expanding__panel" data-ng-if="newRange">
+            <tr class="p-table-expanding__panel col-12" data-ng-if="newRange">
                 <td class="p-form p-form--inline ">
                     <maas-obj-form obj="newRange" manager="iprangeManager" manager-method="createItem"
                         table-form="true" save-on-blur="false" after-save="cancelAddRange">
diff --git a/src/maasserver/static/partials/pods-list.html b/src/maasserver/static/partials/pods-list.html
index dc9ee52..75bb6bd 100644
--- a/src/maasserver/static/partials/pods-list.html
+++ b/src/maasserver/static/partials/pods-list.html
@@ -149,7 +149,7 @@
                     <tr data-ng-repeat="pod in filteredItems = (pods | nodesFilter:search | orderBy:predicate:reverse) track by pod.id" data-ng-class="{ selected: pod.$selected, 'is-active': pod.$selected && pod.action_failed }">
                         <td class="col-1" data-ng-if="isSuperUser()" aria-label="Select pod">
                             <input type="checkbox" class="checkbox" data-ng-click="toggleChecked(pod)" data-ng-checked="pod.$selected" id="{$ pod.id $}" data-ng-disabled="add.open || hasActionsInProgress()"/>
-                          <label for="{$ pod.id $}" class="checkbox-label"></label>
+                            <label for="{$ pod.id $}" class="checkbox-label"></label>
                         </td>
                         <td class="col-2" aria-label="Name">
                             <a href="#/pod/{$ pod.id $}">{$ pod.name $}</a>
@@ -172,7 +172,7 @@
                         <td class="col-2 u-align--right" aria-label="Composed machines">
                             {$ pod.composed_machines_count $}
                         </td>
-                        <td class="p-table-expanding__panel" data-ng-if="pod.$selected && pod.action_failed">
+                        <td class="p-table-expanding__panel col-12" data-ng-if="pod.$selected && pod.action_failed">
                             <div aria-label="label" class="table__data">
                                 <p><i class="p-icon--error">Error:</i> {$ pod.action_error $}</p>
                             </div>
diff --git a/src/maasserver/static/partials/settings.html b/src/maasserver/static/partials/settings.html
index daaf940..aef8ea3 100644
--- a/src/maasserver/static/partials/settings.html
+++ b/src/maasserver/static/partials/settings.html
@@ -36,7 +36,7 @@
                 <thead>
                     <tr>
                         <th class="col-2">Name</th>
-                        <th class="col-2">Type</th> 
+                        <th class="col-2">Type</th>
                         <th class="col-4">Applies to</th>
                         <th class="col-1">Enabled</th>
                         <th class="col-3">Actions</th>
@@ -73,7 +73,7 @@
                             <button aria-label="Remove {$ snippet.name $}"
                                 data-ng-click="toggleMenu(); snippetEnterRemove(snippet)">Remove</button>
                         </td>
-                        <td class="p-table-expanding__panel" data-ng-if="editSnippet === snippet">
+                        <td class="p-table-expanding__panel col-12" data-ng-if="editSnippet === snippet">
                             <maas-obj-form obj="editSnippet" manager="snippetsManager" manager-method="updateItem"
                                 table-form="true" save-on-blur="false" after-save="snippetExitEdit">
                                 <div class="row u-equal-height">
@@ -138,7 +138,7 @@
                                 </div>
                             </maas-obj-form>
                         </td>
-                        <td class="p-table-expanding__panel u-no-margin--left" data-ng-if="deleteSnippet === snippet">
+                        <td class="p-table-expanding__panel col-12 u-no-margin--left" data-ng-if="deleteSnippet === snippet">
                             <div class="row u-hide u-show--small">
                                 <h2 data-ng-click="snippetExitRemove(snippet)" class="u-float--left">Removing {$ snippet.name $}</h2>
                                 <button data-ng-click="snippetExitRemove(snippet)" class="p-icon--close u-float--right"></button>
@@ -155,7 +155,7 @@
                         </td>
                     </tr>
                     <tr class="is-active" data-ng-if="newSnippet">
-                        <td class="p-table-expanding__panel" col-span="5">
+                        <td class="p-table-expanding__panel col-12" col-span="5">
                             <maas-obj-form obj="newSnippet" manager="snippetsManager" manager-method="createItem"
                                 table-form="true" save-on-blur="false" after-save="snippetAddCancel">
                                 <div class="row u-hide u-show--small">
@@ -374,7 +374,7 @@
                                     data-ng-click="toggleMenu(); repositoryEnterRemove(repository)">Remove</button>
                             </div>
                         </td>
-                        <td class="is-active p-table-expanding__panel" col-span="5" data-ng-if="editRepository === repository">
+                        <td class="is-active p-table-expanding__panel col-12" col-span="5" data-ng-if="editRepository === repository">
                             <maas-obj-form obj="editRepository" manager="packageRepositoriesManager" manager-method="updateItem"
                                 table-form="true" save-on-blur="false" after-save="repositoryExitEdit">
                                 <div class="row u-equal-height">
@@ -477,7 +477,7 @@
                         </td>
                     </tr>
                     <tr class="is-active" data-ng-if="newRepository">
-                        <td class="p-table-expanding__panel" col-span="5">
+                        <td class="p-table-expanding__panel col-12" col-span="5">
                             <maas-obj-form obj="newRepository" manager="packageRepositoriesManager" manager-method="createItem"
                                 table-form="true" save-on-blur="false" after-save="repositoryAddCancel">
                                 <div class="row u-equal-height">
diff --git a/src/maasserver/static/partials/ssh-keys.html b/src/maasserver/static/partials/ssh-keys.html
index 31f1096..910bdfb 100644
--- a/src/maasserver/static/partials/ssh-keys.html
+++ b/src/maasserver/static/partials/ssh-keys.html
@@ -27,7 +27,7 @@
                             <li data-ng-repeat="key in group.keys" data-ng-bind-html="trustAsHtml(key.display)"></li>
                         </ul>
                     </td>
-                    <td class="p-table-expanding__panel" data-ng-class="{ 'u-hide': group.id !== openRow || rowMode !== 'delete' }">
+                    <td class="p-table-expanding__panel col-12" data-ng-class="{ 'u-hide': group.id !== openRow || rowMode !== 'delete' }">
                         <div class="row u-equal-height">
                             <div class="col-8 u-vertically-center">
                                 <span data-ng-if="group.source !== 'upload'"><span class="p-icon p-icon--warning">Warning:</span> Are you sure you want to remove this key source?</span>
diff --git a/src/maasserver/static/partials/subnet-details.html b/src/maasserver/static/partials/subnet-details.html
index fa5b560..505a546 100755
--- a/src/maasserver/static/partials/subnet-details.html
+++ b/src/maasserver/static/partials/subnet-details.html
@@ -132,7 +132,7 @@
                                 <i class="p-icon--information">Help:</i>
                                 <span class="p-tooltip__message" role="tooltip">MAAS allocates IP addresses only from&#xa;the reserved ranges on this subnet.</span>
                             </span>
-                
+
                             <span data-ng-if="subnet.managed == true" class="p-tooltip p-tooltip--btm-right">
                                 <i class="p-icon--information">Help:</i>
                                 <span class="p-tooltip__message" role="tooltip">MAAS allocates IP addresses from&#xa;this subnet, excluding the reserved&#xa;and dynamic ranges.</span>
@@ -296,7 +296,7 @@
                                 data-ng-click="toggleMenu(); staticRouteEnterDeleteMode(staticRoute)"
                                 data-ng-if="!isStaticRouteInDeleteMode(staticRoute) && !isStaticRouteInEditMode(staticRoute)">Remove</button>
                         </td>
-                        <td class="p-table-expanding__panel" data-ng-if="isStaticRouteInDeleteMode(staticRoute)">
+                        <td class="p-table-expanding__panel col-12" data-ng-if="isStaticRouteInDeleteMode(staticRoute)">
                             <div data-ng-if="windowWidth <= 768">
                                 <h2 data-ng-click="staticRouteCancelDelete()" class="u-float--left">Remove {$ staticRoute.gateway_ip $}</h2>
                                 <i data-ng-click="staticRouteCancelDelete()" class="p-icon--close u-float--right"></i>
@@ -312,7 +312,7 @@
                                 </div>
                             </div>
                         </td>
-                        <td class="p-table-expanding__panel" data-ng-if="isStaticRouteInEditMode(staticRoute)">
+                        <td class="p-table-expanding__panel col-12" data-ng-if="isStaticRouteInEditMode(staticRoute)">
                             <maas-obj-form obj="staticRoute" manager="staticRoutesManager" table-form="true"
                                 save-on-blur="false" after-save="ipRangeClearEditMode">
                                 <div data-ng-if="windowWidth <= 768">
@@ -352,7 +352,7 @@
                         <td col-span="6">No static routes have been added to this subnet.</td>
                     </tr>
                     <tr class="is-active" data-ng-if="newStaticRoute">
-                        <td class="p-table-expanding__panel">
+                        <td class="p-table-expanding__panel col-12">
                             <maas-obj-form obj="newStaticRoute" manager="staticRoutesManager" manager-method="createItem"
                                 table-form="true" save-on-blur="false" after-save="cancelAddStaticRoute">
                                 <div data-ng-if="windowWidth <= 768">