From 059a322d9e71aafcebb2c7cdb198880562538398 Mon Sep 17 00:00:00 2001
From: Peter KW <peter.k.w.96@gmail.com>
Date: Thu, 11 Apr 2024 00:32:18 +0200
Subject: [PATCH] Changed inputfield slightly + update inputfields in files

---
 frontend/src/Components/AddProject.tsx      |  2 ++
 frontend/src/Components/InputField.tsx      | 16 +++++++++-------
 frontend/src/Components/LoginField.tsx      |  2 ++
 frontend/src/Components/MemberInfoModal.tsx |  2 +-
 frontend/src/Components/Register.tsx        |  2 ++
 5 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/frontend/src/Components/AddProject.tsx b/frontend/src/Components/AddProject.tsx
index c8a1c66..cbc3622 100644
--- a/frontend/src/Components/AddProject.tsx
+++ b/frontend/src/Components/AddProject.tsx
@@ -67,6 +67,7 @@ function AddProject(): JSX.Element {
                 e.preventDefault();
                 setName(e.target.value);
               }}
+              placeholder={"Name"}
             />
             <InputField
               label="Description"
@@ -76,6 +77,7 @@ function AddProject(): JSX.Element {
                 e.preventDefault();
                 setDescription(e.target.value);
               }}
+              placeholder={"Description"}
             />
           </div>
           <div className="flex items-center justify-between">
diff --git a/frontend/src/Components/InputField.tsx b/frontend/src/Components/InputField.tsx
index 699d8fa..5a5cdaf 100644
--- a/frontend/src/Components/InputField.tsx
+++ b/frontend/src/Components/InputField.tsx
@@ -4,19 +4,21 @@
  * @returns {JSX.Element} The input field
  * @example
  * <InputField
- *   type="text"
  *   label="Example"
+ *   placeholder="New placeholder"
+ *   type="text"
+ *   value={example}
  *   onChange={(e) => {
  *     setExample(e.target.value);
  *   }}
- *   value={example}
  * />
  */
 function InputField(props: {
-  label: string;
-  type: string;
-  value: string;
-  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+  label?: string;
+  placeholder?: string;
+  type?: string;
+  value?: string;
+  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
 }): JSX.Element {
   return (
     <div className="">
@@ -30,7 +32,7 @@ function InputField(props: {
         className="appearance-none border-2 border-black rounded-2xl w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
         id={props.label}
         type={props.type}
-        placeholder={props.label}
+        placeholder={props.placeholder}
         value={props.value}
         onChange={props.onChange}
       />
diff --git a/frontend/src/Components/LoginField.tsx b/frontend/src/Components/LoginField.tsx
index dda1714..8d0aa62 100644
--- a/frontend/src/Components/LoginField.tsx
+++ b/frontend/src/Components/LoginField.tsx
@@ -33,6 +33,7 @@ function Login(props: {
             props.setUsername(e.target.value);
           }}
           value={props.username}
+          placeholder={"Username"}
         />
         <InputField
           type="password"
@@ -41,6 +42,7 @@ function Login(props: {
             props.setPassword(e.target.value);
           }}
           value={props.password}
+          placeholder={"Password"}
         />
       </div>
       <Button
diff --git a/frontend/src/Components/MemberInfoModal.tsx b/frontend/src/Components/MemberInfoModal.tsx
index dac11f8..10fb5f7 100644
--- a/frontend/src/Components/MemberInfoModal.tsx
+++ b/frontend/src/Components/MemberInfoModal.tsx
@@ -23,7 +23,7 @@ function MemberInfoModal(props: {
       className="fixed inset-10 bg-opacity-30 backdrop-blur-sm 
       flex justify-center items-center"
     >
-      <div className="border-4 border-black bg-white rounded-lg text-center flex flex-col">
+      <div className="border-4 border-black bg-white rounded-2xl text-center flex flex-col">
         <div className="mx-10">
           <p className="font-bold text-[30px]">{props.username}</p>
           <p
diff --git a/frontend/src/Components/Register.tsx b/frontend/src/Components/Register.tsx
index be35a74..af5808c 100644
--- a/frontend/src/Components/Register.tsx
+++ b/frontend/src/Components/Register.tsx
@@ -61,6 +61,7 @@ export default function Register(): JSX.Element {
               onChange={(e) => {
                 setUsername(e.target.value);
               }}
+              placeholder={"Username"}
             />
             <InputField
               label="Password"
@@ -69,6 +70,7 @@ export default function Register(): JSX.Element {
               onChange={(e) => {
                 setPassword(e.target.value);
               }}
+              placeholder={"Password"}
             />
           </div>
           <div className="flex items-center justify-between">