diff --git a/monkey/monkey_island/cc/ui/src/components/SideNavComponent.tsx b/monkey/monkey_island/cc/ui/src/components/SideNavComponent.tsx index f3c8e3a94..6caa6617b 100644 --- a/monkey/monkey_island/cc/ui/src/components/SideNavComponent.tsx +++ b/monkey/monkey_island/cc/ui/src/components/SideNavComponent.tsx @@ -3,7 +3,6 @@ import {NavLink} from 'react-router-dom'; import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'; import {faCheck} from '@fortawesome/free-solid-svg-icons/faCheck'; import {faUndo} from '@fortawesome/free-solid-svg-icons/faUndo'; -import {faExternalLinkAlt} from '@fortawesome/free-solid-svg-icons'; import '../styles/components/SideNav.scss'; import {CompletedSteps} from "./side-menu/CompletedSteps"; import {isReportRoute, Routes} from "./Main"; diff --git a/monkey/monkey_island/cc/ui/src/components/pages/LandingPage.tsx b/monkey/monkey_island/cc/ui/src/components/pages/LandingPage.tsx index 882e838c7..cd3d73d8c 100644 --- a/monkey/monkey_island/cc/ui/src/components/pages/LandingPage.tsx +++ b/monkey/monkey_island/cc/ui/src/components/pages/LandingPage.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import {Container,Col, Row} from 'react-bootstrap'; +import {Col, Row} from 'react-bootstrap'; import {Link} from 'react-router-dom'; import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'; import {faFileCode, faLightbulb} from '@fortawesome/free-solid-svg-icons'; @@ -9,6 +9,9 @@ import IslandHttpClient from "../IslandHttpClient"; import ParticleBackground from '../ui-components/ParticleBackground'; import Logo from "../logo/LogoComponent"; +const monkeyIcon = require('../../images/monkey-icon.svg') +const infectionMonkey = require('../../images/infection-monkey.svg') + const LandingPageComponent = (props) => { return ( @@ -17,8 +20,8 @@ const LandingPageComponent = (props) => { -

Breach & Attack Simulation

-
+ +

@@ -101,4 +104,13 @@ function ScenarioInfo() { ); } +function MonkeyBanner(props) { + return ( +
+ + +
+ ); +} + export default LandingPageComponent; diff --git a/monkey/monkey_island/cc/ui/src/styles/App.css b/monkey/monkey_island/cc/ui/src/styles/App.css index 9c6e4abba..00c1320b8 100644 --- a/monkey/monkey_island/cc/ui/src/styles/App.css +++ b/monkey/monkey_island/cc/ui/src/styles/App.css @@ -21,7 +21,7 @@ body { * Sidebar */ -@media (min-width: 768px) { +@media (min-width: 575px) { .sidebar { position: fixed !important; top: 0; @@ -126,6 +126,15 @@ body { } } +@media (max-width: 575px) { + .guardicore-link img { + height: 28px; + padding-left: 4px; + padding-right: 4px; + vertical-align: middle; + } +} + /* * Main content */ diff --git a/monkey/monkey_island/cc/ui/src/styles/pages/LandingPage.scss b/monkey/monkey_island/cc/ui/src/styles/pages/LandingPage.scss index 14a77725f..fe9e3657b 100644 --- a/monkey/monkey_island/cc/ui/src/styles/pages/LandingPage.scss +++ b/monkey/monkey_island/cc/ui/src/styles/pages/LandingPage.scss @@ -29,7 +29,7 @@ .landing-page .guardicore-logo { position: absolute; - bottom: 0; + bottom: 10px; left: 0 !important; } @@ -40,3 +40,33 @@ .guardicore-logo .version-text { position: relative; } + +.landing-page-banner { + display: block; + background-color: #ffcc00; + height:200px; + margin-right: -15px; + margin-left: -15px; +} + +.landing-banner-component { + display: block; + margin-left: auto; + margin-right: auto; + padding-top: 10px; +} + +.landing-banner-monkey-icon { + max-height: 65%; +} + +.landing-banner-title { + padding-bottom: 10px; + max-height: 35%; +} + +.landing-page .scenario-header { + font-size: 1.2em; + margin-top: 30px; + margin-left: 20px; +}