Merge pull request #5537 from skateman/pf-4-support

Add support for PF4 styling through webpack

app/assets/stylesheets/patternfly_overrides.scss

@@ -60,9 +60,9 @@
 
 .resizer-box {
   bottom: 100px;
-  left: -18px;
+  left: -20px;
   position: absolute;
-  width: 38px;
+  width: 40px;
 }
 
 .resizer .btn {
@@ -826,6 +826,13 @@ td.action > .btn.btn-default {
   word-wrap: break-word;
 }
 
+/// override PF4 override of PF3 sidebar-pf
+.sidebar-pf {
+  background: #fafafa !important;
+  padding-right: 20px !important;
+  padding-left: 20px !important;
+}
+
 /// Panel in sidebar doesn't need bottom margin
 .sidebar-pf-left {
   .panel-group {

app/javascript/packs/application-common.js

@@ -22,6 +22,8 @@ import { history } from '../miq-component/react-history.ts';
 import createReduxRoutingActions from '../miq-redux/redux-router-actions';
 import { formButtonsActionTypes, createFormButtonsActions } from '../forms/form-buttons-reducer';
 
+import '../../stylesheet/application-webpack.scss';
+
 ManageIQ.component = {
   ...newRegistry,
   reactBlueprint,

app/stylesheet/application-webpack.scss

@@ -0,0 +1,6 @@
+$pf-global--enable-reset: false;
+$pf-global--disable-fontawesome: true;
+
+@import '~@fortawesome/fontawesome-free/css/all.css';
+@import '~@fortawesome/fontawesome-free/scss/v4-shims.scss';
+@import '~@patternfly/patternfly-next/patternfly.scss';

package.json

@@ -23,8 +23,10 @@
   "dependencies": {
     "@data-driven-forms/pf3-component-mapper": "^1.9.9",
     "@data-driven-forms/react-form-renderer": "^1.9.9",
-    "@manageiq/ui-components": "~1.2.4",
+    "@fortawesome/fontawesome-free": "^5.8.1",
     "@manageiq/react-ui-components": "~0.11.14",
+    "@manageiq/ui-components": "~1.2.4",
+    "@patternfly/patternfly": "^2.6.6",
     "@pf3/select": "~1.12.6",
     "@pf3/timeline": "~1.0.8",
     "angular": "~1.6.6",