add imput composant

front/package.json

@@ -34,7 +34,8 @@
     "astro-icon": "^1.1.0",
     "limax": "4.1.0",
     "lodash.merge": "^4.6.2",
-    "unpic": "^3.18.0"
+    "unpic": "^3.18.0",
+    "tailwind-merge": "^2.3.0"
   },
   "devDependencies": {
     "@astrojs/check": "^0",

front/src/components/Input.astro

@@ -0,0 +1,28 @@
+---
+import type { Input as Props } from 'types';
+
+const { type, name, label, autocomplete, placeholder} = Astro.props;
+
+---
+
+<>
+  {
+    name && (
+      <div class="mb-6">
+        {label && (
+          <label for={name} class="block text-sm font-medium">
+            {label}
+          </label>
+        )}
+        <input
+          type={type}
+          name={name}
+          id={name}
+          autocomplete={autocomplete}
+          placeholder={placeholder}
+          class="py-3 px-4 block w-full text-md rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-slate-900"
+        />
+      </div>
+    )
+  }
+</>

front/src/pages/account/register.astro

@@ -80,18 +80,4 @@ const metadata = {
     ]}
   />
   <Oauth/>
-  <form id="account-creation" method="post" enctype="multipart/form-data">
-    <input type="hidden" name="type" value="userPassword">
-    <input required name="name" placeholder="Prénom Nom"/>
-    <input required name="username" placeholder="Pseudo"/>
-    <input required name="email" type="email" placeholder="Renseignez votre email" />
-    <input required name="password" type="password" placeholder="Créez un mot de passe" />
-    <input required name="passwordConfirm" type="password" placeholder="Confirmer votre mot de passe" />
-    <button>Créer un compte</button>
-</form>
-
-<button id="OauthDiscord">connexion avec discord</button>
-<form method="post" enctype="multipart/form-data">
-    <input type="hidden" name="type" value="discord2FA">
-</form>
 </Layout>

front/tailwind.config.cjs

@@ -1,5 +1,5 @@
-import defaultTheme from 'tailwindcss/defaultTheme';
-import typographyPlugin from '@tailwindcss/typography';
+import defaultTheme from 'tailwindcss/defaultTheme'
+import typographyPlugin from '@tailwindcss/typography'
 
 module.exports = {
 	content: ['./src/**/*.{astro,html,js,jsx,json,md,mdx,svelte,ts,tsx,vue}'],
@@ -21,4 +21,5 @@ module.exports = {
 	},
 	plugins: [typographyPlugin],
 	darkMode: 'class',
-};
+}
+

front/tailwind.config.mjs

@@ -1,8 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-export default {
-	content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
-	theme: {
-		extend: {},
-	},
-	plugins: [],
-}