more updates

kubevirt · Apr 14, 2019 · c06e87a · c06e87a
2 parents c9b8232 + ff3d7b9
commit c06e87a
Show file tree

Hide file tree

Showing 30 changed files with 129 additions and 120 deletions.
diff --git a/sass/components/ClusterOverview/health.scss b/sass/components/ClusterOverview/health.scss
@@ -1,23 +1,26 @@
+/* stylelint-disable plugin/selector-bem-pattern */
 .kubevirt-cluster-overview__health-grid {
   display: flex;
   margin-bottom: 1rem;
+
   > * {
-    flex:1;
+    flex: 1;
   }
 }
 
-.kubevirt-health__body, .kubevirt-compliance__body {
+.kubevirt-health__body,
+.kubevirt-compliance__body {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
 }
+
 .kubevirt-health__text {
   font-size: 0.875rem;
 }
 
 .kubevirt-health__icon--error {
   color: #c9190b;
-
 }
 
 .kubevirt-health__icon--ok {

diff --git a/sass/components/Dashboard/dashboard.scss b/sass/components/Dashboard/dashboard.scss
@@ -1,5 +1,5 @@
 .kubevirt-dashboard__body {
-  background-color:#ededed;
+  background-color: #ededed;
   padding: 1rem;
 
   .pf-l-grid {
@@ -11,11 +11,8 @@
   }
 }
 
-.kubevirt-dashboard__card {
-
-  .card-pf-title {
-    font-size: 1rem;
-  }
+.kubevirt-dashboard__card-title {
+  font-size: 1rem;
 }
 
 .kubevirt-dashboard__card-heading {

diff --git a/sass/components/Dashboard/detail.scss b/sass/components/Dashboard/detail.scss
@@ -1,7 +1,7 @@
 .kubevirt-detail__item-title {
   float: left;
   clear: left;
-  width: 150px;
+  // width: 150px;
   margin-bottom: 5px;
   font-size: 14px;
   text-transform: capitalize;

diff --git a/src/components/ClusterOverview/Alerts/tests/__snapshots__/Alerts.test.js.snap b/src/components/ClusterOverview/Alerts/tests/__snapshots__/Alerts.test.js.snap
@@ -7,7 +7,9 @@ exports[`<Alerts /> renders correctly 1`] = `
   <DashboardCardHeader
     className={null}
   >
-    <DashboardCardTitle>
+    <DashboardCardTitle
+      className={null}
+    >
       Alerts
     </DashboardCardTitle>
   </DashboardCardHeader>

diff --git a/src/components/ClusterOverview/Capacity/tests/__snapshots__/Capacity.test.js.snap b/src/components/ClusterOverview/Capacity/tests/__snapshots__/Capacity.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Capacity /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Capacity
     </h2>
@@ -100,7 +100,7 @@ exports[`<Capacity /> renders correctly in Loading state 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Capacity
     </h2>

diff --git a/src/components/ClusterOverview/ClusterOverview.js b/src/components/ClusterOverview/ClusterOverview.js
@@ -18,40 +18,20 @@ import { AlertsConnected } from './Alerts/Alerts';
 
 const MainCards = () => (
   <GridItem lg={6} md={12} sm={12}>
-    <Grid>
-      <GridItem span={12}>
-        <Grid className="kubevirt-cluster-overview__health-grid">
-          <GridItem span={6}>
-            <HealthConnected />
-          </GridItem>
-          <GridItem span={6}>
-            <ComplianceConnected />
-          </GridItem>
-          <GridItem span={12}>
-            <AlertsConnected className="kubevirt-cluster-overview__card--top-border" />
-          </GridItem>
-        </Grid>
-      </GridItem>
-      <GridItem span={12}>
-        <CapacityConnected />
-      </GridItem>
-      <GridItem span={12}>
-        <UtilizationConnected />
-      </GridItem>
-    </Grid>
+    <div className="kubevirt-cluster-overview__health-grid">
+      <HealthConnected />
+      <ComplianceConnected />
+      <AlertsConnected className="kubevirt-cluster-overview__card--top-border" />
+    </div>
+    <CapacityConnected />
+    <UtilizationConnected />
   </GridItem>
 );
 
 const LeftCards = () => (
   <GridItem key="left" lg={3} md={12} sm={12}>
-    <Grid>
-      <GridItem lg={12} md={6} sm={12}>
-        <DetailsConnected />
-      </GridItem>
-      <GridItem lg={12} md={6} sm={12}>
-        <InventoryConnected />
-      </GridItem>
-    </Grid>
+    <DetailsConnected className="kubevirt-cluster-overview__card--details" />
+    <InventoryConnected />
   </GridItem>
 );
 

diff --git a/src/components/ClusterOverview/Compliance/tests/__snapshots__/Compliance.test.js.snap b/src/components/ClusterOverview/Compliance/tests/__snapshots__/Compliance.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Compliance /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Compliance
     </h2>

diff --git a/src/components/ClusterOverview/Details/tests/__snapshots__/Details.test.js.snap b/src/components/ClusterOverview/Details/tests/__snapshots__/Details.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Details /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Details
     </h2>

diff --git a/src/components/ClusterOverview/Events/tests/__snapshots__/Events.test.js.snap b/src/components/ClusterOverview/Events/tests/__snapshots__/Events.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Events /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading kubevirt-events__card-header"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Events
     </h2>
@@ -18,7 +18,7 @@ exports[`<Events /> renders correctly 1`] = `
     >
       <span
         aria-hidden="true"
-        class="fa fa-info-circle fa-2x"
+        class="fa fa-info-circle kubevirt-dashboard__icon-sm"
       />
     </button>
   </div>

diff --git a/src/components/ClusterOverview/Health/tests/__snapshots__/Health.test.js.snap b/src/components/ClusterOverview/Health/tests/__snapshots__/Health.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Health /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Health
     </h2>

diff --git a/src/components/ClusterOverview/Health/tests/__snapshots__/HealthBody.test.js.snap b/src/components/ClusterOverview/Health/tests/__snapshots__/HealthBody.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Health /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Health
     </h2>

diff --git a/src/components/ClusterOverview/Inventory/tests/__snapshots__/Inventory.test.js.snap b/src/components/ClusterOverview/Inventory/tests/__snapshots__/Inventory.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Inventory /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster inventory
     </h2>
@@ -18,7 +18,7 @@ exports[`<Inventory /> renders correctly 1`] = `
     >
       <span
         aria-hidden="true"
-        class="fa fa-info-circle fa-2x"
+        class="fa fa-info-circle kubevirt-dashboard__icon-sm"
       />
     </button>
   </div>
@@ -42,7 +42,7 @@ exports[`<Inventory /> renders correctly 1`] = `
         >
           <span
             aria-hidden="true"
-            class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+            class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
           />
           <span
             class="kubevirt-inventory__row-status-item-text"
@@ -84,7 +84,7 @@ exports[`<Inventory /> renders correctly 1`] = `
         >
           <span
             aria-hidden="true"
-            class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+            class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
           />
           <span
             class="kubevirt-inventory__row-status-item-text"
@@ -111,7 +111,7 @@ exports[`<Inventory /> renders correctly 1`] = `
         >
           <span
             aria-hidden="true"
-            class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+            class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
           />
           <span
             class="kubevirt-inventory__row-status-item-text"
@@ -151,7 +151,7 @@ exports[`<Inventory /> renders correctly 1`] = `
         >
           <span
             aria-hidden="true"
-            class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+            class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
           />
           <span
             class="kubevirt-inventory__row-status-item-text"

diff --git a/src/components/ClusterOverview/TopConsumers/tests/__snapshots__/TopConsumers.test.js.snap b/src/components/ClusterOverview/TopConsumers/tests/__snapshots__/TopConsumers.test.js.snap
@@ -8,7 +8,7 @@ exports[`<TopConsumers /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Top Consumers
     </h2>
@@ -18,7 +18,7 @@ exports[`<TopConsumers /> renders correctly 1`] = `
     >
       <span
         aria-hidden="true"
-        class="fa fa-info-circle fa-2x"
+        class="fa fa-info-circle kubevirt-dashboard__icon-sm"
       />
     </button>
   </div>

diff --git a/src/components/ClusterOverview/Utilization/tests/__snapshots__/Utilization.test.js.snap b/src/components/ClusterOverview/Utilization/tests/__snapshots__/Utilization.test.js.snap
@@ -8,7 +8,7 @@ exports[`<Utilization /> renders correctly 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Utilization
     </h2>
@@ -119,7 +119,7 @@ exports[`<Utilization /> renders correctly in Loading state 1`] = `
     class="card-pf-heading kubevirt-dashboard__card-heading"
   >
     <h2
-      class="card-pf-title"
+      class="card-pf-title kubevirt-dashboard__card-title"
     >
       Cluster Utilization
     </h2>

diff --git a/src/components/ClusterOverview/tests/__snapshots__/ClusterOverview.test.js.snap b/src/components/ClusterOverview/tests/__snapshots__/ClusterOverview.test.js.snap
@@ -24,7 +24,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 class="card-pf-heading kubevirt-dashboard__card-heading"
               >
                 <h2
-                  class="card-pf-title"
+                  class="card-pf-title kubevirt-dashboard__card-title"
                 >
                   Details
                 </h2>
@@ -83,7 +83,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 class="card-pf-heading kubevirt-dashboard__card-heading"
               >
                 <h2
-                  class="card-pf-title"
+                  class="card-pf-title kubevirt-dashboard__card-title"
                 >
                   Cluster inventory
                 </h2>
@@ -93,7 +93,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 >
                   <span
                     aria-hidden="true"
-                    class="fa fa-info-circle fa-2x"
+                    class="fa fa-info-circle kubevirt-dashboard__icon-sm"
                   />
                 </button>
               </div>
@@ -117,7 +117,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                     >
                       <span
                         aria-hidden="true"
-                        class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+                        class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
                       />
                       <span
                         class="kubevirt-inventory__row-status-item-text"
@@ -159,7 +159,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                     >
                       <span
                         aria-hidden="true"
-                        class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+                        class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
                       />
                       <span
                         class="kubevirt-inventory__row-status-item-text"
@@ -186,7 +186,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                     >
                       <span
                         aria-hidden="true"
-                        class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+                        class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
                       />
                       <span
                         class="kubevirt-inventory__row-status-item-text"
@@ -226,7 +226,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                     >
                       <span
                         aria-hidden="true"
-                        class="fa fa-check-circle fa-2x kubevirt-inventory__row-status-item-icon--ok"
+                        class="fa fa-check-circle kubevirt-inventory__row-status-item-icon--ok kubevirt-dashboard__icon-sm"
                       />
                       <span
                         class="kubevirt-inventory__row-status-item-text"
@@ -257,7 +257,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 class="card-pf-heading kubevirt-dashboard__card-heading kubevirt-events__card-header"
               >
                 <h2
-                  class="card-pf-title"
+                  class="card-pf-title kubevirt-dashboard__card-title"
                 >
                   Cluster Events
                 </h2>
@@ -267,7 +267,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 >
                   <span
                     aria-hidden="true"
-                    class="fa fa-info-circle fa-2x"
+                    class="fa fa-info-circle kubevirt-dashboard__icon-sm"
                   />
                 </button>
               </div>
@@ -295,7 +295,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 class="card-pf-heading kubevirt-dashboard__card-heading"
               >
                 <h2
-                  class="card-pf-title"
+                  class="card-pf-title kubevirt-dashboard__card-title"
                 >
                   Top Consumers
                 </h2>
@@ -305,7 +305,7 @@ exports[`<ClusterOverview /> renders correctly with Provider 1`] = `
                 >
                   <span
                     aria-hidden="true"
-                    class="fa fa-info-circle fa-2x"
+                    class="fa fa-info-circle kubevirt-dashboard__icon-sm"
                   />
                 </button>
               </div>