diff options
| author | eug-vs <eug-vs@keemail.me> | 2020-10-09 00:21:58 +0300 |
|---|---|---|
| committer | eug-vs <eug-vs@keemail.me> | 2020-10-09 00:21:58 +0300 |
| commit | 388ccd1ae73e0dcc710e9b497e95c70a131c73cc (patch) | |
| tree | 28c8ed1c8ec2087e443d3e1120ec14126e29e4c1 | |
| parent | 2f35115f03c8080424ef24302091c5125ff68ff0 (diff) | |
| download | which-ui-388ccd1ae73e0dcc710e9b497e95c70a131c73cc.tar.gz | |
feat: remove gap between header on mobile
| -rw-r--r-- | src/components/ModalScreen/ModalScreen.tsx | 4 | ||||
| -rw-r--r-- | src/containers/PollCreation/PollCreation.tsx | 9 |
2 files changed, 9 insertions, 4 deletions
diff --git a/src/components/ModalScreen/ModalScreen.tsx b/src/components/ModalScreen/ModalScreen.tsx index c6f0565..cf76272 100644 --- a/src/components/ModalScreen/ModalScreen.tsx +++ b/src/components/ModalScreen/ModalScreen.tsx @@ -27,7 +27,9 @@ const useStyles = makeStyles(theme => ({ backgroundColor: theme.palette.background.default }, content: { - padding: theme.spacing(6, 0) + [theme.breakpoints.up('md')]: { + padding: theme.spacing(4) + } }, toolbar: { display: 'flex', diff --git a/src/containers/PollCreation/PollCreation.tsx b/src/containers/PollCreation/PollCreation.tsx index 33d95bb..2e2bd06 100644 --- a/src/containers/PollCreation/PollCreation.tsx +++ b/src/containers/PollCreation/PollCreation.tsx @@ -1,4 +1,4 @@ -import React, { ChangeEvent, useState } from 'react'; +import React, { ChangeEvent, useState, useMemo } from 'react'; import Bluebird from 'bluebird'; import { makeStyles } from '@material-ui/core/styles'; import { Card, Container, LinearProgress, InputBase, Typography } from '@material-ui/core'; @@ -72,12 +72,14 @@ const PollCreation: React.FC = () => { } }; + const isSubmitting = useMemo(() => leftProgress + rightProgress > 0, [leftProgress, rightProgress]); + return ( <ModalScreen title="Create a poll" actionIcon={<SendIcon />} handleAction={handleSubmit} - isActionDisabled={!(left && right) || leftProgress + rightProgress > 0} + isActionDisabled={!(left && right) || isSubmitting} > <Container maxWidth="sm" disableGutters> <Card elevation={3}> @@ -89,6 +91,7 @@ const PollCreation: React.FC = () => { placeholder="Add description" onChange={handleDescriptionChange} className={classes.description} + readOnly={isSubmitting} /> </Typography> <div className={classes.images}> @@ -96,7 +99,7 @@ const PollCreation: React.FC = () => { <ImageInput callback={setRight} progress={rightProgress} /> </div> </Card> - {(leftProgress + rightProgress > 0) && ( + {isSubmitting && ( <> <LinearProgress color="primary" /> <Message |