login page update

private/Notes.txt

@@ -0,0 +1,3 @@
+In gridul de retea, pe fiecare linie va fi un buton care va deschide un log.
+Log-ul va fi popup iar continutul lui poate fi ultima componenta de aici https://material-ui.com/components/app-bar/
+**************************************************************************************************************************

src/components/App.js

@@ -28,7 +28,7 @@ const App = () => {
         </ApplicationDispatchContext.Provider>
       </ApplicationStateContext.Provider>
       <ToastContainer
-        position="top-right"
+        position="bottom-right"
         transition={Slide}
         autoClose={3000}
         hideProgressBar={false}

src/features/login/components/LoginComponent.js

@@ -1,7 +1,14 @@
 import React from "react";
 import PropTypes from "prop-types";
 import { makeStyles } from "@material-ui/core/styles";
-import { TextField, InputAdornment, Button } from "@material-ui/core";
+import {
+  TextField,
+  InputAdornment,
+  Button,
+  Card,
+  CardActions,
+  CardContent
+} from "@material-ui/core";
 import { AccountCircleOutlined } from "@material-ui/icons";
 import PasswordField from "../../../components/common/inputs/PasswordField";
 import { useTranslation } from "react-i18next";
@@ -18,7 +25,8 @@ const LoginComponent = ({ credentials, onChange, onLogin }) => {
   const { t } = useTranslation();
 
   return (
-    <div>
+    <Card variant="outlined">
+      <CardContent>
         <TextField
           className={classes.field}
           id="username"
@@ -41,11 +49,13 @@ const LoginComponent = ({ credentials, onChange, onLogin }) => {
           onChange={onChange("password")}
           value={credentials.password}
         />
-      <br />
+      </CardContent>
+      <CardActions>
         <Button variant="contained" color="primary" onClick={onLogin}>
           {t("Login.Label")}
         </Button>
-    </div>
+      </CardActions>
+    </Card>
   );
 };