From cc316b898d9d38fdaf4f64b90bd2dacf7ace7fab Mon Sep 17 00:00:00 2001
From: Tudor Stanciu <tudor.stanciu94@gmail.com>
Date: Wed, 16 Dec 2020 01:29:56 +0200
Subject: [PATCH] Login component update

---
 .gitignore                                    |  3 +-
 src/App.css                                   | 24 -----------
 .../login/components/LoginComponent.js        | 40 ++++++++++++++++++-
 3 files changed, 41 insertions(+), 26 deletions(-)

diff --git a/.gitignore b/.gitignore
index e137dcd..a9c3a07 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,4 +22,5 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
-.eslintcache
\ No newline at end of file
+.eslintcache
+debug.log
diff --git a/src/App.css b/src/App.css
index 74b5e05..c4034ce 100644
--- a/src/App.css
+++ b/src/App.css
@@ -2,17 +2,6 @@
   text-align: center;
 }
 
-.App-logo {
-  height: 40vmin;
-  pointer-events: none;
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .App-logo {
-    animation: App-logo-spin infinite 20s linear;
-  }
-}
-
 .App-header {
   background-color: #282c34;
   min-height: 100vh;
@@ -23,16 +12,3 @@
   font-size: calc(10px + 2vmin);
   color: white;
 }
-
-.App-link {
-  color: #61dafb;
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
diff --git a/src/features/login/components/LoginComponent.js b/src/features/login/components/LoginComponent.js
index f916bb6..3130a11 100644
--- a/src/features/login/components/LoginComponent.js
+++ b/src/features/login/components/LoginComponent.js
@@ -1,7 +1,45 @@
 import React from "react";
+import { makeStyles } from "@material-ui/core/styles";
+import { TextField, InputAdornment } from "@material-ui/core";
+import { AccountCircleOutlined, LockOutlined } from "@material-ui/icons";
+
+const useStyles = makeStyles((theme) => ({
+  margin: {
+    margin: theme.spacing(1),
+  },
+}));
 
 const LoginComponent = () => {
-  return <div>TEST</div>;
+  const classes = useStyles();
+  return (
+    <div>
+      <TextField
+        className={classes.margin}
+        id="username"
+        label="Username"
+        InputProps={{
+          startAdornment: (
+            <InputAdornment position="start">
+              <AccountCircleOutlined />
+            </InputAdornment>
+          ),
+        }}
+      />
+      <br />
+      <TextField
+        className={classes.margin}
+        id="password"
+        label="Password"
+        InputProps={{
+          startAdornment: (
+            <InputAdornment position="start">
+              <LockOutlined />
+            </InputAdornment>
+          ),
+        }}
+      />
+    </div>
+  );
 };
 
 export default LoginComponent;