adjust create funding for small view ports

This commit is contained in:
Barry Gitarts 2019-08-27 16:05:49 -04:00 committed by Barry G
parent c2d5b0146f
commit fdb1cc89d7

View File

@ -7,6 +7,7 @@ import Button from '@material-ui/core/Button'
import InputAdornment from '@material-ui/core/InputAdornment' import InputAdornment from '@material-ui/core/InputAdornment'
import { withStyles } from '@material-ui/core/styles' import { withStyles } from '@material-ui/core/styles'
import { withRouter } from "react-router-dom" import { withRouter } from "react-router-dom"
import useWindowSize from '@rehooks/window-size'
import { uploadFilesToIpfs, pinToGateway, formatMedia, isWeb } from '../../utils/ipfs' import { uploadFilesToIpfs, pinToGateway, formatMedia, isWeb } from '../../utils/ipfs'
import { FundingContext } from '../../context' import { FundingContext } from '../../context'
import {ZERO_ADDRESS} from '../../utils/address' import {ZERO_ADDRESS} from '../../utils/address'
@ -69,7 +70,10 @@ const styles = theme => ({
formButton: { formButton: {
gridColumnStart: '6', gridColumnStart: '6',
gridColumnEnd: '13', gridColumnEnd: '13',
height: '50px' height: '50px',
[theme.breakpoints.down('md')]: {
marginTop: '5rem'
}
}, },
textField: { textField: {
gridColumnStart: '1', gridColumnStart: '1',
@ -180,6 +184,8 @@ const addProjectSucessMsg = response => {
const SubmissionSection = ({ classes, history }) => { const SubmissionSection = ({ classes, history }) => {
const [uploads, setUploads] = useState({}) const [uploads, setUploads] = useState({})
const { account, openSnackBar, prices } = useContext(FundingContext) const { account, openSnackBar, prices } = useContext(FundingContext)
const windowSize = useWindowSize()
const isSmall = windowSize.innerWidth < 800
return ( return (
<Formik <Formik
initialValues={{ initialValues={{
@ -238,7 +244,9 @@ const SubmissionSection = ({ classes, history }) => {
const usdValue = convertTokenAmountUsd(goalToken, goal, prices) const usdValue = convertTokenAmountUsd(goalToken, goal, prices)
return ( return (
<form onSubmit={handleSubmit} className={classes.submissionRoot}> <form onSubmit={handleSubmit} className={classes.submissionRoot}>
<div className={firstHalf}> <div className={classnames(firstHalf, {
[classes.fullWidth]: isSmall
})}>
<BreadCrumb <BreadCrumb
className={fullWidth} className={fullWidth}
trail={['Create new']} trail={['Create new']}
@ -397,8 +405,12 @@ const SubmissionSection = ({ classes, history }) => {
value={values.commitTime || ''} value={values.commitTime || ''}
/> />
</div> </div>
<div className={secondHalf}> <div className={classnames(secondHalf, {
<Button type="submit" color="primary" variant="contained" className={classnames(classes.formButton)}>{isSubmitting ? 'Ethereum Submission In Progress' : 'Publish'}</Button> [classes.fullWidth]: isSmall
})}>
<Button type="submit" color="primary" variant="contained" className={classnames(classes.formButton, {
[classes.fullWidth]: isSmall
})}>{isSubmitting ? 'Ethereum Submission In Progress' : 'Publish'}</Button>
<CurrencySelect <CurrencySelect
className={fullWidth} className={fullWidth}
InputProps={{ InputProps={{