Skip to content

Commit

Permalink
[frontend] Change default background to be slightly more light
Browse files Browse the repository at this point in the history
  • Loading branch information
@SamuelHassine
SamuelHassine committed Feb 9, 2024
1 parent e1ab71c commit ebfecd0
Show file tree
Hide file tree
Showing 5 changed files with 221 additions and 181 deletions.
12 changes: 6 additions & 6 deletions opencti-platform/opencti-front/src/components/ThemeDark.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,12 @@ import { hexToRGB } from '../utils/Colors';

const EE_COLOR = '#00f1bd';

export const THEME_DARK_DEFAULT_BACKGROUND = '#00020c'; // 0a1929
const THEME_DARK_DEFAULT_PRIMARY = '#0fbcff'; // 1c8eb6 // for road:
const THEME_DARK_DEFAULT_SECONDARY = '#00f1bd'; // d81b60
const THEME_DARK_DEFAULT_ACCENT = '#001e4e'; // 01478d // for building: 030721
const THEME_DARK_DEFAULT_PAPER = '#00020c'; // 001e3c
const THEME_DARK_DEFAULT_NAV = '#00020c'; // 071a2e
export const THEME_DARK_DEFAULT_BACKGROUND = '#070d19';
const THEME_DARK_DEFAULT_PRIMARY = '#0fbcff';
const THEME_DARK_DEFAULT_SECONDARY = '#00f1bd';
const THEME_DARK_DEFAULT_ACCENT = '#0f1e38';
const THEME_DARK_DEFAULT_PAPER = '#070d19';
const THEME_DARK_DEFAULT_NAV = '#070d19';

const ThemeDark = (
logo: string | null = null,
Expand Down
14 changes: 7 additions & 7 deletions opencti-platform/opencti-front/src/components/ThemeLight.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,14 @@ import LogoText from '../static/images/logo_text_light.png';
import LogoCollapsed from '../static/images/logo_light.png';
import { hexToRGB } from '../utils/Colors';

const EE_COLOR = '#115f51';
const EE_COLOR = '#0c7e69';

export const THEME_LIGHT_DEFAULT_BACKGROUND = '#f8f8f8'; // f8f8f8
const THEME_LIGHT_DEFAULT_PRIMARY = '#001bda'; // 0066ff
const THEME_LIGHT_DEFAULT_SECONDARY = '#115f51'; // d81b60
const THEME_LIGHT_DEFAULT_ACCENT = '#c9c9c9'; // d3eaff
const THEME_LIGHT_DEFAULT_PAPER = '#ffffff'; // ffffff
const THEME_LIGHT_DEFAULT_NAV = '#ffffff'; // f5f5f5
export const THEME_LIGHT_DEFAULT_BACKGROUND = '#f8f8f8';
const THEME_LIGHT_DEFAULT_PRIMARY = '#001bda';
const THEME_LIGHT_DEFAULT_SECONDARY = '#0c7e69';
const THEME_LIGHT_DEFAULT_ACCENT = '#d9d9d9';
const THEME_LIGHT_DEFAULT_PAPER = '#ffffff';
const THEME_LIGHT_DEFAULT_NAV = '#ffffff';

const ThemeLight = (
logo: string | null,
Expand Down
125 changes: 69 additions & 56 deletions ...encti-front/src/private/components/common/stix_core_objects/StixCoreObjectHistoryLine.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,15 +23,16 @@ import ListItem from '@mui/material/ListItem';
import DialogContentText from '@mui/material/DialogContentText';
import IconButton from '@mui/material/IconButton';
import { Link } from 'react-router-dom';
import withTheme from '@mui/styles/withTheme';
import { truncate } from '../../../../utils/String';
import inject18n from '../../../../components/i18n';
import MarkdownDisplay from '../../../../components/MarkdownDisplay';
import Transition from '../../../../components/Transition';
import ItemIcon from '../../../../components/ItemIcon';

const styles = (theme) => ({
const styles = () => ({
container: {
marginBottom: 20,
marginBottom: 5,
},
line: {
content: ' ',
Expand All @@ -44,9 +45,9 @@ const styles = (theme) => ({
},
avatar: {
float: 'left',
width: 40,
height: 40,
margin: '5px 10px 0 0',
width: 30,
height: 30,
margin: '7px 0 0 0',
},
content: {
width: 'auto',
Expand All @@ -61,7 +62,7 @@ const styles = (theme) => ({
width: '100%',
height: '100%',
padding: '8px 15px 0 15px',
backgroundColor: theme.palette.background.shadow,
background: 0,
},
description: {
height: '100%',
Expand Down Expand Up @@ -110,36 +111,39 @@ class StixCoreObjectHistoryLineComponent extends Component {
}

renderIcon(eventScope, isRelation, eventMesage, commit) {
const { theme } = this.props;
if (isRelation) {
if (eventScope === 'create') {
return (
<Avatar
sx={{
width: 30,
height: 30,
backgroundColor: pink[500],
color: '#ffffff',
width: 25,
height: 25,
backgroundColor: 'transparent',
border: `1px solid ${pink[500]}`,
color: theme.palette.text.primary,
cursor: commit ? 'pointer' : 'auto',
}}
onClick={() => commit && this.handleOpen()}
>
<LinkOutlined fontSize="small" />
<LinkOutlined style={{ fontSize: 12 }} />
</Avatar>
);
}
if (eventScope === 'delete') {
return (
<Avatar
sx={{
width: 30,
height: 30,
backgroundColor: deepPurple[500],
color: '#ffffff',
width: 25,
height: 25,
backgroundColor: 'transparent',
border: `1px solid ${deepPurple[500]}`,
color: theme.palette.text.primary,
cursor: commit ? 'pointer' : 'auto',
}}
onClick={() => commit && this.handleOpen()}
>
<LinkOffOutlined fontSize="small" />
<LinkOffOutlined style={{ fontSize: 12 }} />
</Avatar>
);
}
Expand All @@ -148,125 +152,133 @@ class StixCoreObjectHistoryLineComponent extends Component {
return (
<Avatar
sx={{
width: 30,
height: 30,
backgroundColor: pink[500],
color: '#ffffff',
width: 25,
height: 25,
backgroundColor: 'transparent',
border: `1px solid ${pink[500]}`,
color: theme.palette.text.primary,
cursor: commit ? 'pointer' : 'auto',
}}
onClick={() => commit && this.handleOpen()}
>
<AddOutlined fontSize="small" />
<AddOutlined style={{ fontSize: 12 }} />
</Avatar>
);
}
if (eventScope === 'merge') {
return (
<Avatar
sx={{
width: 30,
height: 30,
backgroundColor: teal[500],
color: '#ffffff',
width: 25,
height: 25,
backgroundColor: 'transparent',
border: `1px solid ${teal[500]}`,
color: theme.palette.text.primary,
cursor: commit ? 'pointer' : 'auto',
}}
onClick={() => commit && this.handleOpen()}
>
<Merge fontSize="small" />
<Merge style={{ fontSize: 12 }} />
</Avatar>
);
}
if (eventScope === 'update' && eventMesage.includes('replaces')) {
return (
<Avatar
sx={{
width: 30,
height: 30,
backgroundColor: green[500],
color: '#ffffff',
width: 25,
height: 25,
backgroundColor: 'transparent',
border: `1px solid ${green[500]}`,
color: theme.palette.text.primary,
cursor: commit ? 'pointer' : 'auto',
}}
onClick={() => commit && this.handleOpen()}
>
<EditOutlined fontSize="small" />
<EditOutlined style={{ fontSize: 12 }} />
</Avatar>
);
}
if (eventScope === 'update' && eventMesage.includes('changes')) {
return (
<Avatar
sx={{
width: 30,
height: 30,
backgroundColor: green[500],
color: '#ffffff',
width: 25,
height: 25,
backgroundColor: 'transparent',
border: `1px solid ${green[500]}`,
color: theme.palette.text.primary,
cursor: commit ? 'pointer' : 'auto',
}}
onClick={() => commit && this.handleOpen()}
>
<EditOutlined fontSize="small" />
<EditOutlined style={{ fontSize: 12 }} />
</Avatar>
);
}
if (eventScope === 'update' && eventMesage.includes('adds')) {
return (
<Avatar
sx={{
width: 30,
height: 30,
backgroundColor: indigo[500],
color: '#ffffff',
width: 25,
height: 25,
backgroundColor: 'transparent',
border: `1px solid ${indigo[500]}`,
color: theme.palette.text.primary,
cursor: commit ? 'pointer' : 'auto',
}}
onClick={() => commit && this.handleOpen()}
>
<LinkVariantPlus fontSize="small" />
<LinkVariantPlus style={{ fontSize: 12 }} />
</Avatar>
);
}
if (eventScope === 'update' && eventMesage.includes('removes')) {
return (
<Avatar
sx={{
width: 30,
height: 30,
backgroundColor: deepOrange[500],
color: '#ffffff',
width: 25,
height: 25,
backgroundColor: 'transparent',
border: `1px solid ${deepOrange[500]}`,
color: theme.palette.text.primary,
cursor: commit ? 'pointer' : 'auto',
}}
onClick={() => commit && this.handleOpen()}
>
<LinkVariantRemove fontSize="small" />
<LinkVariantRemove style={{ fontSize: 12 }} />
</Avatar>
);
}
if (eventScope === 'delete') {
return (
<Avatar
sx={{
width: 30,
height: 30,
backgroundColor: red[500],
color: '#ffffff',
width: 25,
height: 25,
backgroundColor: 'transparent',
border: `1px solid ${red[500]}`,
color: theme.palette.text.primary,
}}
>
<DeleteOutlined fontSize="small" />
<DeleteOutlined style={{ fontSize: 12 }} />
</Avatar>
);
}
}
return (
<Avatar
style={{
width: 30,
height: 30,
backgroundColor: yellow[800],
color: '#ffffff',
width: 25,
height: 25,
backgroundColor: 'transparent',
border: `1px solid ${yellow[500]}`,
color: theme.palette.text.primary,
cursor: commit ? 'pointer' : 'auto',
}}
onClick={() => commit && this.handleOpen()}
>
<HelpOutlined fontSize="small" />
<HelpOutlined style={{ fontSize: 12 }} />
</Avatar>
);
}
Expand Down Expand Up @@ -493,5 +505,6 @@ const StixCoreObjectHistoryLine = createFragmentContainer(

export default compose(
inject18n,
withTheme,
withStyles(styles),
)(StixCoreObjectHistoryLine);
Loading

0 comments on commit ebfecd0

Please sign in to comment.