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..cc53a828d 100644
--- a/monkey/monkey_island/cc/ui/src/components/pages/LandingPage.tsx
+++ b/monkey/monkey_island/cc/ui/src/components/pages/LandingPage.tsx
@@ -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,6 +20,7 @@ const LandingPageComponent = (props) => {
+
Breach & Attack Simulation
@@ -101,4 +105,13 @@ function ScenarioInfo() {
);
}
+function MonkeyBanner(props) {
+ return (
+
+
+
+
+ );
+}
+
export default LandingPageComponent;
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 b5b1549d5..f5ec25055 100644
--- a/monkey/monkey_island/cc/ui/src/styles/pages/LandingPage.scss
+++ b/monkey/monkey_island/cc/ui/src/styles/pages/LandingPage.scss
@@ -40,3 +40,27 @@
.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%;
+}