p17860254
/
monkey
forked from p15670423/monkey
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix the Guardicore logo which is overlaping the landing page buttons on smaller screens

This commit is contained in:
VakarisZ 2021-09-03 15:27:04 +03:00
parent 0ecbfdea38
commit 4dbd7b41f5
2 changed files with 31 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
monkey/monkey_island/cc/ui/src/components/pages/LandingPage.tsx
View File

@ -15,24 +15,24 @@ const infectionMonkey = require('../../images/infection-monkey.svg')
const LandingPageComponent = (props) => {
return (
<>
<ParticleBackground/>
<Col sm={{offset: 1, span: 10}} md={{offset: 1, span: 10}}
lg={{offset: 2, span: 8}} xl={{offset: 3, span: 6}}
className={'landing-page'}>
<MonkeyBanner />
<div className={'scenario-header'}>
<ScenarioButtons/>
<br/>
</div>
<br/>
<br/>
<Col className={'guardicore-logo'}>
<Logo/>
<>
<ParticleBackground/>
<Col sm={{offset: 1, span: 10}} md={{offset: 1, span: 10}}
lg={{offset: 2, span: 8}} xl={{offset: 3, span: 6}}
className={'landing-page'}>
<MonkeyBanner/>
<div className={'scenario-header'}>
<ScenarioButtons/>
<br/>
<Col className={'guardicore-logo'}>
<Logo/>
</Col>
</div>
<br/>
<br/>
</Col>
</Col>
</>
</>
);
@ -72,8 +72,8 @@ const LandingPageComponent = (props) => {
function setScenario(scenario: string) {
IslandHttpClient.post('/api/island-mode', {'mode': scenario})
.then(() => {
props.onStatusChange();
.then(() => {
props.onStatusChange();
});
}
}
@ -91,23 +91,24 @@ function MonkeyInfo() {
}
function ScenarioInfo() {
return (
<>
<div className={'scenario-info'}>
Check the Infection Monkey documentation hub for more information
on <a href='https://www.guardicore.com/infectionmonkey/docs/usage/scenarios/' rel="noopener noreferrer" target="_blank">
scenarios
</a>.
</div>
</>
);
return (
<>
<div className={'scenario-info'}>
Check the Infection Monkey documentation hub for more information
on <a href='https://www.guardicore.com/infectionmonkey/docs/usage/scenarios/' rel="noopener noreferrer"
target="_blank">
scenarios
</a>.
</div>
</>
);
}
function MonkeyBanner(props) {
return (
<div className={'landing-page-banner'}>
<img className={'landing-banner-component landing-banner-monkey-icon'} src={monkeyIcon} />
<img className={'landing-banner-component landing-banner-title'} src={infectionMonkey} />
<img className={'landing-banner-component landing-banner-monkey-icon'} src={monkeyIcon}/>
<img className={'landing-banner-component landing-banner-title'} src={infectionMonkey}/>
</div>
);
}

7
monkey/monkey_island/cc/ui/src/styles/pages/LandingPage.scss
View File

@ -1,6 +1,5 @@
.landing-page {
background-color: rgba(255, 255, 255, 0.89);
position: absolute !important;
height: 100%;
bottom: 0;
}
@ -27,12 +26,6 @@
height: 100%;
}
.landing-page .guardicore-logo {
position: absolute;
bottom: 10px;
left: 0 !important;
}
.guardicore-logo .license-text {
position: relative;
}