Arquitectura del tema

Resumen

Zenit sigue la arquitectura basada en secciones de Nuvemshop (referencia: tema Ipanema):

• Demos (theme/demos/demos.json) registran las verticales distribuidas; clothing es la base actual
• Templates JSON (theme/demos/<demo>/templates/pages/*.json) definen la composición inicial de cada página
• Secciones (theme/sections/*.tpl) renderizan unidades de ancho completo con {% schema %}
• Bloques (theme/blocks/*.tpl) son componentes dentro de las secciones
• Snippets (theme/snippets/*.tpl) son parciales sin schema (carrito, envío, variantes…)
• Layout (theme/layouts/layout.tpl) envuelve todo con encabezado/pie de página mediante {% layout_template %}

Documentación técnica completa en el repositorio: docs/ai/architecture.md.

Flujo de renderizado

theme/demos/clothing/templates/pages/<page>.json
  → theme/sections/<type>.tpl
    → theme/blocks/<type>.tpl
      → theme/snippets/...
theme/layouts/layout.tpl (header + main + footer)

Dónde personalizar

Objetivo	Dónde
Nueva sección reutilizable	theme/sections/ + preset en template JSON
Nuevo bloque genérico	theme/blocks/ con "tags": ["general"]
Lógica de carrito/variantes	theme/snippets/ + theme/static/js/store.js
Colores/tipografía globales	theme/config/settings_schema.json + theme/layouts/resources/style-tokens.tpl

Contratos que deben conservarse

• data-store en nodos canónicos (producto, carrito, cuenta)
• {{ block | block_attributes }} en cada bloque
• {{ component('nubesdk-slot', { type: ... }) }} en los anchors documentados

Consulta la lista completa en docs/ai/architecture.md § Contratos invariantes.