3 Commits

Author SHA1 Message Date
mono
a89af0f0bb #fix: búsqueda insensible a tildes en el catálogo
Normaliza los strings eliminando diacríticos (NFD) antes de comparar,
para que 'cafe' encuentre 'café' y viceversa.
2026-07-03 19:06:40 -05:00
mono
b2a47c44dc #fix: scroll al inicio del grid al cambiar página en el catálogo
El método scrollToTop usaba scrollIntoView en un elemento sticky,
lo que no generaba desplazamiento. Ahora calcula la posición
absoluta del grid de productos y hace scroll suave.
2026-07-03 18:58:00 -05:00
mono
2c2082266e #fix: corregir solapamiento de imagen en tarjetas del catálogo
- Cambiar height: 100% por aspect-ratio: 1 en .product-image-container
- Eliminar media queries duplicados y obsoletos
- El contenedor ahora se ajusta al tamaño real del v-img
2026-07-03 18:52:33 -05:00
2 changed files with 10 additions and 165 deletions

View File

@@ -176,7 +176,6 @@ export default {
.product-image-container { .product-image-container {
position: relative; position: relative;
width: 100%; width: 100%;
height: 100%;
overflow: hidden; overflow: hidden;
background: linear-gradient(135deg, #fafafa 0%, #ffffff 100%); background: linear-gradient(135deg, #fafafa 0%, #ffffff 100%);
border-bottom: 1px solid rgba(0, 0, 0, 0.05); border-bottom: 1px solid rgba(0, 0, 0, 0.05);
@@ -336,143 +335,6 @@ export default {
/* Móvil estándar (375px - 559px) */ /* Móvil estándar (375px - 559px) */
@media (min-width: 375px) and (max-width: 559px) { @media (min-width: 375px) and (max-width: 559px) {
.product-name {
font-size: 0.95rem;
}
.price-value {
font-size: 1.05rem;
}
}
/* Tablet (560px - 959px) */
@media (min-width: 560px) and (max-width: 959px) {
.product-content {
padding: 14px;
}
.product-name {
font-size: 1rem;
min-height: 2.6rem;
}
.price-label {
font-size: 0.68rem;
}
.price-value {
font-size: 1.15rem;
}
.price-total-chip {
font-size: 0.95rem;
height: 28px;
}
.quantity-input {
max-width: 70px;
min-width: 70px;
}
}
/* Desktop (≥ 960px) */
@media (min-width: 960px) {
.product-content {
padding: 16px 14px;
}
.product-name {
font-size: 1.05rem;
min-height: 2.7rem;
}
.price-label {
font-size: 0.7rem;
}
.price-value {
font-size: 1.2rem;
}
.price-total-chip {
font-size: 1rem;
height: 30px;
padding: 0 14px;
}
.product-actions {
padding: 8px;
padding-bottom: 12px;
}
.quantity-input {
max-width: 70px;
min-width: 70px;
}
.qty-btn {
width: 36px;
height: 36px;
}
}
/* Desktop Large (≥ 1280px) */
@media (min-width: 1280px) {
.product-content {
padding: 18px 16px;
}
.product-name {
font-size: 1.1rem;
min-height: 2.8rem;
}
.price-value {
font-size: 1.25rem;
}
.price-total-chip {
font-size: 1.05rem;
height: 32px;
}
}
/* Desktop Extra Large (≥ 1920px) */
@media (min-width: 1920px) {
.product-name {
font-size: 1.15rem;
min-height: 3rem;
}
.price-value {
font-size: 1.3rem;
}
.product-content {
padding: 8px;
}
.product-name {
font-size: 0.8rem;
min-height: 1.9rem;
}
.price-value {
font-size: 0.85rem;
}
.quantity-input {
max-width: 50px;
min-width: 50px;
}
}
/* Móvil estándar (375px - 559px) */
@media (min-width: 375px) and (max-width: 559px) {
.product-image-container {
height: 140px;
}
.product-name { .product-name {
font-size: 0.85rem; font-size: 0.85rem;
} }
@@ -484,10 +346,6 @@ export default {
/* Tablet (560px - 959px) */ /* Tablet (560px - 959px) */
@media (min-width: 560px) and (max-width: 959px) { @media (min-width: 560px) and (max-width: 959px) {
.product-image-container {
height: 150px;
}
.product-content { .product-content {
padding: 10px; padding: 10px;
} }
@@ -518,10 +376,6 @@ export default {
/* Desktop (≥ 960px) */ /* Desktop (≥ 960px) */
@media (min-width: 960px) { @media (min-width: 960px) {
.product-image-container {
height: 160px;
}
.product-content { .product-content {
padding: 12px 10px; padding: 12px 10px;
} }
@@ -563,10 +417,6 @@ export default {
/* Desktop Large (≥ 1280px) */ /* Desktop Large (≥ 1280px) */
@media (min-width: 1280px) { @media (min-width: 1280px) {
.product-image-container {
height: 170px;
}
.product-content { .product-content {
padding: 14px 12px; padding: 14px 12px;
} }
@@ -588,10 +438,6 @@ export default {
/* Desktop Extra Large (≥ 1920px) */ /* Desktop Extra Large (≥ 1920px) */
@media (min-width: 1920px) { @media (min-width: 1920px) {
.product-image-container {
height: 180px;
}
.product-name { .product-name {
font-size: 1.05rem; font-size: 1.05rem;
min-height: 2.5rem; min-height: 2.5rem;

View File

@@ -342,9 +342,10 @@ export default {
// Búsqueda // Búsqueda
filteredItems() { filteredItems() {
if (!this.searchQuery) return this.items; if (!this.searchQuery) return this.items;
const query = this.searchQuery.toLowerCase(); const normalize = (s) => s.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, "");
const query = normalize(this.searchQuery);
return this.items.filter((item) => return this.items.filter((item) =>
item.name.toLowerCase().includes(query), normalize(item.name).includes(query),
); );
}, },
// Paginación // Paginación
@@ -541,15 +542,13 @@ export default {
} }
}, },
scrollToTop() { scrollToTop() {
this.$nextTick(() => { const grid = this.$el?.querySelector(".product-grid");
const catalogHeader = this.$el?.querySelector(".page-header"); if (grid) {
if (catalogHeader) { const top = grid.getBoundingClientRect().top + window.scrollY - 16;
catalogHeader.scrollIntoView({ window.scrollTo({ top, behavior: "smooth" });
behavior: "smooth", } else {
block: "start", window.scrollTo({ top: 0, behavior: "smooth" });
}); }
}
});
}, },
openLoginDialog() { openLoginDialog() {
this.$refs.loginDialogRef.open(); this.$refs.loginDialogRef.open();