shaba/one
1
0
Fork 0
mirror of https://github.com/OpenNebula/one.git synced 2025-03-16 22:50:10 +03:00
Code Releases Wiki Activity

F OpenNebula/one#5422: Fix styles in chip component

Browse Source
This commit is contained in:
Sergio Betanzos 2021-07-07 18:15:55 +02:00
parent 59068a0c19
commit 93aa66d301
No known key found for this signature in database
GPG Key ID: E3E704F097737136
10 changed files with 15 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/fireedge/src/client/components/Cards/DatastoreCard.js
View File

@ -51,7 +51,7 @@ const DatastoreCard = memo(
<Typography title={NAME} noWrap component='span'>
{NAME}
</Typography>
<StatusChip stateColor={'#c6c6c6'} text={type.name} />
<StatusChip text={type.name} />
</span>
}
subheader={`#${ID}`}

2
src/fireedge/src/client/components/Cards/HostCard.js
View File

@ -54,7 +54,7 @@ const HostCard = memo(
<Typography title={NAME} noWrap component='span'>
{NAME}
</Typography>
<StatusChip stateColor={'#c6c6c6'} text={mad} />
<StatusChip text={mad} />
</span>
}
subheader={`#${ID}`}

12
src/fireedge/src/client/components/Status/Chip.js
View File

@ -6,9 +6,10 @@ import { addOpacityToColor } from 'client/utils'
const useStyles = makeStyles(theme => {
const getBackgroundColor = theme.palette.type === 'dark' ? lighten : darken
const defaultStateColor = theme.palette.grey[theme.palette.type === 'dark' ? 300 : 700]
return {
root: ({ stateColor = theme.palette.primary.main }) => ({
root: ({ stateColor = defaultStateColor }) => ({
color: getBackgroundColor(stateColor, 0.75),
backgroundColor: addOpacityToColor(stateColor, 0.2),
cursor: 'default',
@ -21,11 +22,11 @@ const useStyles = makeStyles(theme => {
}
})
const StatusChip = memo(({ stateColor, text }) => {
const StatusChip = memo(({ stateColor, text = '', ...props }) => {
const classes = useStyles({ stateColor })
return (
<Typography component="span" className={classes.root}>
<Typography component='span' className={classes.root} {...props}>
{text}
</Typography>
)
@ -40,11 +41,6 @@ StatusChip.propTypes = {
text: PropTypes.string
}
StatusChip.defaultProps = {
stateColor: undefined,
text: ''
}
StatusChip.displayName = 'StatusChip'
export default StatusChip

2
src/fireedge/src/client/components/Tables/Datastores/row.js
View File

@ -29,7 +29,7 @@ const Row = ({ original, value, ...props }) => {
</Typography>
<span className={classes.labels}>
{LOCK && <Lock size={20} />}
<StatusChip stateColor={'#c6c6c6'} text={TYPE?.name} />
<StatusChip text={TYPE?.name} />
</span>
</div>
<div className={classes.caption}>

2
src/fireedge/src/client/components/Tables/Hosts/row.js
View File

@ -39,7 +39,7 @@ const Row = ({ original, value, ...props }) => {
</Typography>
<span className={classes.labels}>
{labels.map(label => (
<StatusChip key={label} stateColor={'#c6c6c6'} text={label} />
<StatusChip key={label} text={label} />
))}
</span>
</div>

2
src/fireedge/src/client/components/Tables/Images/row.js
View File

@ -39,7 +39,7 @@ const Row = ({ original, value, ...props }) => {
{LOCK && <Lock size={20} />}
<span className={classes.labels}>
{labels.map(label => (
<StatusChip key={label} stateColor={'#c6c6c6'} text={label} />
<StatusChip key={label} text={label} />
))}
</span>
</div>

6
src/fireedge/src/client/components/Tables/MarketplaceApps/row.js
View File

@ -35,7 +35,7 @@ const Row = ({ original, value, ...props }) => {
</Typography>
{LOCK && <Lock size={20} />}
<span className={classes.labels}>
<StatusChip stateColor={'#c6c6c6'} text={TYPE} />
<StatusChip text={TYPE} />
</span>
</div>
<div className={classes.caption}>
@ -58,8 +58,8 @@ const Row = ({ original, value, ...props }) => {
</div>
<div className={classes.secondary}>
<span className={classes.labels}>
<StatusChip stateColor={'#c6c6c6'} text={`Zone ${ZONE_ID}`} />
<StatusChip stateColor={'#c6c6c6'} text={prettyBytes(+SIZE, 'MB')} />
<StatusChip text={`Zone ${ZONE_ID}`} />
<StatusChip text={prettyBytes(+SIZE, 'MB')} />
</span>
</div>
</div>

2
src/fireedge/src/client/components/Tables/Marketplaces/row.js
View File

@ -28,7 +28,7 @@ const Row = ({ original, value, ...props }) => {
{NAME}
</Typography>
<span className={classes.labels}>
<StatusChip stateColor={'#c6c6c6'} text={MARKET_MAD} />
<StatusChip text={MARKET_MAD} />
</span>
</div>
<div className={classes.caption}>

2
src/fireedge/src/client/components/Tables/VmTemplates/row.js
View File

@ -25,7 +25,7 @@ const Row = ({ original, value, ...props }) => {
</Typography>
<span className={classes.labels}>
{LOCK && <Lock size={20} />}
{VROUTER && <StatusChip stateColor={'#c6c6c6'} text={VROUTER} />}
{VROUTER && <StatusChip text={VROUTER} />}
</span>
</div>
<div className={classes.caption}>

2
src/fireedge/src/client/components/Tables/Vms/multiple.js
View File

@ -13,7 +13,7 @@ const Multiple = ({ tags, limitTags = 1 }) => {
const more = tags.length - limitTags
const Tags = tags.splice(0, limitTags).map(tag => (
<StatusChip key={tag} text={tag} stateColor='#ececec' />
<StatusChip key={tag} text={tag} />
))
return (