feat: :truck: responsividade de checkin

app/components/CheckinHeader.vue

@@ -1,3 +1,3 @@
 <template>
-  <div class="w-full h-[123px] bg-no-repeat bg-cover rounded-br-[300px] bg-[center_24%] bg-[linear-gradient(rgba(0,0,0,0.35)),url('/img/landing_background.png')]"/>
+  <div class="w-full h-[123px] bg-no-repeat bg-cover rounded-br-[100px] md:rounded-br-[150px]  lg:rounded-br-[300px] bg-[center_24%] bg-[linear-gradient(rgba(0,0,0,0.35)),url('/img/landing_background.png')]"/>
 </template>

app/pages/checkin.vue

@@ -1,15 +1,15 @@
 <template>
   <div class="flex flex-col justify-center items-center mt-10 text-center">
-    <div class="bg-primary rounded-full w-31 h-31 flex justify-center items-center">
-      <NuxtImg src="/img/coffee.svg" />
+    <div class="bg-primary rounded-full w-26 h-26 md:w-31 md:h-31 flex justify-center items-center">
+      <NuxtImg src="/img/coffee.svg" class="w-13 md:w-16" />
     </div>
 
     <template v-if="!checkinSuccess">
-      <h1 class="text-2xl mt-3">Registre sua participação</h1>
-      <p class="text-sm text-[#505050] mt-4 px-4">Digite o Código do Evento/live que recebeu para registrar sua presença</p>
+      <h1 class="text-xl md:text-2xl mt-3">Registre sua participação</h1>
+      <p class="text-xs md:text-sm text-[#505050] mt-4 px-4">Digite o Código do Evento/live que recebeu para registrar sua presença</p>
       <form class="flex flex-col justify-center items-center mt-5 gap-2 w-full max-w-[361px]" @submit.prevent="handleCheckin">
         <div class="flex flex-col justify-center items-center w-full">
-          <label for="name" class="text-text-2 mb-1 font-medium text-sm">Nome Cadastrado na plataforma <span class="text-error">*</span></label>
+          <label for="name" class="text-text-2 mb-1 font-medium text-xs md:text-sm">Nome Cadastrado na plataforma <span class="text-error">*</span></label>
           <input
             v-model="name"
             type="text"
@@ -20,7 +20,7 @@
           >
         </div>
         <div class="flex flex-col justify-center items-center w-full">
-          <label for="email" class="text-text-2 mb-1 font-medium text-sm">Email <span class="text-error">*</span></label>
+          <label for="email" class="text-text-2 mb-1 font-medium text-xs md:text-sm">Email <span class="text-error">*</span></label>
           <input
             v-model="email"
             type="email"
@@ -31,20 +31,20 @@
           >
         </div>
         <div class="flex flex-col justify-center items-center w-full">
-          <label for="eventCode" class="text-text-2 mb-1 font-medium text-sm">Código do Evento/live <span class="text-error">*</span></label>
+          <label for="eventCode" class="text-text-2 mb-1 font-medium text-xs md:text-sm">Código do Evento/live <span class="text-error">*</span></label>
           <input
             v-model="eventCode"
             type="text"
             placeholder="Ex. Cafe123"
             :disabled="isLoading"
             required
-            class="border-[1px] border-border rounded-lg text-center h-10 w-full text-sm"
+            class="border-[1px] border-border rounded-lg text-center h-10 w-full text-xs md:text-sm"
           >
         </div>
         <button
           type="submit"
           :disabled="isLoading"
-          class="bg-primary text-white rounded-lg uppercase w-full h-[50px] mt-5 cursor-pointer hover:bg-primary/90 disabled:opacity-50 disabled:cursor-not-allowed"
+          class="bg-primary text-white rounded-lg uppercase text-xs md:text-sm w-full h-[50px] mt-5 cursor-pointer hover:bg-primary/90 disabled:opacity-50 disabled:cursor-not-allowed"
         >
           {{ isLoading ? 'Registrando...' : 'Registrar Presença' }}
         </button>

app/pages/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <div class="bg-[linear-gradient(rgba(0,0,0,0.40)),url('/img/landing_background.png')]  bg-[center_24%] bg-no-repeat bg-cover rounded-br-[100px] md:lg:rounded-br-[150px]  lg:rounded-br-[300px] w-full h-150 lg:h-[789px] text-white-2 flex justify-center items-center px-4">
+    <div class="bg-[linear-gradient(rgba(0,0,0,0.40)),url('/img/landing_background.png')]  bg-[center_24%] bg-no-repeat bg-cover rounded-br-[100px] md:rounded-br-[150px]  lg:rounded-br-[300px] w-full h-150 lg:h-[789px] text-white-2 flex justify-center items-center px-4">
       <div class="flex flex-col justify-between items-center h-[60%]">
         <div class="flex flex-col justify-center items-center gap-8">
           <div class="bg-primary rounded-full w-26 h-26 md:w-31 md:h-31 flex justify-center items-center">