Extracted magic numbers to consts and deleted unused css file

monkey/monkey_island/cc/ui/src/components/report-components/zerotrust/FindingsTable.js

@@ -5,6 +5,8 @@ import * as PropTypes from "prop-types";
 import PillarLabel from "./PillarLabel";
 import EventsButton from "./EventsButton";
 
+const EVENTS_COLUMN_MAX_WIDTH = 160;
+const PILLARS_COLUMN_MAX_WIDTH = 200;
 const columns = [
   {
     columns: [
@@ -18,7 +20,7 @@ const columns = [
         accessor: x => {
           return <EventsButton events={x.events} exportFilename={"Events_" + x.test_key}/>;
         },
-        maxWidth: 160,
+        maxWidth: EVENTS_COLUMN_MAX_WIDTH,
       },
 
       {
@@ -30,7 +32,7 @@ const columns = [
           );
           return <div style={{textAlign: "center"}}>{pillarLabels}</div>;
         },
-        maxWidth: 200,
+        maxWidth: PILLARS_COLUMN_MAX_WIDTH,
         style: {'whiteSpace': 'unset'}
       },
     ]
@@ -41,8 +43,8 @@ const columns = [
 export class FindingsTable extends Component {
   render() {
     return <Fragment>
-      <h3>{<div style={{display: "inline-block"}}><StatusLabel status={this.props.status} showText={true}/>
-      </div>} tests' findings</h3>
+      <h3>{<span style={{display: "inline-block"}}><StatusLabel status={this.props.status} showText={true}/>
+      </span>} tests' findings</h3>
       <PaginatedTable data={this.props.data} pageSize={10} columns={columns}/>
     </Fragment>
   }

monkey/monkey_island/cc/ui/src/components/report-components/zerotrust/PillarLabel.js

@@ -1,5 +1,4 @@
 import React, {Component} from "react";
-import 'styles/ZeroTrustPillars.css'
 import {statusToLabelType} from "./StatusLabel";
 import * as PropTypes from "prop-types";
 

monkey/monkey_island/cc/ui/src/components/report-components/zerotrust/RecommendationsStatusTable.js

@@ -1,12 +1,12 @@
 import React, {Fragment} from "react";
 import PaginatedTable from "../common/PaginatedTable";
 import AuthComponent from "../../AuthComponent";
-import 'styles/ZeroTrustPillars.css'
 import StatusLabel from "./StatusLabel";
 import * as PropTypes from "prop-types";
 import {ZeroTrustStatuses} from "./ZeroTrustPillars";
 
 
+const MAX_WIDTH_STATUS_COLUMN = 80;
 const columns = [
   {
     columns: [
@@ -14,7 +14,7 @@ const columns = [
         accessor: x => {
           return <StatusLabel status={x.status} size="fa-3x" showText={false} />;
         },
-        maxWidth: 80
+        maxWidth: MAX_WIDTH_STATUS_COLUMN
       },
       { Header: 'ZT Recommendation', accessor: 'recommendation',
         style: {'whiteSpace': 'unset'}  // This enables word wrap

monkey/monkey_island/cc/ui/src/styles/ZeroTrustPillars.css

@@ -1,27 +0,0 @@
-.label-zt-data {
-  background-color: #FAD02C !important;
-}
-
-.label-zt-people {
-  background-color: #507581 !important;
-}
-
-.label-zt-networks {
-  background-color: #746233 !important;
-}
-
-.label-zt-devices {
-  background-color: #2F3B29 !important;
-}
-
-.label-zt-workloads {
-  background-color: #0C1440 !important;
-}
-
-.label-zt-analytics {
-  background-color: #6B8836 !important;
-}
-
-.label-zt-automation {
-  background-color: #B4BC82 !important;
-}