Styling and lint

auto_join_3.3
Håvar Aambø Fosstveit 2020-05-01 21:49:40 +02:00
parent 2ad7b45ef6
commit 87b114fccc
3 changed files with 51 additions and 42 deletions

View File

@ -81,6 +81,10 @@ const styles = (theme) =>
margin : theme.spacing(1, 0), margin : theme.spacing(1, 0),
padding : theme.spacing(0, 1) padding : theme.spacing(0, 1)
}, },
disabledButton :
{
margin : theme.spacing(1, 0)
},
green : green :
{ {
color : 'rgba(0, 153, 0, 1)' color : 'rgba(0, 153, 0, 1)'
@ -270,6 +274,7 @@ const TopBar = (props) =>
</IconButton> </IconButton>
</Tooltip> </Tooltip>
<Tooltip title={lockTooltip}> <Tooltip title={lockTooltip}>
<span className={classes.disabledButton}>
<IconButton <IconButton
aria-label={intl.formatMessage({ aria-label={intl.formatMessage({
id : 'tooltip.lockRoom', id : 'tooltip.lockRoom',
@ -296,6 +301,7 @@ const TopBar = (props) =>
<LockOpenIcon /> <LockOpenIcon />
} }
</IconButton> </IconButton>
</span>
</Tooltip> </Tooltip>
{ lobbyPeers.length > 0 && { lobbyPeers.length > 0 &&
<Tooltip <Tooltip
@ -304,11 +310,13 @@ const TopBar = (props) =>
defaultMessage : 'Show lobby' defaultMessage : 'Show lobby'
})} })}
> >
<span className={classes.disabledButton}>
<IconButton <IconButton
aria-label={intl.formatMessage({ aria-label={intl.formatMessage({
id : 'tooltip.lobby', id : 'tooltip.lobby',
defaultMessage : 'Show lobby' defaultMessage : 'Show lobby'
})} })}
className={classes.actionButton}
color='inherit' color='inherit'
disabled={!canPromote} disabled={!canPromote}
onClick={() => setLockDialogOpen(!room.lockDialogOpen)} onClick={() => setLockDialogOpen(!room.lockDialogOpen)}
@ -320,6 +328,7 @@ const TopBar = (props) =>
<SecurityIcon /> <SecurityIcon />
</PulsingBadge> </PulsingBadge>
</IconButton> </IconButton>
</span>
</Tooltip> </Tooltip>
} }
{ loginEnabled && { loginEnabled &&
@ -339,7 +348,7 @@ const TopBar = (props) =>
{ myPicture ? { myPicture ?
<Avatar src={myPicture} /> <Avatar src={myPicture} />
: :
<AccountCircle className={loggedIn && classes.green} /> <AccountCircle className={loggedIn ? classes.green : null} />
} }
</IconButton> </IconButton>
</Tooltip> </Tooltip>

View File

@ -149,7 +149,7 @@ const DialogTitle = withStyles(styles)((props) =>
<Avatar src={myPicture} className={classes.largeAvatar} /> <Avatar src={myPicture} className={classes.largeAvatar} />
: :
<AccountCircle <AccountCircle
className={classnames(classes.largeIcon, loggedIn && classes.green)} className={classnames(classes.largeIcon, loggedIn ? classes.green : null)}
/> />
} }
</IconButton> </IconButton>