Merge pull request #12 from gpul-org/develop

feat: Close registration forms

Author: delthia

src/components/register/Form.tsx

@@ -61,7 +61,7 @@ export default function Form() {
   }
 
   return (
-    <form className="flex flex-col gap-2 text-base sm:grid sm:grid-cols-2 sm:gap-4" onSubmit={handleSubmit}>
+    <form className="flex flex-col gap-2 text-base sm:grid sm:grid-cols-2 sm:gap-4 pointer-events-none" onSubmit={handleSubmit}>
       <InputText id="nameInput" label="Nombre completo" placeholder="John Doe" required icon={faUser} />
       <InputText id="emailInput" label="Email" type="email" placeholder="john@example.com" required icon={faEnvelope} />
       <InputText

src/components/register/FormVoluntarios.tsx

@@ -56,7 +56,7 @@ export default function Form() {
   }
 
   return (
-    <form className="flex flex-col gap-2 text-base sm:grid sm:grid-cols-2 sm:gap-4" onSubmit={handleSubmit}>
+    <form className="flex flex-col gap-2 text-base sm:grid sm:grid-cols-2 sm:gap-4 pointer-events-none" onSubmit={handleSubmit}>
       <div className="col-span-2 w-full">
       <InputText id="nameInput" label="Nombre completo" placeholder="John Doe" required icon={faUser} />
       </div>

src/pages/registro/index.astro

@@ -18,7 +18,9 @@ import Footer from '../../components/Footer.astro'
       >
 
       <div class="mx-auto mt-14 w-[300px] sm:w-[400px] md:w-[500px]">
-        <Logo />
+        <div class="m-auto w-fit">
+          <Logo />
+        </div>
       </div>
       <p class="mt-14 text-center text-3xl sm:text-4xl md:text-5xl">
         Regístrate para
@@ -30,8 +32,18 @@ import Footer from '../../components/Footer.astro'
 
       <!-- Formulario -->
       <div class="bg-animated mx-auto mt-12 w-full rounded-xl p-0.5">
-        <div class="rounded-xl bg-[#181818] p-4 md:p-8">
+        <div class="relative rounded-xl bg-[#181818] p-4 md:p-8">
           <Form client:load />
+          <div class="absolute inset-0 flex flex-col items-center justify-center rounded-xl backdrop-blur">
+            <h1
+              class="inline-block bg-gradient-to-br from-green-700 via-green-500 to-green-700 bg-clip-text pb-2 text-center text-7xl font-medium text-transparent"
+            >
+              Registro cerrado
+            </h1>
+            <h2 class="text-center text-xl md:w-3/6">
+              Hemos recibido más solicitudes que plazas, por lo que ya no aceptamos más solicitudes
+            </h2>
+          </div>
         </div>
       </div>
       <div class="mt-8 text-center text-lg">

src/pages/registro/voluntarios.astro

@@ -18,7 +18,9 @@ import Footer from '../../components/Footer.astro'
       >
 
       <div class="mx-auto mt-14 w-[300px] sm:w-[400px] md:w-[500px]">
-        <Logo />
+        <div class="m-auto w-fit">
+          <Logo />
+        </div>
       </div>
       <p class="mt-14 text-center text-3xl sm:text-4xl md:text-5xl">
         Hazte mentor/voluntario para
@@ -36,8 +38,16 @@ import Footer from '../../components/Footer.astro'
       </p>
       <!-- Formulario -->
       <div class="bg-animated mx-auto mt-8 w-full rounded-xl p-0.5">
-        <div class="rounded-xl bg-[#181818] p-4 md:p-8">
+        <div class="relative rounded-xl bg-[#181818] p-4 md:p-8">
           <Form client:load />
+          <div class="absolute inset-0 flex flex-col items-center justify-center rounded-xl backdrop-blur">
+            <h1
+              class="inline-block bg-gradient-to-br from-green-700 via-green-500 to-green-700 bg-clip-text pb-2 text-center text-7xl font-medium text-transparent"
+            >
+              Registro cerrado
+            </h1>
+            <h2 class="text-center text-xl md:w-3/6">Gracias por tu interés en ayudarnos con HackUDC.</h2>
+          </div>
         </div>
       </div>
     </div>