From 25f3b60abe8c70762e700bfc581fadad2f3cb0b7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mar=C3=ADa?= <mherrezuelo94@hotmail.com>
Date: Fri, 12 Sep 2025 21:46:39 +0200
Subject: [PATCH] editar productos

---
 components/ProductForm.vue       | 32 +++++++++++++++-----------------
 pages/editar/productos/[id].vue  |  7 ++++---
 pages/editar/productos/crear.vue |  6 +++---
 3 files changed, 22 insertions(+), 23 deletions(-)

diff --git a/components/ProductForm.vue b/components/ProductForm.vue
index cc6efcd..979e09c 100644
--- a/components/ProductForm.vue
+++ b/components/ProductForm.vue
@@ -13,13 +13,13 @@
       </BFormCheckbox>
     </div>
     <br />
-    <FormHeader title="General" />
-    <p class="help-text">
-      Estos son los datos básicos de un producto. Procura completar el mayor
+    <FormHeader 
+      title="General" 
+      subtitle="Estos son los datos básicos de un producto. Procura completar el mayor
       número de campos posible. Los campos señalados con asterisco (*) son
       obligatorios, los demás son opcionales. Si el producto o servicio no tiene
-      precio asignado, aparecerá "Consultar precio".
-    </p>
+      precio asignado, aparecerá 'Consultar precio'."
+    />
     <fieldset class="fieldset">
       <div class="cont">
         <FormInput
@@ -109,12 +109,11 @@
       </div>
     </fieldset>
     <fieldset class="fieldset">
-      <FormHeader title="Categorías" />
-      <p class="help-text">
-        Estos datos ayudan a que tu producto sea encontrado por los clientes.
+      <FormHeader 
+        title="Categorías" 
+        subtitle="Estos datos ayudan a que tu producto sea encontrado por los clientes.
         Procura completar el mayor número de campos posibles. Los campos
-        señalados con asterisco (*) son obligatorios, los demás son opcionales.
-      </p>
+        señalados con asterisco (*) son obligatorios, los demás son opcionales."/>
 
       <div class="cont-col">
         <label for="category">Categoría*</label>
@@ -312,10 +311,10 @@ export default {
   }
 
   label, .label {
-    text-align: left;
-    color: $color-navy;
-    font-weight: $bold;
-    font-size: $xs;
+    color: $color-primary;
+    font-weight: $medium;
+    font-size: $s;
+    display: block;
   }
 
   .textarea {
@@ -356,12 +355,11 @@ export default {
 }
 .help-text {
   text-align: left;
-  font-size: $xs;
+  font-size: $s;
   text-align: justify;
   font-weight: $regular;
-  color: $color-greylayout;
+  color: $color-primary;
   font-family: $font-secondary;
-  background-color: $color-light;
   margin-bottom: 20px;
   margin-top: 6px;
 
diff --git a/pages/editar/productos/[id].vue b/pages/editar/productos/[id].vue
index 54d031e..16b4283 100644
--- a/pages/editar/productos/[id].vue
+++ b/pages/editar/productos/[id].vue
@@ -131,10 +131,11 @@ export default {
   align-items: center;
 }
 .title {
-  color: $color-navy;
-  font-size: $xxl;
-  margin-bottom: 60px;
   width: 60%;
+  font-size: $h2;
+  color: $color-primary;
+  margin-bottom: 10px;
+  text-align: left;
 }
 .help-text {
   border: 1px solid $color-greylayout;
diff --git a/pages/editar/productos/crear.vue b/pages/editar/productos/crear.vue
index 392e7a1..9978d55 100644
--- a/pages/editar/productos/crear.vue
+++ b/pages/editar/productos/crear.vue
@@ -74,9 +74,9 @@ export default {
   align-items: center;
 }
 .title {
-  color: $color-navy;
-  font-size: $xxl;
-  margin-bottom: 60px;
+  font-size: $h2;
+  color: $color-primary;
+  margin-bottom: 10px;
   text-align: left;
   @include desktop {
     width: 40%;