diff --git a/monkey/monkey_island/cc/ui/src/components/pages/ReportPage.js b/monkey/monkey_island/cc/ui/src/components/pages/ReportPage.js index 9002a7359..07abc9910 100644 --- a/monkey/monkey_island/cc/ui/src/components/pages/ReportPage.js +++ b/monkey/monkey_island/cc/ui/src/components/pages/ReportPage.js @@ -1,3 +1,5 @@ +import '../../styles/report/ReportPage.scss'; + import React from 'react'; import {Col, Nav, NavItem} from 'react-bootstrap'; import {ReactiveGraph} from 'components/reactive-graph/ReactiveGraph'; @@ -97,7 +99,7 @@ class ReportPageComponent extends AuthComponent { renderNav = () => { return () }; diff --git a/monkey/monkey_island/cc/ui/src/components/report-components/AttackReport.js b/monkey/monkey_island/cc/ui/src/components/report-components/AttackReport.js index ff02b03ac..e37567356 100644 --- a/monkey/monkey_island/cc/ui/src/components/report-components/AttackReport.js +++ b/monkey/monkey_island/cc/ui/src/components/report-components/AttackReport.js @@ -1,12 +1,12 @@ import React from 'react'; - import {Col} from 'react-bootstrap'; import '../../styles/Collapse.scss'; -import '../../styles/report/AttackReport.scss' +import '../../styles/report/AttackReport.scss'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faCircle as faCircle } from '@fortawesome/free-solid-svg-icons'; import { faCircle as faCircleThin } from '@fortawesome/free-regular-svg-icons'; +import ReportHeader, {ReportTypes} from './common/ReportHeader'; import {ScanStatus} from '../attack/techniques/Helpers'; import Matrix from './attack/ReportMatrix'; import SelectedTechnique from './attack/SelectedTechnique'; @@ -130,22 +130,21 @@ class AttackReport extends React.Component { generateReportContent() { return ( -
-

- ATT&CK report -

-

- This report shows information about ATT&CK techniques used by Infection Monkey. -

- {this.renderLegend()} - - - -
-
+
+ +
+

+ This report shows information about ATT&CK techniques used by Infection Monkey. +

+ {this.renderLegend()} + + + +
+
) } diff --git a/monkey/monkey_island/cc/ui/src/components/report-components/attack/SelectedTechnique.js b/monkey/monkey_island/cc/ui/src/components/report-components/attack/SelectedTechnique.js index 8e7ae74b0..ca2e92ba8 100644 --- a/monkey/monkey_island/cc/ui/src/components/report-components/attack/SelectedTechnique.js +++ b/monkey/monkey_island/cc/ui/src/components/report-components/attack/SelectedTechnique.js @@ -62,7 +62,7 @@ class SelectedTechnique extends React.Component { return (
-

Selected technique:

+

Selected technique:

{content}
diff --git a/monkey/monkey_island/cc/ui/src/components/report-components/common/ReportHeader.js b/monkey/monkey_island/cc/ui/src/components/report-components/common/ReportHeader.js index 264109bfd..5c86b5c26 100644 --- a/monkey/monkey_island/cc/ui/src/components/report-components/common/ReportHeader.js +++ b/monkey/monkey_island/cc/ui/src/components/report-components/common/ReportHeader.js @@ -7,6 +7,7 @@ let monkeyLogoImage = require('../../../images/monkey-icon.svg'); export const ReportTypes = { zeroTrust: 'Zero Trust', security: 'Security', + attack: 'Attack', null: '' }; diff --git a/monkey/monkey_island/cc/ui/src/styles/report/AttackReport.scss b/monkey/monkey_island/cc/ui/src/styles/report/AttackReport.scss index 953cc627d..3729cb1b4 100644 --- a/monkey/monkey_island/cc/ui/src/styles/report/AttackReport.scss +++ b/monkey/monkey_island/cc/ui/src/styles/report/AttackReport.scss @@ -25,3 +25,18 @@ .attack-report .selected-technique { cursor: default; } + +.attack-report { + padding: 0 !important; + -webkit-box-shadow: none !important; + box-shadow: none !important; +} + +.attack-report .padded{ + padding: 2em 2em 0 2em; +} + +.ReactTable .rt-td{ + white-space: pre-line !important; + word-wrap: break-word; +} diff --git a/monkey/monkey_island/cc/ui/src/styles/report/ReportPage.scss b/monkey/monkey_island/cc/ui/src/styles/report/ReportPage.scss new file mode 100644 index 000000000..737ba7538 --- /dev/null +++ b/monkey/monkey_island/cc/ui/src/styles/report/ReportPage.scss @@ -0,0 +1,11 @@ +.report-nav { + margin-bottom: 2em !important; + position: sticky; + top: 0; + z-index: 1000000; + background-color: #ffffff; +} + +.report-nav > li > a{ + height: 50px !important; +}