clean css

resources/js/pages/Auth/Register.tsx

@@ -2,6 +2,7 @@ import React, {ChangeEvent, FormEvent, SyntheticEvent, useState} from "react"
 import Field from "../../components/Field";
 import axios from "axios";
 import {useNavigate} from "react-router-dom";
+import Card from "../../components/Card";
 
 const Register = () => {
 
@@ -23,28 +24,32 @@ const Register = () => {
     }
 
     return <div>
-        <form onSubmit={handleSubmit} className="w-96 mx-auto mt-10 border shadow p-3">
-            <h1 className="text-center">S'inscrire</h1>
+        <Card className="w-96 mx-auto mt-10 p-2 overflow-hidden">
+            <form onSubmit={handleSubmit}>
+                <h1 className="text-center bg-blue-500 -mx-2 -mt-1 text-lg font-bold px-2 py-1 mb-2">
+                    S'inscrire
+                </h1>
 
-            <Field placeholder="Nom"
-                   name="name"
-                   value={name}
-                   onChange={event => setName(event.target.value)}
-                   autoFocus>Nom</Field>
-            <Field type="email"
-                   name="email"
-                   placeholder="Email"
-                   value={email}
-                   onChange={event => setEmail(event.target.value)}
-                   autoFocus>Email</Field>
-            <Field type="password"
-                   name="password"
-                   placeholder="******"
-                   value={password}
-                   onChange={event => setPassword(event.target.value)}
-                   autoFocus>Mot de passe</Field>
-            <button type="submit" className="mt-5 bg-blue-700 w-full block text-white px-5 py-2 text-lg rounded">Valider</button>
-        </form>
+                <Field placeholder="Nom"
+                       name="name"
+                       value={name}
+                       onChange={event => setName(event.target.value)}
+                       autoFocus>Nom</Field>
+                <Field type="email"
+                       name="email"
+                       placeholder="Email"
+                       value={email}
+                       onChange={event => setEmail(event.target.value)}
+                       autoFocus>Email</Field>
+                <Field type="password"
+                       name="password"
+                       placeholder="******"
+                       value={password}
+                       onChange={event => setPassword(event.target.value)}
+                       autoFocus>Mot de passe</Field>
+                <button type="submit" className="mt-5 bg-blue-700 w-full block text-white px-5 py-2 text-lg rounded">Valider</button>
+            </form>
+        </Card>
     </div>
 }