Merge pull request #16521 from luchillo17/fix/BCKSTG-102-theme-aware-colors
refactor: Replace white & black colors with theme aware ones
This commit is contained in:
@@ -17,28 +17,28 @@ import { Chip, withStyles } from '@material-ui/core';
|
||||
import React from 'react';
|
||||
import { ACCEPTED, Alert, PENDING, RESOLVED } from '../../types';
|
||||
|
||||
const ResolvedChip = withStyles({
|
||||
const ResolvedChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#4caf50',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
}))(Chip);
|
||||
|
||||
const AcceptedChip = withStyles({
|
||||
const AcceptedChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#ffb74d',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
const PendingChip = withStyles({
|
||||
}))(Chip);
|
||||
const PendingChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#d32f2f',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
}))(Chip);
|
||||
|
||||
export const alertStatusLabels = {
|
||||
[RESOLVED]: 'Resolved',
|
||||
|
||||
@@ -41,7 +41,8 @@ const useStyles = makeStyles<BackstageTheme>(theme => ({
|
||||
code: {
|
||||
borderRadius: 6,
|
||||
margin: theme.spacing(2, 0),
|
||||
background: theme.palette.type === 'dark' ? '#444' : '#fff',
|
||||
background:
|
||||
theme.palette.type === 'dark' ? '#444' : theme.palette.common.white,
|
||||
},
|
||||
header: {
|
||||
display: 'inline-block',
|
||||
|
||||
@@ -18,13 +18,13 @@ import Chip from '@material-ui/core/Chip';
|
||||
import { withStyles } from '@material-ui/core/styles';
|
||||
import { AlertSource } from '../../types';
|
||||
|
||||
const MaintenanceChip = withStyles({
|
||||
const MaintenanceChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#92949c',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
marginTop: 8,
|
||||
},
|
||||
})(Chip);
|
||||
}))(Chip);
|
||||
|
||||
export const ILertCardHeaderStatus = ({
|
||||
alertSource,
|
||||
|
||||
@@ -24,42 +24,42 @@ import {
|
||||
UNDER_MAINTENANCE,
|
||||
} from '../../types';
|
||||
|
||||
const OperationalChip = withStyles({
|
||||
const OperationalChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#388E3D',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
}))(Chip);
|
||||
|
||||
const UnderMaintenanceChip = withStyles({
|
||||
const UnderMaintenanceChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#616161',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
const DegradedChip = withStyles({
|
||||
}))(Chip);
|
||||
const DegradedChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#FBC02D',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
const PartialOutageChip = withStyles({
|
||||
}))(Chip);
|
||||
const PartialOutageChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#F57C02',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
const MajorOutageChip = withStyles({
|
||||
}))(Chip);
|
||||
const MajorOutageChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#D22F2E',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
}))(Chip);
|
||||
|
||||
const serviceStatusLabels = {
|
||||
[OPERATIONAL]: 'Operational',
|
||||
|
||||
@@ -24,42 +24,42 @@ import {
|
||||
UNDER_MAINTENANCE,
|
||||
} from '../../types';
|
||||
|
||||
const OperationalChip = withStyles({
|
||||
const OperationalChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#388E3D',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
}))(Chip);
|
||||
|
||||
const UnderMaintenanceChip = withStyles({
|
||||
const UnderMaintenanceChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#616161',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
const DegradedChip = withStyles({
|
||||
}))(Chip);
|
||||
const DegradedChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#FBC02D',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
const PartialOutageChip = withStyles({
|
||||
}))(Chip);
|
||||
const PartialOutageChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#F57C02',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
const MajorOutageChip = withStyles({
|
||||
}))(Chip);
|
||||
const MajorOutageChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#D22F2E',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
}))(Chip);
|
||||
|
||||
const statusPageStatusLabels = {
|
||||
[OPERATIONAL]: 'Operational',
|
||||
|
||||
@@ -17,21 +17,21 @@ import { Chip, withStyles } from '@material-ui/core';
|
||||
import React from 'react';
|
||||
import { PRIVATE, PUBLIC, StatusPage } from '../../types';
|
||||
|
||||
const PrivateChip = withStyles({
|
||||
const PrivateChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#4caf50',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
}))(Chip);
|
||||
|
||||
const PublicChip = withStyles({
|
||||
const PublicChip = withStyles(theme => ({
|
||||
root: {
|
||||
backgroundColor: '#ffb74d',
|
||||
color: 'white',
|
||||
color: theme.palette.common.white,
|
||||
margin: 0,
|
||||
},
|
||||
})(Chip);
|
||||
}))(Chip);
|
||||
|
||||
const statusPageVisibilityLabels = {
|
||||
[PUBLIC]: 'Public',
|
||||
|
||||
Reference in New Issue
Block a user