Update form labels and descriptions for clarity and consistency acros…

…s youth challenges and initiatives
DemocraciaEnRed · Jan 3, 2025 · 66cda94 · 66cda94
1 parent e4e2c59
commit 66cda94
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 14 deletions.
diff --git a/components/desafios/Form.vue b/components/desafios/Form.vue
@@ -152,7 +152,7 @@ const selectDimension = (dimension) => {
       </template>
     </UAlert>
     <div v-if="!submitSuccess">
-      <p class="text-2xl text-pumpkin-500 font-bold mb-5">REPORTA DESAFIOS DE LA JUVENTUD</p>
+      <p class="text-2xl text-pumpkin-500 font-bold mb-5 uppercase">Quiero reportar desafíos y propuestas de la juventud</p>
       <UForm :state="state" :schema="schema" class="space-y-4" @submit="handleSubmit">
         <!-- <UFormGroup class="" label="Linea temática" name="dimensionId" required>
           <USelect v-model.number="state.dimensionId" :options="dimensions" value-attribute="id" option-attribute="name" :disabled="submitLoading"/>
@@ -179,23 +179,20 @@ const selectDimension = (dimension) => {
         </UFormGroup>
         <UFormGroup class="" label="Necesidades y desafíos" name="needsAndChallenges" required>
           <template #description>
-            Comparte tu necesidad y/o desafio <i class="text-pumpkin">Max. 500 caracteres.</i>
+            Comparte el desafio de la juventud en tu territorio <i class="text-pumpkin">(Máximo 500 caracteres)</i>
           </template>
           <UTextarea v-model="state.needsAndChallenges"  :disabled="submitLoading" />
         </UFormGroup>
         <UFormGroup class="" label="Propuesta" name="proposal" required>
           <template #description>
-            ¿Tienes alguna propuesta frente a esta situación? <i class="text-pumpkin">Max. 500 caracteres.</i>
+            ¿Tienes alguna propuesta frente a esta situación? <i class="text-pumpkin">(Máximo 500 caracteres)</i>
           </template>
           <template #help>
             <span v-if="state.proposal" class="text-xs">Caracteres: {{ state.proposal.length }}</span>
           </template>
           <UTextarea v-model="state.proposal" placeholder="Ingresá tu propuesta aquí"  :disabled="submitLoading"/>
         </UFormGroup>
-        <UFormGroup class="" label="En pocas palabras" name="inWords" required>
-          <template #description>
-            ¿Cómo describirías tu propuesta en pocas palabras?
-          </template>
+        <UFormGroup class="" label="En máximo dos palabras ¿Cómo resumirias el desafio que enfrenta la juventud?" name="inWords" required>
           <UInput v-model="state.inWords" :disabled="submitLoading" />
         </UFormGroup>
         <UFormGroup class="flex items-center" name="acceptsTerms" required>
@@ -206,7 +203,7 @@ const selectDimension = (dimension) => {
           </UCheckbox>
         </UFormGroup>
         <UDivider />
-        <UButton color="pumpkin" block size="xl" type="submit" :loading="submitLoading">Enviar</UButton>
+        <UButton color="pumpkin" block size="xl" type="submit" :loading="submitLoading">Reportar</UButton>
       </UForm>
     </div>
     <div v-else class="text-center">

diff --git a/components/iniciativas/Form.vue b/components/iniciativas/Form.vue
@@ -187,7 +187,7 @@ const handleSubmitInitiativeForm = async () => {
       <div v-if="showInitiativeForm">
         <UDivider size="lg" class="my-8" label="Paso 2. Datos de la iniciativa" />
         <UForm :state="initiativeState" :schema="initiativeSchema" class="space-y-4" @submit="handleSubmitInitiativeForm">
-          <UFormGroup name="dimensionIds" label="Ejes tematicos de la iniciativa" required>
+          <UFormGroup name="dimensionIds" label="Ejes tematicos de la iniciativa" description="Sabemos que algunas iniciativas trabajan diferentes temáticas, para este mapeo selecciona máximo 2." required>
             <div class="flex flex-wrap gap-2 pt-1">
               <UBadge 
               v-for="dimension in dimensions"
@@ -212,13 +212,13 @@ const handleSubmitInitiativeForm = async () => {
           </UFormGroup>
           <UFormGroup name="description" label="Descripción" required>
             <template #description>
-              Describe de forma breve tu iniciativa. <i class="text-pumpkin">Max. 500 caracteres.</i>
+              Describe de forma breve tu iniciativa. <i class="text-pumpkin">(Máximo 500 caracteres)</i>
             </template>
             <UTextarea v-model="initiativeState.description" />
           </UFormGroup>
           <UFormGroup name="needsAndOffers" label="Necesidades y ofertas" required>
             <template #description>
-              ¿Qué necesidades y/o oportunidades tiene tu iniciativa para ofrecer? <i class="text-pumpkin">Max. 500 caracteres.</i>
+              ¿Qué podría ofrecer o compartir la red a mi iniciativa? <i class="text-pumpkin">(Máximo 500 caracteres)</i>
             </template>
             <UTextarea v-model="initiativeState.needsAndOffers" />
           </UFormGroup>

diff --git a/pages/desafios.vue b/pages/desafios.vue
@@ -38,7 +38,7 @@ const showDesafiosForm = ref(false)
     </div>
     <div class="my-10 w-full md:w-2/3 mx-auto">
       <p class="font-center text-xl leading-tight mb-5 text-center">Recuerda que los datos tienen poder y en la medida que nos compartas más reportes, esta información podrá seguir movilizandose para que llegue a los tomadores de decisión de tu ciudad</p>
-      <UButton color="pumpkin" block size="xl" class="text-center text-xl sm:text-2x lg:text-3xl font-weight font-inter font-black rounded-full" @click="showDesafiosForm = true">Quiero reportar desafios de la juventud</UButton>
+      <UButton color="pumpkin" block size="xl" class="text-center text-xl sm:text-2x lg:text-3xl font-weight font-inter font-black rounded-full" @click="showDesafiosForm = true">Quiero reportar desafíos y propuestas de la juventud</UButton>
       <!-- <UButton color="pumpkin" block size="xl" class="text-center text-3xl font-weight font-inter font-black rounded-full">Quiero reportar desafios de la juventud</UButton> -->
     </div>
     <div class="my-10 w-full md:w-2/3 mx-auto" v-if="showDesafiosForm">

diff --git a/pages/iniciativas.vue b/pages/iniciativas.vue
@@ -33,7 +33,7 @@ const canUserCompleteForm = computed(() => {
       <div class="flex gap-5 justify-between items-center my-10 flex-col md:flex-row">
         <div class="w-full lg:w-1/2 text-center">
           <p class="font-oswald text-5xl  leading-tight text-mindaro mb-5">¿QUIERES UNIRTE Y SER UN AGENTE DE CAMBIO?</p>
-          <p class="font-bold text-xl leading-tight mb-5">¿Tienes una iniciativa o parche o movimiento o proyecto que se enmarca en las líneas temáticas de esta feria de causas?</p>
+          <p class="font-bold text-xl leading-tight mb-5">¿Tienes una iniciativa, parche y/o movimiento, proyecto que se enmarca en las líneas temáticas de esta feria de causas?</p>
           <UButton color="pumpkin" block size="xl" class="text-center text-3xl font-weight font-inter font-black rounded-full" @click="handleShowForm">¡Súmate!</UButton>
         </div>
         <div class="w-full lg:w-1/2">
@@ -64,7 +64,7 @@ const canUserCompleteForm = computed(() => {
           >
           <div>
             <p class="text-bold">Educación de calidad</p>
-            <p class="text-sm">Porque merecemos aprender sin límites</p>
+            <p class="text-sm">Merecemos aprender sin límites</p>
           </div>
         </div>
         <div