Merge ~ya-bo-ng/maas:style-dhcp-info-vlan-details into maas:master

Proposed by Anthony Dillon
Status: Merged
Approved by: Blake Rouse
Approved revision: 1d34d7600828d8c6f96a058bfcc5158cffab5e92
Merge reported by: MAAS Lander
Merged at revision: not available
Proposed branch: ~ya-bo-ng/maas:style-dhcp-info-vlan-details
Merge into: maas:master
Diff against target: 114 lines (+35/-29)
1 file modified
src/maasserver/static/partials/vlan-details.html (+35/-29)
Reviewer Review Type Date Requested Status
Blake Rouse (community) Approve
MAAS Lander Approve
Review via email: mp+343358@code.launchpad.net

Commit message

Styled the DHCP section of the VLAN details page

Description of the change

Replaced the definition list styling with horizontal key value styling.

To post a comment you must log in.
1d34d76... by Anthony Dillon

Fix up VLAN details header actions

Revision history for this message
Anthony Dillon (ya-bo-ng) wrote :

Also improved the styling in the VLAN details page

Revision history for this message
MAAS Lander (maas-lander) wrote :

UNIT TESTS
-b style-dhcp-info-vlan-details lp:~ya-bo-ng/maas/+git/maas into -b master lp:~maas-committers/maas

STATUS: SUCCESS
COMMIT: 1d34d7600828d8c6f96a058bfcc5158cffab5e92

review: Approve
Revision history for this message
Blake Rouse (blake-rouse) wrote :

Looks good.

review: Approve

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
diff --git a/src/maasserver/static/partials/vlan-details.html b/src/maasserver/static/partials/vlan-details.html
index 8a2826a..31fce98 100644
--- a/src/maasserver/static/partials/vlan-details.html
+++ b/src/maasserver/static/partials/vlan-details.html
@@ -20,6 +20,8 @@
20 </div>20 </div>
21 </div>21 </div>
22 </div>22 </div>
23 </div>
24 <div class="row">
23 <div class="page-header__dropdown" data-ng-class="{ 'is-open': vlanDetails.actionOption }" data-ng-if="vlanDetails.actionOption">25 <div class="page-header__dropdown" data-ng-class="{ 'is-open': vlanDetails.actionOption }" data-ng-if="vlanDetails.actionOption">
24 <div class="row">26 <div class="row">
25 <section class="page-header__section" data-ng-if="vlanDetails.actionOption.name === 'enable_dhcp'">27 <section class="page-header__section" data-ng-if="vlanDetails.actionOption.name === 'enable_dhcp'">
@@ -193,33 +195,28 @@
193 </form>195 </form>
194 </section>196 </section>
195 </div>197 </div>
196 <div class="row">198 <div class="row u-no-margin--top">
197 <section class="page-header__section col-12" data-ng-if="!vlanDetails.isActionError()">199 <section class="page-header__section col-12" data-ng-if="!vlanDetails.isActionError()">
198 <p class="page-header__message page-header__message--warning"200 <p class="col-8" data-ng-if="vlanDetails.actionOption.name === 'disable_dhcp' && vlanDetails.vlan.dhcp_on">
199 data-ng-if="vlanDetails.actionOption.name === 'disable_dhcp' && vlanDetails.vlan.dhcp_on">201 <i class="p-icon--warning">Warning:</i> Are you sure you want to disable DHCP on this VLAN? All subnets on this VLAN will be affected.
200 Are you sure you want to disable DHCP on this VLAN? All subnets on this VLAN will be affected.
201 </p>202 </p>
202 <p class="page-header__message page-header__message--warning"203 <p class="col-8" data-ng-if="vlanDetails.actionOption.name === 'disable_dhcp' && vlanDetails.vlan.relay_vlan">
203 data-ng-if="vlanDetails.actionOption.name === 'disable_dhcp' && vlanDetails.vlan.relay_vlan">204 <i class="p-icon--warning">Warning:</i> Are you sure you want to disable DHCP relay on this VLAN? All subnets on this VLAN will be affected.
204 Are you sure you want to disable DHCP relay on this VLAN? All subnets on this VLAN will be affected.
205 </p>205 </p>
206 <p class="page-header__message page-header__message--error"206 <p class="col-8" data-ng-if="vlanDetails.actionOption.name === 'enable_dhcp' && vlanDetails.relatedSubnets.length === 0">
207 data-ng-if="vlanDetails.actionOption.name === 'enable_dhcp' && vlanDetails.relatedSubnets.length === 0">207 <i class="p-icon--error">Error:</i> No subnets are available on this VLAN. DHCP cannot be enabled.
208 No subnets are available on this VLAN. DHCP cannot be enabled.
209 </p>208 </p>
210 <p class="page-header__message page-header__message--warning"209 <p class="col-8" data-ng-if="vlanDetails.actionOption.name === 'delete'">
211 data-ng-if="vlanDetails.actionOption.name === 'delete'">210 <i class="p-icon--warning">Warning:</i> Are you sure you want to delete this VLAN?
212 Are you sure you want to delete this VLAN?
213 </p>211 </p>
214 <div class="page-header__controls">212 <div class="page-header__controls u-no-margin--top">
215 <button class="button--base button--inline" type="button" data-ng-click="vlanDetails.actionCancel()">Cancel</button>213 <button class="p-button--base" type="button" data-ng-click="vlanDetails.actionCancel()">Cancel</button>
216 <button class="button--inline" data-ng-class="vlanDetails.actionOption.name === 'delete' ? 'button--destructive' : 'button--positive'" data-ng-click="vlanDetails.actionGo()" data-ng-disabled="!vlanDetails.canPerformAction()">{$ vlanDetails.actionOption.title $}</button>214 <button data-ng-class="vlanDetails.actionOption.name === 'delete' ? 'p-button--negative' : 'button--positive'" data-ng-click="vlanDetails.actionGo()" data-ng-disabled="!vlanDetails.canPerformAction()">{$ vlanDetails.actionOption.title $}</button>
217 </div>215 </div>
218 </section>216 </section>
219 </div>217 </div>
220 <div class="row">218 <div class="row" data-ng-if="vlanDetails.isActionError()">
221 <section class="page-header__section col-12"219 <section class="page-header__section col-12">
222 data-ng-if="vlanDetails.isActionError()">
223 <p class="page-header__message page-header__message--error">{$ vlanDetails.actionError $}</p>220 <p class="page-header__message page-header__message--error">{$ vlanDetails.actionError $}</p>
224 <div class="page-header__controls">221 <div class="page-header__controls">
225 <button class="button--base button--inline u-margin--right" type="button" data-ng-click="vlanDetails.actionCancel()">Cancel</button>222 <button class="button--base button--inline u-margin--right" type="button" data-ng-click="vlanDetails.actionCancel()">Cancel</button>
@@ -366,7 +363,7 @@
366 </div>363 </div>
367 </div>364 </div>
368 <div class="p-form p-form--stacked row">365 <div class="p-form p-form--stacked row">
369 <div class="col-6">366 <div class="col-8">
370 <div class="p-form__group">367 <div class="p-form__group">
371 <div class="p-form__label">368 <div class="p-form__label">
372 <p><strong>Status</strong></p>369 <p><strong>Status</strong></p>
@@ -390,25 +387,34 @@
390 </p>387 </p>
391 </div>388 </div>
392 </div>389 </div>
393 <div data-ng-if="vlanDetails.primaryRack">390 <div class="p-form__group" data-ng-if="vlanDetails.primaryRack">
394 <dt>Primary controller391 <div class="p-form__label">
392 <p>
393 <strong>Primary controller</strong>
395 <span class="p-tooltip p-tooltip--top-center">394 <span class="p-tooltip p-tooltip--top-center">
396 <i class="p-icon--help">Help:</i>395 <i class="p-icon--help">Help:</i>
397 <span class="p-tooltip__message" role="tooltip">The rack controller where DHCP service runs on.</span>396 <span class="p-tooltip__message" role="tooltip">The rack controller where DHCP service runs on.</span>
398 </span>397 </span>
399 </dt>398 </p>
400 <dd>{$ vlanDetails.primaryRack.hostname $}</dd>399 </div>
400 <div class="p-form__control">
401 <p>{$ vlanDetails.primaryRack.hostname $}</p>
401 </div>402 </div>
402 <div data-ng-if="vlanDetails.secondaryRack">403 </div>
403 <dt>Secondary controller404 <div class="p-form__group" data-ng-if="vlanDetails.secondaryRack">
405 <div class="p-form__label">
406 <p>
407 <strong>Secondary controller</strong>
404 <span class="p-tooltip p-tooltip--top-center">408 <span class="p-tooltip p-tooltip--top-center">
405 <i class="p-icon--help">Help:</i>409 <i class="p-icon--help">Help:</i>
406 <span class="p-tooltip__message" role="tooltip">The rack controller that will take over DHCP services if the primary fails.</span>410 <span class="p-tooltip__message" role="tooltip">The rack controller that will take over DHCP services if the primary fails.</span>
407 </span>411 </span>
408 </dt>412 </p>
409 <dd>{$ vlanDetails.secondaryRack.hostname $}</dd>
410 </div>413 </div>
411 </dl>414 <div class="p-form__control">
415 <p>{$ vlanDetails.secondaryRack.hostname $}</p>
416 </div>
417 </div>
412 </div>418 </div>
413 </div>419 </div>
414 </section>420 </section>

Subscribers

People subscribed via source and target branches