make slider handle bigger

in order to make it an easier target on mobile
This commit is contained in:
Barry Gitarts 2018-07-01 13:32:12 -04:00
parent e5f880680d
commit 091d69f1dd
1 changed files with 6 additions and 1 deletions

View File

@ -17,6 +17,10 @@ const styles = {
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
},
thumb: {
width: '24px',
height: '24px'
}
};
@ -112,6 +116,7 @@ class Poll extends PureComponent {
const { fromWei } = web3.utils;
const maxValue = Math.floor(Math.sqrt(balance));
const buttonText = originalValue != 0 && value != originalValue ? 'Change Vote' : 'Vote';
console.log(classes)
return (
<Card>
<CardContent>
@ -124,7 +129,7 @@ class Poll extends PureComponent {
</Typography>
</CardContent>
<CardActions className={classes.card}>
<Slider style={{ width: '95%' }} disabled={disableVote} value={value || 0} min={0} max={maxValue} step={1} onChange={this.handleChange} />
<Slider style={{ width: '95%' }} classes={{ thumb: classes.thumb }} disabled={disableVote} value={value || 0} min={0} max={maxValue} step={1} onChange={this.handleChange} />
{isSubmitting ? <CircularProgress /> : <Button variant="contained" disabled={disableVote} color="primary" onClick={this.handleClick}>{buttonText}</Button>}
</CardActions>
</Card>