0846a3bf03
- Reorganización de estructura: Admin/, Public/, Shared/, Schemas/ - 12 componentes migrados: TopNotificationBar, Navbar, CtaLetsTalk, Hero, FeaturedImage, TableOfContents, CtaBoxSidebar, SocialShare, CtaPost, RelatedPost, ContactForm, Footer - Panel de administración con tabs Bootstrap 5 funcionales - Schemas JSON para configuración de componentes - Renderers dinámicos con CSSGeneratorService (cero CSS hardcodeado) - FormBuilders para UI admin con Design System consistente - Fix: Bootstrap JS cargado en header para tabs funcionales - Fix: buildTextInput maneja valores mixed (bool/string) - Eliminación de estructura legacy (src/, admin/, assets/css/componente-*) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
144 lines
4.3 KiB
JSON
144 lines
4.3 KiB
JSON
{
|
|
"component_name": "featured-image",
|
|
"version": "1.0.0",
|
|
"description": "Imagen destacada del post con estilos configurables",
|
|
"groups": {
|
|
"visibility": {
|
|
"label": "Visibilidad",
|
|
"priority": 10,
|
|
"fields": {
|
|
"is_enabled": {
|
|
"type": "boolean",
|
|
"label": "Mostrar imagen destacada",
|
|
"default": true,
|
|
"editable": true,
|
|
"required": true,
|
|
"description": "Activa o desactiva la imagen destacada en posts"
|
|
},
|
|
"show_on_desktop": {
|
|
"type": "boolean",
|
|
"label": "Mostrar en desktop",
|
|
"default": true,
|
|
"editable": true,
|
|
"required": true,
|
|
"description": "Muestra la imagen en dispositivos desktop (>=768px)"
|
|
},
|
|
"show_on_mobile": {
|
|
"type": "boolean",
|
|
"label": "Mostrar en mobile",
|
|
"default": true,
|
|
"editable": true,
|
|
"required": true,
|
|
"description": "Muestra la imagen en dispositivos moviles (<768px)"
|
|
},
|
|
"show_on_pages": {
|
|
"type": "select",
|
|
"label": "Mostrar en",
|
|
"default": "posts",
|
|
"editable": true,
|
|
"required": true,
|
|
"options": {
|
|
"all": "Todas las paginas",
|
|
"posts": "Solo posts individuales",
|
|
"pages": "Solo paginas"
|
|
},
|
|
"description": "Define en que tipo de contenido se muestra la imagen"
|
|
}
|
|
}
|
|
},
|
|
"content": {
|
|
"label": "Contenido",
|
|
"priority": 20,
|
|
"fields": {
|
|
"image_size": {
|
|
"type": "select",
|
|
"label": "Tamano de imagen",
|
|
"default": "roi-featured-large",
|
|
"editable": true,
|
|
"options": {
|
|
"roi-featured-large": "Grande (1200x600)",
|
|
"roi-featured-medium": "Mediano (800x400)",
|
|
"full": "Original (tamano completo)"
|
|
},
|
|
"description": "Tamano de imagen de WordPress a utilizar"
|
|
},
|
|
"lazy_loading": {
|
|
"type": "boolean",
|
|
"label": "Carga diferida (lazy loading)",
|
|
"default": true,
|
|
"editable": true,
|
|
"description": "Mejora rendimiento cargando imagen cuando es visible"
|
|
},
|
|
"link_to_media": {
|
|
"type": "boolean",
|
|
"label": "Enlazar a imagen completa",
|
|
"default": false,
|
|
"editable": true,
|
|
"description": "Abre la imagen en tamano completo al hacer clic"
|
|
}
|
|
}
|
|
},
|
|
"spacing": {
|
|
"label": "Espaciado",
|
|
"priority": 30,
|
|
"fields": {
|
|
"margin_top": {
|
|
"type": "text",
|
|
"label": "Margen superior",
|
|
"default": "1rem",
|
|
"editable": true,
|
|
"description": "Espacio arriba del contenedor (ej: 1rem, 16px)"
|
|
},
|
|
"margin_bottom": {
|
|
"type": "text",
|
|
"label": "Margen inferior",
|
|
"default": "2rem",
|
|
"editable": true,
|
|
"description": "Espacio debajo del contenedor (ej: 2rem, 32px)"
|
|
}
|
|
}
|
|
},
|
|
"visual_effects": {
|
|
"label": "Efectos Visuales",
|
|
"priority": 40,
|
|
"fields": {
|
|
"border_radius": {
|
|
"type": "text",
|
|
"label": "Radio de bordes",
|
|
"default": "12px",
|
|
"editable": true,
|
|
"description": "Redondeo de esquinas del contenedor (ej: 12px, 0.75rem)"
|
|
},
|
|
"box_shadow": {
|
|
"type": "text",
|
|
"label": "Sombra",
|
|
"default": "0 8px 24px rgba(0, 0, 0, 0.1)",
|
|
"editable": true,
|
|
"description": "Sombra CSS del contenedor"
|
|
},
|
|
"hover_effect": {
|
|
"type": "boolean",
|
|
"label": "Efecto hover",
|
|
"default": true,
|
|
"editable": true,
|
|
"description": "Aplica efecto de escala sutil al pasar el mouse"
|
|
},
|
|
"hover_scale": {
|
|
"type": "text",
|
|
"label": "Escala en hover",
|
|
"default": "1.02",
|
|
"editable": true,
|
|
"description": "Factor de escala en hover (ej: 1.02 = 2% mas grande)"
|
|
},
|
|
"transition_duration": {
|
|
"type": "text",
|
|
"label": "Duracion de transicion",
|
|
"default": "0.3s",
|
|
"editable": true,
|
|
"description": "Duracion de animaciones (ej: 0.3s, 300ms)"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|