Frontend/src/components/App.js

@@ -5,6 +5,7 @@ import Login from "./Login.js";
 import { Box } from "@material-ui/core";
 import Aufnahmeantrag from "./Aufnahmeantrag.js";
 import { createMuiTheme, MuiThemeProvider } from "@material-ui/core";
+import { green, yellow } from "@material-ui/core/colors";
 
 const theme = createMuiTheme({
   palette: {

Frontend/src/components/Login.js

@@ -1,80 +1,36 @@
 import React, { Component } from "react";
-import { TextField, Typography, Grid, Fab, Container } from "@material-ui/core";
+import TextField from "@material-ui/core/TextField";
-import SendIcon from "@material-ui/icons/Send";
-import { withStyles, createStyles } from "@material-ui/styles";
-
-const useStyles = createStyles(theme => ({
-  textField: {
-    margingLeft: theme.spacing(1),
-    marginRight: theme.spacing(1)
-  },
-  fab: {
-    margin: theme.spacing(1)
-  },
-  form: {
-    backgroundColor: "#f5f5f5",
-    borderRadius: "5px",
-    margin: "20px",
-    padding: "20px",
-    boxShadow: "0px 0px 5px 0px lightgrey",
-    border: "1px solid lightgrey"
-  }
-}));
 
 class Login extends Component {
-  state = { username: "", password: "" };
+  state = {};
-
-  handleChange = name => event => {
-    this.setState({ [name]: event.target.value });
-  };
-
   render() {
-    const classes = this.props.classes;
-
     return (
-      <Container maxWidth="md">
+      <form>
-        <div className={classes.form}>
+        <TextField
-          <Grid container direction="row" justify="center" alignItems="center">
+          variant="outlined"
-            <Grid container spacing={1}>
+          margin="normal"
-              <Grid item xs={12}>
+          required
-                <Typography align="center" variant="h4">
+          fullWidth
-                  Login
+          id="email"
-                </Typography>
+          label="Email Address"
-              </Grid>
+          name="email"
-              <Grid item xs={12}>
+          autoComplete="email"
-                <TextField
+          autoFocus
-                  fullWidth={true}
+        />
-                  id="outlined-name"
+        <TextField
-                  label="Username"
+          type="password"
-                  className={classes.textField}
+          variant="outlined"
-                  value={this.state.username}
+          margin="normal"
-                  onChange={this.handleChange("username")}
+          required
-                  margin="normal"
+          fullWidth
-                  variant="outlined"
+          id="password"
-                />
+          label="Password"
-              </Grid>
+          name="password"
-              <Grid item xs={12}>
+          autoComplete="password"
-                <TextField
+        />
-                  fullWidth={true}
+      </form>
-                  id="outlined-name"
-                  label="Password"
-                  className={classes.textField}
-                  value={this.state.password}
-                  onChange={this.handleChange("password")}
-                  margin="normal"
-                  variant="outlined"
-                  type="password"
-                />
-              </Grid>
-            </Grid>
-            <Fab color="primary" aria-label="Send" className={classes.fab}>
-              <SendIcon />
-            </Fab>
-          </Grid>
-        </div>
-      </Container>
     );
   }
 }
 
-export default withStyles(useStyles)(Login);
+export default Login;