From 3ba5941cb5758494090bd30d632d3a08e3cd1cda Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Sun, 15 Nov 2020 04:49:44 +0300
Subject: feat: make grids responsive

---
 .../BsuFantomSection/BsuFantomSection.tsx          |  2 +-
 src/containers/BsuFantomSection/EventForm.tsx      | 16 +++++++--------
 src/containers/BsuFantomSection/LoginForm.tsx      | 23 ++++------------------
 3 files changed, 13 insertions(+), 28 deletions(-)

diff --git a/src/containers/BsuFantomSection/BsuFantomSection.tsx b/src/containers/BsuFantomSection/BsuFantomSection.tsx
index 33f39b2..6420402 100644
--- a/src/containers/BsuFantomSection/BsuFantomSection.tsx
+++ b/src/containers/BsuFantomSection/BsuFantomSection.tsx
@@ -27,7 +27,7 @@ const BsuFantomSection: React.FC = () => {
             <ContentSection sectionName="Upcoming events" level={2}>
               <Grid container spacing={2}>
                 {events?.map((event, index) => (
-                  <Grid item xs={4}>
+                  <Grid item lg={3} md={4} sm={6} xs={12}>
                     <EventCard event={event} mutate={mutate} />
                   </Grid>
                 ))}
diff --git a/src/containers/BsuFantomSection/EventForm.tsx b/src/containers/BsuFantomSection/EventForm.tsx
index 64ea46b..e52dc5d 100644
--- a/src/containers/BsuFantomSection/EventForm.tsx
+++ b/src/containers/BsuFantomSection/EventForm.tsx
@@ -45,25 +45,25 @@ const EventForm: React.FC<PropTypes> = ({ mutate }) => {
           value={date}
           onChange={createHandler(setDate)}
           variant="outlined"
-          label="When"
+          label="Date"
           required
         />
       </Grid>
       <Grid item>
         <TextField
-          value={attendanceId}
-          onChange={createHandler(setAttendanceId)}
+          value={conferenceId}
+          onChange={createHandler(setConferenceId)}
           variant="outlined"
-          label="Attendance ID"
+          label="Conference ID"
+          required
         />
       </Grid>
       <Grid item>
         <TextField
-          value={conferenceId}
-          onChange={createHandler(setConferenceId)}
+          value={attendanceId}
+          onChange={createHandler(setAttendanceId)}
           variant="outlined"
-          label="Conference ID"
-          required
+          label="Attendance ID"
         />
       </Grid>
       <Grid item xs={12}>
diff --git a/src/containers/BsuFantomSection/LoginForm.tsx b/src/containers/BsuFantomSection/LoginForm.tsx
index 208c1f7..3204a64 100644
--- a/src/containers/BsuFantomSection/LoginForm.tsx
+++ b/src/containers/BsuFantomSection/LoginForm.tsx
@@ -1,24 +1,9 @@
 import React, { useState } from 'react';
-import { ContentSection } from 'react-benzin';
-import { Link, TextField, Button, Grid } from '@material-ui/core';
-import { makeStyles } from '@material-ui/core/styles';
+import { TextField, Button, Grid } from '@material-ui/core';
 import { useAuth } from '../../hooks/useAuth';
 
 
-const useStyles = makeStyles(theme => ({
-  form: {
-    width: theme.spacing(50),
-    display: 'flex',
-    flexDirection: 'column',
-    '& > *': {
-      margin: theme.spacing(1)
-    }
-  },
-}));
-
-
 const LoginForm: React.FC = () => {
-  const classes = useStyles();
   const { login } = useAuth();
   const [username, setUsername] = useState<string>('');
   const [password, setPassword] = useState<string>('');
@@ -35,7 +20,7 @@ const LoginForm: React.FC = () => {
 
   return (
       <Grid container direction="column" spacing={2}>
-        <Grid item xs={3}>
+        <Grid item md={3} xs={12}>
           <TextField
             onChange={handleChangeUsername}
             variant="outlined"
@@ -43,7 +28,7 @@ const LoginForm: React.FC = () => {
             fullWidth
           />
         </Grid>
-        <Grid item xs={3}>
+        <Grid item md={3} xs={12}>
           <TextField
             onChange={handleChangePassword}
             variant="outlined"
@@ -52,7 +37,7 @@ const LoginForm: React.FC = () => {
             fullWidth
           />
         </Grid>
-        <Grid item xs={3}>
+        <Grid item md={3} xs={12}>
           <Button
             onClick={handleSubmit}
             variant="contained"
-- 
cgit v1.2.3