Bump patternfly version to 3.31.1 (includes SASS support)

Fixes for wizard and accordion with latest patternfly

Author: jeff-phillips-18

bower.json

@@ -44,7 +44,7 @@
     "angular-bootstrap": "0.14.x",
     "lodash": "3.x",
     "jquery": "2.x",
-    "patternfly": "~3.25.0"
+    "patternfly": "~3.31.1"
   },
   "devDependencies": {
     "angular-mocks": "1.3.0 - 1.5.*",

package.json

@@ -18,7 +18,7 @@
     "angular-ui-bootstrap": "0.14.x",
     "jquery": "^2.2.4",
     "lodash": "3.x",
-    "patternfly": "~3.25.0"
+    "patternfly": "~3.31.1"
   },
   "devDependencies": {
     "express": "3.4.4",

src/wizard/wizard-directive.js

@@ -64,10 +64,10 @@
         </div>
         <div pf-wizard-substep step-title="Details - Extra" next-enabled="true" step-id="details-extra" step-priority="1" show-review="true" show-review-details="true" review-template="review-second-template.html">
           <form class="form-horizontal">
-            <div pf-form-group pf-label="Lorem" required>
+            <div pf-form-group pf-label="Lorem" pf-label-class="col-sm-3 col-md-2" pf-input-class="col-sm-9 col-md-10" required>
               <input id="new-lorem" name="lorem" ng-model="data.lorem" type="text" required/>
             </div>
-            <div pf-form-group pf-label="Ipsum">
+            <div pf-form-group pf-label="Ipsum" pf-label-class="col-sm-3 col-md-2" pf-input-class="col-sm-9 col-md-10">
               <input id="new-ipsum" name="ipsum" ng-model="data.ipsum" type="text" />
             </div>
           </form>
@@ -76,10 +76,10 @@
       <div pf-wizard-step step-title="Second Step" substeps="false" step-id="configuration" step-priority="1" show-review="true" review-template="review-second-template.html" >
         <form class="form-horizontal">
           <h3>Wizards should make use of substeps consistently throughout (either using them or not using them).  This is an example only.</h3>
-          <div pf-form-group pf-label="Lorem">
+          <div pf-form-group pf-label="Lorem" pf-label-class="col-sm-3 col-md-2" pf-input-class="col-sm-9 col-md-10">
             <input id="new-lorem" name="lorem" ng-model="data.lorem" type="text"/>
           </div>
-          <div pf-form-group pf-label="Ipsum">
+          <div pf-form-group pf-label="Ipsum" pf-label-class="col-sm-3 col-md-2" pf-input-class="col-sm-9 col-md-10">
             <input id="new-ipsum" name="ipsum" ng-model="data.ipsum" type="text" />
           </div>
         </form>
@@ -94,10 +94,10 @@
     <div ng-controller="DetailsGeneralController">
        <div pf-wizard-substep step-title="General" next-enabled="detailsGeneralComplete" step-id="details-general" step-priority="0" on-show="onShow" review-template="{{reviewTemplate}}" show-review-details="true">
          <form class="form-horizontal">
-           <div pf-form-group pf-label="Name" required>
+           <div pf-form-group pf-label="Name" pf-label-class="col-sm-3 col-md-2" pf-input-class="col-sm-9 col-md-10" required>
             <input id="new-name" name="name" ng-model="data.name" type="text" ng-change="updateName()" required/>
            </div>
-           <div pf-form-group pf-label="Description">
+           <div pf-form-group pf-label="Description" pf-label-class="col-sm-3 col-md-2" pf-input-class="col-sm-9 col-md-10">
             <input id="new-description" name="description" ng-model="data.description" type="text" />
            </div>
          </form>

src/wizard/wizard-step.html

@@ -1,4 +1,4 @@
-<section ng-show="selected" ng-class="{current: selected, done: completed}">
+<section ng-show="selected" class="wizard-pf-row" ng-class="{current: selected, done: completed}" style="height: inherit;">
   <div ng-if="!wizard.hideSidebar" class="wizard-pf-sidebar" ng-style="contentStyle"  ng-class="wizard.sidebarClass" ng-if="substeps === true">
     <ul class="list-group">
       <li class="list-group-item" ng-class="{active: step.selected}" ng-repeat="step in getEnabledSteps()">

src/wizard/wizard.html

@@ -1,9 +1,9 @@
 <div>
   <div class="modal-header" ng-if="!hideHeader">
-    <button type="button" class="close wizard-pf-dismiss" aria-label="Close" ng-click="onCancel()" ng-if="!embedInPage">
-      <span aria-hidden="true">&times;</span>
+    <button type="button" class="close wizard-pf-dismiss" aria-hidden="true" aria-label="Close" ng-click="onCancel()" ng-if="!embedInPage">
+       <span class="pficon pficon-close"></span>
     </button>
-    <dt class="modal-title">{{title}}</dt>
+    <h4 class="modal-title">{{title}}</h4>
   </div>
   <div class="modal-body wizard-pf-body clearfix">
     <!-- step area -->
@@ -13,6 +13,7 @@
           <a ng-click="stepClick(step)" ng-class="{'disabled': !allowStepIndicatorClick(step)}">
             <span class="wizard-pf-step-number">{{$index + 1}}</span>
             <span class="wizard-pf-step-title">{{step.title}}</span>
+            <span class="wizard-pf-step-title-substep" ng-repeat="substep in step.steps track by $index" ng-class="{'active': substep.selected}">{{substep.title}}</span>
           </a>
         </li>
       </ul>

styles/angular-patternfly.css

@@ -426,6 +426,12 @@ accordion > .panel-group .panel-default .panel-title > a:before {
 accordion > .panel-group .panel-open .panel-title > a:before {
   content: "\f107";
 }
+uib-accordion > .panel-group .panel-default .panel-title > a:before {
+  content: "\f105";
+}
+uib-accordion > .panel-group .panel-open .panel-title > a:before {
+  content: "\f107";
+}
 
 .navbar-brand-txt {
   line-height: 34px;