Update overview page to use new UI patterns

- Use page, section, list-pair to establish
  consistent layout
- Update header and overview page to use new
  caret icon
- Reordered Server and BMC information to
  accomodate small screen views
- Added chevron icons to create consistency
  between header and server overview page
  quick links
- Changed edit hostname text to use the
  standard icon
- Added OR operator to short circuit the server
  model, server serial number, and server manufacturer
  to display N/A if the information is not available

Change-Id: I6619f5369ff290555142e85aa432e901c4f93d2d
Signed-off-by: Derick Montague <derick.montague@ibm.com>

1 files changed, 8 insertions, 4 deletions

diff --git a/app/server-control/controllers/power-usage-controller.html b/app/server-control/controllers/power-usage-controller.html
index b0760e0..1a2a4b5 100644
--- a/app/server-control/controllers/power-usage-controller.html
+++ b/app/server-control/controllers/power-usage-controller.html
@@ -3,16 +3,20 @@
   <h1 class="page-title">Manage Power Usage</h1>
   <form class="power-usage__form" role="form" action="">
     <section class="section">
-      <h2 class="section-title">Power information</h2>
+      <div class="section-header">
+        <h2 class="section-title">Power information</h2>
+      </div>
       <dl class="list-pair">
         <dt>Power Consumption</dt>
         <dd>{{ power_consumption }}</dd>
       </dl>
     </section>
     <section class="section">
-      <h2 class="section-title">
-        Server power cap setting
-      </h2>
+      <div class="section-header">
+        <h2 class="section-title">
+          Server power cap setting
+        </h2>
+      </div>
       <div class="section-content">
         <p>
           Set a power cap to keep power consumption at or below the specified