From 6378246286b69069796260817e8100be2e26b37b Mon Sep 17 00:00:00 2001
From: Tudor Stanciu <tudor.stanciu94@gmail.com>
Date: Thu, 24 Dec 2020 13:16:53 +0200
Subject: [PATCH] login page update

---
 private/Notes.txt                             |  3 +
 src/components/App.js                         |  2 +-
 .../login/components/LoginComponent.js        | 68 +++++++++++--------
 3 files changed, 43 insertions(+), 30 deletions(-)
 create mode 100644 private/Notes.txt

diff --git a/private/Notes.txt b/private/Notes.txt
new file mode 100644
index 0000000..58cc366
--- /dev/null
+++ b/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/
+**************************************************************************************************************************
\ No newline at end of file
diff --git a/src/components/App.js b/src/components/App.js
index 9a373a9..321c20a 100644
--- a/src/components/App.js
+++ b/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}
diff --git a/src/features/login/components/LoginComponent.js b/src/features/login/components/LoginComponent.js
index e65f855..3e451d2 100644
--- a/src/features/login/components/LoginComponent.js
+++ b/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,34 +25,37 @@ const LoginComponent = ({ credentials, onChange, onLogin }) => {
   const { t } = useTranslation();
 
   return (
-    <div>
-      <TextField
-        className={classes.field}
-        id="username"
-        label={t("Login.Username")}
-        onChange={onChange("userName")}
-        value={credentials.userName}
-        InputProps={{
-          startAdornment: (
-            <InputAdornment position="start">
-              <AccountCircleOutlined />
-            </InputAdornment>
-          )
-        }}
-      />
-      <br />
-      <PasswordField
-        id="password"
-        label={t("Login.Password")}
-        className={classes.field}
-        onChange={onChange("password")}
-        value={credentials.password}
-      />
-      <br />
-      <Button variant="contained" color="primary" onClick={onLogin}>
-        {t("Login.Label")}
-      </Button>
-    </div>
+    <Card variant="outlined">
+      <CardContent>
+        <TextField
+          className={classes.field}
+          id="username"
+          label={t("Login.Username")}
+          onChange={onChange("userName")}
+          value={credentials.userName}
+          InputProps={{
+            startAdornment: (
+              <InputAdornment position="start">
+                <AccountCircleOutlined />
+              </InputAdornment>
+            )
+          }}
+        />
+        <br />
+        <PasswordField
+          id="password"
+          label={t("Login.Password")}
+          className={classes.field}
+          onChange={onChange("password")}
+          value={credentials.password}
+        />
+      </CardContent>
+      <CardActions>
+        <Button variant="contained" color="primary" onClick={onLogin}>
+          {t("Login.Label")}
+        </Button>
+      </CardActions>
+    </Card>
   );
 };