aussehen rahmen

php/php-dog/wantNewPw.php

@@ -43,18 +43,18 @@ function sendMail($email, $pwtoken)
     $mail = new CNetcupMailer();
     $mail->CharSet = "UTF-8";
     
-    $mail->setFrom('dog@hope-fly.de', 'Administrator');
+    $mail->setFrom('dog@hope-fly.de', 'Administrator hope-fly.de/dog');
     $mail->addAddress($email);     //Add a recipient
     $mail->addReplyTo('No Reply');
     $mail->isHTML(true);
     //Attachments
 
     //Content
-    $mail->Subject = 'Passwort zurücksetzen!';
+    $mail->Subject = 'Ihr neues Passwort!';
     $mail->Body    = 
 "<h3>Neues Passwort setzen</h3>
-<p>Gültig bis $expiresStr</p>
-<a href='https://hope-fly.de/dog/pwreset/$pwtoken'>Setzen</a>";
+<p>Link gültig 30 Minuten bis $expiresStr</p>
+<a href='https://hope-fly.de/dog/pwreset/$pwtoken'>Passwort setzen</a>";
 
     return $mail->send();
 }

src/components/ContactForm.css

@@ -53,6 +53,10 @@ div.flexCenter
     padding: 20px;
     justify-content: center;   
     width: 60%;
+    
+    padding: 10px;
+    border-style: solid;
+    border-width: 2px;
   }
   
   .formForm
@@ -92,6 +96,7 @@ div.flexCenter
   {
     display: flex;
     flex-direction: column;
+    align-items: center;
   }
 
   .textArea

src/components/InputForm.css

@@ -1,8 +1,30 @@
 .InputForm
 form
 {
-    width: 65%;
     display: flex;
     flex-direction: column;
     align-items: flex-end;
 }
+
+.InputForm
+.frame
+{
+    padding: 10px;
+    margin: 10px;
+    border: 2px;
+    border-radius: 5px;
+    border-style: solid;
+
+
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.InputForm
+.frameCenter
+{
+    align-items: center;
+    display: flex;
+    flex-direction: column;
+}

src/components/Login.tsx

@@ -70,13 +70,14 @@ const Login = () =>
         <div className='InputForm'>
             <Toaster toastOptions={{ position: "top-center" }} />
             <h2>Login</h2>
-
+            <div className='frameCenter'>
+            <div className='frame'>
             <form onSubmit={submitForm}>
-                <div>
+                <div className='neben'>
                     <label htmlFor="email">Email:</label>
                     <input type="email" name="email" onChange={onChangeInput} placeholder="Your email" id="email" value={formData.email} required />
                 </div>
-                <div>
+                <div className='neben'>
                     <label htmlFor="password">Password:</label>
                     <input type="password" name="password" onChange={onChangeInput} placeholder="New password" id="password" value={formData.password} required />
                 </div>
@@ -85,6 +86,8 @@ const Login = () =>
                 <div className="bottom-link"><Link to="/wantnewpw">Passwort vergessen</Link></div>
             </form>
             </div>
+            </div>
+        </div>
     )
 }
 export default Login;

src/components/PasswordReset.tsx

@@ -69,7 +69,7 @@ export default function PasswordReset()
         if(dataRes.success)
         {
             toast.success('Erfolgreich Passwort geändert!');
-            e.currentTarget.reset();
+            e.currentTarget?.reset();
         }
         else if(!dataRes.success && dataRes.message)
         {
@@ -81,6 +81,8 @@ export default function PasswordReset()
         <div className='InputForm'>
             <Toaster toastOptions={{ position: "top-center" }} />
             <h2>Passwort zurücksetzten!</h2>
+            <div className='frameCenter'>
+            <div className='frame'>
             <form onSubmit={submitForm}>
                 <div className='neben'>
                     <label htmlFor="password1">Passwort: </label>
@@ -94,5 +96,7 @@ export default function PasswordReset()
                 <div className="bottom-link"><Link to="/login">Login</Link></div>
             </form>
             </div>
+            </div>
+        </div>
     )
 } 

src/components/Profil.tsx

@@ -145,6 +145,8 @@ function Profil()
         <div className='InputForm'>
             <Toaster toastOptions={{ position: "top-center" }} />
             <h2>Profil</h2>
+            <div className='frameCenter'>
+            <div className='frame'>
             <div className='neben'>
                 <div className='margin'>
                     {data.data && <Img pth={data.data.picture} className=''/>}
@@ -171,6 +173,8 @@ function Profil()
                 </div>
                 <button type="submit">Update</button>
             </form>
+            </div>
+            </div>
         <Link to={"/qr"}>QR-Code drucken</Link>
         </div>
   )

src/components/Register.tsx

@@ -51,6 +51,8 @@ const Register = () =>
         <div className='InputForm'>
             <Toaster toastOptions={{ position: "top-center" }} />
             <h2>Register</h2>
+            <div className='frameCenter'>
+            <div className='frame'>
             <form onSubmit={submitForm}>
                 <div className='neben'>
                     <label htmlFor="email">Email: </label>                    
@@ -68,6 +70,8 @@ const Register = () =>
                 <div className="bottom-link"><Link to="/login">Login</Link></div>
             </form>
             </div>
+            </div>
+        </div>
     )
 }
 export default Register;

src/components/WantNewPw.tsx

@@ -40,6 +40,8 @@ function WantNewPw()
         <div className='InputForm'>
             <Toaster toastOptions={{ position: "top-center" }} />
             <h2>Neues Passwort setzen!</h2>
+            <div className='frameCenter'>
+            <div className='frame'>
             <form onSubmit={submitForm}>
                 <div className='neben'>
                     <label htmlFor="email">Email: </label>
@@ -50,6 +52,8 @@ function WantNewPw()
                 <button type="submit" >Passwort anfordern</button>
             </form>
             </div>
+            </div>
+        </div>
     )
 }