From ff4196b57cc2a167eda392908ec214732b9f06fd Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Sun, 15 Nov 2020 08:41:58 +0300
Subject: feat: optimize layout for mobile

---
 src/containers/BsuFantomSection/EventForm.tsx | 18 ++++++++++++------
 src/index.tsx                                 |  4 +++-
 2 files changed, 15 insertions(+), 7 deletions(-)

(limited to 'src')

diff --git a/src/containers/BsuFantomSection/EventForm.tsx b/src/containers/BsuFantomSection/EventForm.tsx
index de3adc7..beb94fd 100644
--- a/src/containers/BsuFantomSection/EventForm.tsx
+++ b/src/containers/BsuFantomSection/EventForm.tsx
@@ -38,48 +38,54 @@ const EventForm: React.FC<PropTypes> = ({ mutate }) => {
 
   return (
     <Grid container spacing={2}>
-      <Grid item>
+      <Grid item sm={6} xs={12}>
         <TextField
           value={name}
           onChange={createHandler(setName)}
           variant="outlined"
           label="Name"
+          fullWidth
+          required
         />
       </Grid>
-      <Grid item>
+      <Grid item sm={6} xs={12}>
         <TextField
           value={date}
           onChange={createHandler(setDate)}
           variant="outlined"
           label="Date"
+          fullWidth
           required
         />
       </Grid>
-      <Grid item>
+      <Grid item sm={6} xs={12}>
         <TextField
           value={conferenceId}
           onChange={createHandler(setConferenceId)}
           variant="outlined"
           label="Conference ID"
+          fullWidth
           required
         />
       </Grid>
-      <Grid item>
+      <Grid item sm={6} xs={12}>
         <TextField
           value={attendanceId}
           onChange={createHandler(setAttendanceId)}
           variant="outlined"
           label="Attendance ID"
+          fullWidth
         />
       </Grid>
-      <Grid item xs={12}>
+      <Grid item sm={2} xs={12}>
         <Button
           onClick={handleSubmit}
           variant="contained"
           size="large"
           color="primary"
+          fullWidth
         >
-          CREATE JOB
+          Create event
         </Button>
       </Grid>
     </Grid>
diff --git a/src/index.tsx b/src/index.tsx
index 5155ab7..c0f8c9b 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -8,7 +8,9 @@ import { AuthProvider } from './hooks/useAuth';
 
 const useStyles = makeStyles(theme => ({
   root: {
-    margin: theme.spacing(4),
+    [theme.breakpoints.up('md')]: {
+      margin: theme.spacing(4)
+    },
     padding: theme.spacing(2),
     minHeight: theme.spacing(60)
   }
-- 
cgit v1.2.3