cleanup for ng create volume workflow

- cleanup help text in workflow and slide-out help panel (it's repetitive)
- add required asterisk to some form labels
- remove unnecessary css styles
- remove unnecessary eslint-disable/enable flags

Change-Id: I7de0dc7ee19816392003242431459eb73d141555
Closes-Bug: #1560594

openstack_dashboard/static/app/core/images/_images.scss

@@ -12,11 +12,3 @@ table[ng-controller="horizon.app.core.images.table.ImagesController as table"] {
   max-height: 30em;
 }
 
-.workflow-step-radiator {
-  margin-left: 10px;
-  .radiator-title {
-    color: #555;
-    font-weight: 600;
-    font-size: 0.9em;
-  }
-}

openstack_dashboard/static/app/core/images/steps/create-volume/create-volume.help.html

@@ -1,10 +0,0 @@
-<div>
-  <h3 translate>Description:</h3>
-  <p translate>
-    Volumes are block devices that can be attached to instances.
-  </p>
-  <p>
-    <strong translate>Volume Type Description: </strong>
-    <translate>If "No volume type" is selected, the volume will be created without a volume type.</translate>
-  </p>
-</div>

openstack_dashboard/static/app/core/images/steps/create-volume/create-volume.html

@@ -1,50 +1,55 @@
 <div ng-controller="horizon.app.core.images.steps.CreateVolumeController as createVolumeCtrl">
-  <h1 translate>Volume Details</h1>
-
-  <!--content-->
-  <div class="content">
-    <div class="subtitle" translate>Volumes are block devices that can be attached to instances.</div>
-
+  <p translate>Volumes are block devices that can be attached to instances.</p>
   <fieldset ng-disabled="createVolumeCtrl.volumeQuota.overMax">
-      <div class="col-md-11 col-lg-11">
-        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
+    <div class="row">
+      <div class="col-xs-6">
         <div class="form-group">
-            <div class="form-field required">
-              <label class="control-label" translate>Name</label>
+          <label class="control-label">
+            <span translate>Name</span>
+            <span class="hz-icon-required fa fa-asterisk"></span>
+          </label>
           <input class="form-control" type="text" ng-required="true" ng-model="createVolumeCtrl.volume.name">
         </div>
-          </div>
         <div class="form-group">
-            <label class="control-label" translate>Description</label>
+          <label class="control-label">
+            <span translate>Description</span>
+          </label>
           <input class="form-control" type="text" ng-model="createVolumeCtrl.volume.description">
         </div>
         <div class="form-group">
-            <label class="control-label" translate>Use image as a source</label>
+          <label class="control-label">
+            <span translate>Use image as a source</span>
+          </label>
           <input class="form-control" type="text" ng-model="createVolumeCtrl.sourceImage"  disabled>
         </div>
         <div class="row">
-            <div class="col-md-6 col-lg-6">
+          <div class="col-xs-6">
             <div class="form-group">
-                <label class="control-label" translate>Type</label>
+              <label class="control-label">
+                <span translate>Type</span>
+              </label>
               <select class="form-control"
                       ng-model="createVolumeCtrl.volumeType"
                       ng-options="volumeType as volumeType.name for volumeType in createVolumeCtrl.volumeTypes">
               </select>
             </div>
           </div>
-            <div class="col-md-6 col-lg-6">
+          <div class="col-xs-6">
             <div class="form-group">
-                <div class="form-field required">
-                  <label class="control-label required" translate>Size (GB)</label>
-                  <input name="volume-size" class="form-control" type="number" min="1" ng-required="true" ng-model="createVolumeCtrl.volume.size">
-                </div>
+              <label for="volume-size" class="control-label">
+                <span translate>Size (GB)</span>
+                <span class="hz-icon-required fa fa-asterisk"></span>
+              </label>
+              <input name="volume-size" class="form-control" id="volume-size" type="number" min="1" ng-required="true" ng-model="createVolumeCtrl.volume.size">
             </div>
           </div>
         </div>
         <div class="form-group">
-            <div class="form-field required">
-              <label class="control-label" translate>Availability Zone</label>
-              <select class="form-control" ng-model="createVolumeCtrl.volume.availability_zone" ng-required="true">
+          <label for="availability-zone" class="control-label">
+            <span translate>Availability Zone</span>
+            <span class="hz-icon-required fa fa-asterisk"></span>
+          </label>
+          <select class="form-control" id="availability-zone" ng-model="createVolumeCtrl.volume.availability_zone" ng-required="true">
             <option value="" selected="selected" translate>Select a zone</option>
             <option ng-repeat="availabilityZone in createVolumeCtrl.availabilityZones"
                     ng-value="availabilityZone.zoneName">
@@ -53,27 +58,17 @@
           </select>
         </div>
       </div>
-        </div>
-        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
-          <div class="form-group">
-            <div class="chart">
+      <div class="col-xs-6">
         <pie-chart chart-data="createVolumeCtrl.storageQuota"></pie-chart>
       </div>
-          </div>
-          <div class="form-group">
-            <div class="chart">
+      <div class="col-xs-6">
         <pie-chart chart-data="createVolumeCtrl.volumeQuota"></pie-chart>
-            </div>
-          </div>
-          <div class="form-group workflow-step-radiator">
-            <p class="radiator-title" translate>Volume Type Description:</p>
+        <p translate>Volume Type Description:</p>
         <dl class>
           <dt>{$ createVolumeCtrl.volumeType.name $}</dt>
           <dd>{$ createVolumeCtrl.volumeType.description $}</dd>
         </dl>
       </div>
     </div>
-      </div>
   </fieldset>
-  </div>
 </div>

openstack_dashboard/static/app/core/images/steps/edit-image/edit-image.html

@@ -44,7 +44,10 @@
       <div class="row form-group">
         <div class="col-xs-6 col-sm-6">
           <div class="form-group required">
-            <label class="control-label required" for="imageForm-format" translate>Format</label>
+            <label class="control-label required" for="imageForm-format">
+              <span translate>Format</span>
+              <span class="hz-icon-required fa fa-asterisk"></span>
+            </label>
             <select class="form-control switchable ng-pristine ng-untouched ng-valid" ng-required="true" id="imageForm-format" name="format" ng-model="ctrl.image_format" ng-options="key as label for (key, label) in ctrl.imageFormats" ng-change="ctrl.setFormats()">
             </select>
           </div>

openstack_dashboard/static/app/core/images/workflows/create-volume.service.js

@@ -43,7 +43,6 @@
         {
           title: gettext('Volume Details'),
           templateUrl: basePath + 'steps/create-volume/create-volume.html',
-          helpUrl: basePath + 'steps/create-volume/create-volume.help.html',
           formName: 'volumeForm'
         }
       ]

openstack_dashboard/static/app/core/workflow/decorator.service.js

@@ -19,7 +19,6 @@
 
   var forEach = angular.forEach;
 
-  /* eslint-disable max-len */
   /**
    * @ngdoc factory
    * @name horizon.app.core.workflow.factory:horizon.app.core.workflow.decorator
@@ -43,7 +42,6 @@
    * @returns {Object} The decorated workflow specification object, the same
    * reference to the input spec object.
    */
-  /* eslint-ensable max-len */
   angular
     .module('horizon.app.core.workflow')
     .factory('horizon.app.core.workflow.decorator', dashboardWorkflowDecorator);

openstack_dashboard/static/app/core/workflow/workflow.module.js

@@ -16,7 +16,6 @@
 (function () {
   'use strict';
 
-  /* eslint-disable max-len */
   /**
    * @ngdoc overview
    * @name horizon.app.core.workflow
@@ -27,7 +26,6 @@
    * This module provides utility function factory `dashboardWorkflow` and
    * `dashboardWorkflowDecorator`.
    */
-  /* eslint-enable max-len */
   angular.module('horizon.app.core.workflow', []);
 
 })();