From 9621a12f0c7e453e89af8702c39fe8c8734de972 Mon Sep 17 00:00:00 2001
From: cami <cami+giteaspcodes@mailbox.org>
Date: Mon, 21 Jun 2021 04:55:31 +0200
Subject: [PATCH] Register field in frontend. still needs some design things

---
 frontend/src/App.css                   | 21 ++++++++-------------
 frontend/src/components/Input.css      |  6 ++++++
 frontend/src/components/InputField.js  |  3 ++-
 frontend/src/components/Navbar.css     |  2 +-
 frontend/src/components/pages/Login.js |  1 +
 5 files changed, 18 insertions(+), 15 deletions(-)
 create mode 100644 frontend/src/components/Input.css

diff --git a/frontend/src/App.css b/frontend/src/App.css
index 52855cf..4f1d6f3 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -7,7 +7,7 @@
 
 :root {
   --primary: rgb(41, 63, 87);
-  --secondary: #fff;
+  --secondary: rgb(218,218,218);
   --third: rgb(171, 183, 183);
 }
 
@@ -28,29 +28,24 @@
   font-size: 100px;
 }
 
-.products {
-  background-image: url('images/img-9.jpg');
-  background-position: center;
-  background-size: fill;
-  background-repeat: no-repeat;
-  color: var(--primary);
-  font-size: 100px;
-}
-
 .sign-up {
-  background-image: url('images/img-9.jpg');
+  background-image: url("images/img-9.jpg");
   background-position: center;
   background-size: cover;
   background-repeat: no-repeat;
-  color: #fff;
+  color: var(--primary);
   font-size: 100px;
 }
 
 .sitePage {
   height: 90vh;
   display: flex;
-  justify-content: center;
+  flex-direction: column;
+  align-content: center;
+  align-items: center;
+  background-color: var(--secondary);
 }
 .sitePage h1 {
   font-size: 80px;
+  margin: 0.7em auto;
 }
diff --git a/frontend/src/components/Input.css b/frontend/src/components/Input.css
new file mode 100644
index 0000000..2e52c93
--- /dev/null
+++ b/frontend/src/components/Input.css
@@ -0,0 +1,6 @@
+.input-field {
+    width: auto;
+}
+.input-field input {
+    border-color: var(--primary);
+}
\ No newline at end of file
diff --git a/frontend/src/components/InputField.js b/frontend/src/components/InputField.js
index c6cda35..f71a029 100644
--- a/frontend/src/components/InputField.js
+++ b/frontend/src/components/InputField.js
@@ -1,8 +1,9 @@
 import React from "react";
+import "./Input.css";
 
 function InputField(props) {
   return (
-    <label>
+    <label className="input-field">
       <p>{props.LabelName}</p>
       <input name={props.InputName} type={props.InputType} />
     </label>
diff --git a/frontend/src/components/Navbar.css b/frontend/src/components/Navbar.css
index da8f609..23680d3 100644
--- a/frontend/src/components/Navbar.css
+++ b/frontend/src/components/Navbar.css
@@ -146,7 +146,7 @@
     background-color: transparent;
     color: var(--primary);
     padding: 14px 20px;
-    border: 1px solid #fff;
+    border: 1px solid var(--primary);
     transition: all 0.3s ease-out;
   }
 
diff --git a/frontend/src/components/pages/Login.js b/frontend/src/components/pages/Login.js
index 0e29c40..b3fe806 100644
--- a/frontend/src/components/pages/Login.js
+++ b/frontend/src/components/pages/Login.js
@@ -20,6 +20,7 @@ export default function Login() {
             InputType="password"
             InputName="password"
           />
+          <br />
           <SubmitField LabelName="Einloggen" />
         </form>
       </div>