Files
apps-registry/workloads/ecommerce
devopsandClaude Opus 5.5 e6f031a366 feat(storefront): barra de navegación desktop con categorías, personajes, ayuda y ubicación
- Desktop xl+: las 6 categorías raíz directo en la barra con desplegable
  de subcategorías; lg-xl mantiene "Departamentos"; "Personajes"
  (colecciones) y "Ayuda" a la derecha; hamburguesa solo en mobile.
- "Enviar a <nombre> · <ciudad>" (location-store persistido) que precarga
  departamento/ciudad en el checkout; "Hola X / Mi cuenta" y "Cambios y
  devoluciones" en xl+.
- Header compacto al hacer scroll en lg+ (histéresis 160/40px).
- Fix de menús (también en DepartmentsMegaMenu, ya presente en prod): el
  click de mouse ya no cierra el menú recién abierto por hover
  (keepOpenAfterHover) y el hover solo reacciona a pointerType "mouse",
  así el mouseleave sintético de touch no autocierra en tablets.

Revisado por el subagente frontend-critic (3 hallazgos, todos corregidos y
re-verificados) + Playwright contra build de producción local: sin solapes
a 1024/1280/1440/1920, click real, touch, mobile 390/320 sin cambios.

Co-Authored-By: Claude Opus 5.5 <[email protected]>
Claude-Session: https://claude.ai/code/session_018r19s4H8MBGegqToqw5guP
2026-09-27 05:22:21 +00:00
..
2026-07-24 06:40:21 +00:00
2026-07-31 23:27:01 -05:00

ARI Shopping Headless Storefront v4.1

Actualización enfocada en UX, interactividad y rendimiento sobre Next.js 15.5.10.

Correcciones principales

  • Encabezado blanco premium con acentos cyan, violeta, fucsia y navegación negra.
  • Imágenes promocionales sin opacity, mix-blend ni filtros de color.
  • Menú principal funcional mediante Drawer accesible de Radix UI.
  • Cuenta y favoritos funcionales.
  • Carrusel con flechas, teclado, scroll suave y scroll-snap.
  • Zoom real de producto entre 100% y 300%, rueda, botones, doble clic y arrastre.
  • Thumbnails WebP dedicados para tarjetas, búsqueda, carrito y favoritos.
  • Recursos originales recomprimidos y caché HTTP para /images.
  • next/image en modo unoptimized porque los recursos ya vienen procesados; evita latencia del optimizador durante la primera visita.
  • Menos componentes animados con JavaScript; las tarjetas usan transiciones CSS.
  • content-visibility para contenido fuera de pantalla.
  • Pantalla loading.tsx para transiciones de ruta.

Validación

npm ci
npm run typecheck
npm run build

Flujo

Gitea → Gitea Actions → Registry → actualización de frontend.yaml → Argo CD → Kubernetes.