Refactor: Simplificar SelectorFamilia y agregar iconos contextuales
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 1m7s

- Eliminar títulos de secciones para interfaz más limpia
  - Quitar "Categorías (selección múltiple)"
  - Quitar "Subcategorías (selección múltiple)"
  - Quitar "Nota Específica"

- Implementar iconos contextuales para marcar selecciones
  - Fragancia/Aroma: i-lucide-wind (viento/aroma)
  - Sabor: i-lucide-ice-cream-cone (comida/sabor)
  - Aplicar tanto en categorías como subcategorías
  - Reemplazar check genérico por iconos específicos según tipo

- Interfaz más intuitiva con iconos semánticos
This commit is contained in:
2025-10-19 01:40:06 -06:00
parent 7ba16e99bf
commit fe24b3e724

View File

@@ -8,7 +8,6 @@
<!-- Nivel 1: Categorías principales (selección múltiple) --> <!-- Nivel 1: Categorías principales (selección múltiple) -->
<div class="nivel-container"> <div class="nivel-container">
<h4 class="nivel-title cata-text">Categorías (selección múltiple)</h4>
<div class="categorias-grid"> <div class="categorias-grid">
<button <button
v-for="categoria in categoriasDisponibles" v-for="categoria in categoriasDisponibles"
@@ -35,7 +34,7 @@
</div> </div>
<UIcon <UIcon
v-if="modelValue.categorias.includes(categoria)" v-if="modelValue.categorias.includes(categoria)"
name="i-lucide-check-circle" :name="tipo === 'fragancia-aroma' ? 'i-lucide-wind' : 'i-lucide-ice-cream-cone'"
class="categoria-check" class="categoria-check"
/> />
</button> </button>
@@ -44,7 +43,6 @@
<!-- Nivel 2: Subcategorías (unión de todas las categorías seleccionadas, selección múltiple) --> <!-- Nivel 2: Subcategorías (unión de todas las categorías seleccionadas, selección múltiple) -->
<div v-if="subcategoriasDisponibles.length > 0" class="nivel-container mt-4"> <div v-if="subcategoriasDisponibles.length > 0" class="nivel-container mt-4">
<h4 class="nivel-title cata-text">Subcategorías (selección múltiple)</h4>
<div class="subcategorias-grid"> <div class="subcategorias-grid">
<button <button
v-for="subcategoria in subcategoriasDisponibles" v-for="subcategoria in subcategoriasDisponibles"
@@ -64,7 +62,7 @@
<span class="subcategoria-text cata-text">{{ subcategoria }}</span> <span class="subcategoria-text cata-text">{{ subcategoria }}</span>
<UIcon <UIcon
v-if="modelValue.subcategorias.includes(subcategoria)" v-if="modelValue.subcategorias.includes(subcategoria)"
name="i-lucide-check" :name="tipo === 'fragancia-aroma' ? 'i-lucide-wind' : 'i-lucide-ice-cream-cone'"
class="subcategoria-check" class="subcategoria-check"
/> />
</button> </button>
@@ -73,7 +71,6 @@
<!-- Nivel 3: Nota específica (input libre) --> <!-- Nivel 3: Nota específica (input libre) -->
<div v-if="modelValue.categorias.length > 0" class="nivel-container mt-4"> <div v-if="modelValue.categorias.length > 0" class="nivel-container mt-4">
<h4 class="nivel-title cata-text">Nota Específica</h4>
<input <input
v-model="notaEspecificaLocal" v-model="notaEspecificaLocal"
type="text" type="text"