Merge ~deadlight/maas:selected-nodes into ~deadlight/maas:vanilla

Proposed by Karl Williams
Status: Merged
Merged at revision: d44cfea316b801e07d140d2b05aca428415cb4a5
Proposed branch: ~deadlight/maas:selected-nodes
Merge into: ~deadlight/maas:vanilla
Diff against target: 126 lines (+40/-31)
2 files modified
src/maasserver/static/partials/nodes-list.html (+35/-31)
src/maasserver/static/scss/_maas.scss (+5/-0)
Reviewer Review Type Date Requested Status
Anthony Dillon (community) Approve
Karl Williams Pending
Review via email: mp+337374@code.launchpad.net

Description of the change

Fixed the display of the "X selected" notifications next to action buttons in headers.

QA:
 - Go to /MAAS/#/nodes
 - Select some nodes (checkboxes on the left of the list)
 - Behold the text and button in the header displayed inline

To post a comment you must log in.
Revision history for this message
Anthony Dillon (ya-bo-ng) wrote :

LGTM thanks.

review: Approve

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1diff --git a/src/maasserver/static/partials/nodes-list.html b/src/maasserver/static/partials/nodes-list.html
2index aebb1fc..c1e9d16 100644
3--- a/src/maasserver/static/partials/nodes-list.html
4+++ b/src/maasserver/static/partials/nodes-list.html
5@@ -17,13 +17,14 @@
6 data-ng-change="addHardwareOptionChanged()" data-default-title="Add hardware">
7 </div>
8 </div>
9- <div class="ng-hide" data-ng-show="tabs.nodes.selectedItems.length">
10- <a data-ng-click="showSelected('nodes')">{$ tabs.nodes.selectedItems.length $} Selected</a>
11- <div data-maas-cta="tabs.nodes.takeActionOptions"
12- data-ng-model="tabs.nodes.actionOption"
13- data-ng-change="actionOptionSelected('nodes')">
14- </div>
15- </div>
16+ <ul class="p-inline-list u-no-margin--top ng-hide" data-ng-show="tabs.nodes.selectedItems.length">
17+ <li class="p-inline-list__item">
18+ <a data-ng-click="showSelected('nodes')">{$ tabs.nodes.selectedItems.length $} selected</a>
19+ </li>
20+ <li class="p-inline-list__item">
21+ <span data-maas-cta="tabs.nodes.takeActionOptions" data-ng-model="tabs.nodes.actionOption" data-ng-change="actionOptionSelected('nodes')"></span>
22+ </li>
23+ </ul>
24 </div>
25
26 <!-- XXX ricgard 2016-06-16 - Need to add e2e test. -->
27@@ -36,13 +37,14 @@
28 data-ng-click="cancelAddDevice()"
29 data-ng-show="addDeviceScope.viewable">Cancel add device</button>
30 </div>
31- <div data-ng-show="tabs.devices.selectedItems.length">
32- <a data-ng-click="showSelected('devices')">{$ tabs.devices.selectedItems.length $} Selected</a>
33- <div data-maas-cta="tabs.devices.takeActionOptions"
34- data-ng-model="tabs.devices.actionOption"
35- data-ng-change="actionOptionSelected('devices')">
36- </div>
37- </div>
38+ <ul class="p-inline-list u-no-margin--top" data-ng-show="tabs.devices.selectedItems.length">
39+ <li class="p-inline-list__item">
40+ <a data-ng-click="showSelected('devices')">{$ tabs.devices.selectedItems.length $} selected&nbsp;</a>
41+ </li>
42+ <li class="p-inline-list__item">
43+ <span data-maas-cta="tabs.devices.takeActionOptions" data-ng-model="tabs.devices.actionOption" data-ng-change="actionOptionSelected('devices')"></span>
44+ </li>
45+ </ul>
46 </div>
47
48 <!-- XXX ricgard 2016-06-16 - Need to add e2e test. -->
49@@ -55,28 +57,30 @@
50 data-ng-click="tabs.controllers.addController = false"
51 data-ng-show="tabs.controllers.addController">Close add rack controller</button>
52 </div>
53- <div data-ng-show="tabs.controllers.selectedItems.length">
54- <a data-ng-click="showSelected('controllers')">{$ tabs.controllers.selectedItems.length $} Selected</a>
55- <div data-maas-cta="tabs.controllers.takeActionOptions"
56- data-ng-model="tabs.controllers.actionOption"
57- data-ng-change="actionOptionSelected('controllers')">
58- </div>
59- </div>
60+ <ul class="p-inline-list u-no-margin--top" data-ng-show="tabs.controllers.selectedItems.length">
61+ <li class="p-inline-list__item">
62+ <a data-ng-click="showSelected('controllers')">{$ tabs.controllers.selectedItems.length $} selected&nbsp;</a>
63+ </li>
64+ <li class="p-inline-list__item">
65+ <span data-maas-cta="tabs.controllers.takeActionOptions" data-ng-model="tabs.controllers.actionOption" data-ng-change="actionOptionSelected('controllers')"></span>
66+ </li>
67+ </ul>
68 </div>
69
70 <div class="page-header__controls u-no-margin--top u-float--right ng-hide" data-ng-show="currentpage === 'switches'">
71- <div class="ng-hide" data-ng-show="tabs.switches.selectedItems.length">
72- <a data-ng-click="showSelected('switches')">{$ tabs.switches.selectedItems.length $} Selected</a>
73- <div data-maas-cta="tabs.switches.takeActionOptions"
74- data-ng-model="tabs.switches.actionOption"
75- data-ng-change="actionOptionSelected('switches')">
76- </div>
77- </div>
78+ <ul class="p-inline-list u-no-margin--top ng-hide" data-ng-show="tabs.switches.selectedItems.length">
79+ <li class="p-inline-list__item">
80+ <a data-ng-click="showSelected('switches')">{$ tabs.switches.selectedItems.length $} selected&nbsp;</a>
81+ </li>
82+ <li class="p-inline-list__item">
83+ <span data-maas-cta="tabs.switches.takeActionOptions" data-ng-model="tabs.switches.actionOption" data-ng-change="actionOptionSelected('switches')"></span>
84+ </li>
85+ </ul>
86 </div>
87 </div>
88 </div>
89
90- <div class="row u-no-margin--top">
91+ <div class="row u-no-margin--top">
92 <div class="u-no-margin--top" data-ng-repeat="tab in ['nodes', 'switches']">
93 <!-- XXX ricgard 2016-06-16 - Need to add e2e test. -->
94 <div class="page-header__dropdown" data-ng-class="{ 'u-hide': !tabs[tab].actionOption }">
95@@ -687,7 +691,7 @@ sudo maas-rack register --url {$ tabs.controllers.registerUrl $} --secret {$ tab
96 <span class="p-tooltip__message" role="tooltip">A node known to MAAS, but is not deployable.</span>
97 </a>
98 </li>
99- <li class="p-tabs__item" role="presentation">
100+ <li class="p-tabs__item" role="presentation">
101 <a href="" class="p-tabs__link p-tooltip p-tooltip--top-center"
102 data-ng-if="isSuperUser()"
103 data-ng-class="{ 'is-active': currentpage === 'controllers'}"
104@@ -696,7 +700,7 @@ sudo maas-rack register --url {$ tabs.controllers.registerUrl $} --secret {$ tab
105 <span class="p-tooltip__message" role="tooltip">A node that provides MAAS services.</span>
106 </a>
107 </li>
108- <li class="p-tabs__item" role="presentation">
109+ <li class="p-tabs__item" role="presentation">
110 <a href="" class="p-tabs__link p-tooltip p-tooltip--top-center"
111 data-ng-if="showswitches"
112 data-ng-class="{ 'is-active': currentpage === 'switches'}"
113diff --git a/src/maasserver/static/scss/_maas.scss b/src/maasserver/static/scss/_maas.scss
114index 85bd177..d1c1eba 100644
115--- a/src/maasserver/static/scss/_maas.scss
116+++ b/src/maasserver/static/scss/_maas.scss
117@@ -233,4 +233,9 @@
118 font-size: 2.25rem;
119 line-height: 1.167;
120 }
121+
122+ //Fix for action buttons in headers
123+ .p-inline-list__item div {
124+ display: inline-block;
125+ }
126 }

Subscribers

People subscribed via source and target branches

to all changes: