Files
roi-theme/assets/css/componente-cta-box-sidebar.css
FrankZamora de5fff4f5c Fase 1: Estructura Base y DI Container - Clean Architecture
COMPLETADO: Fase 1 de la migración a Clean Architecture + POO

## Estructura de Carpetas
- ✓ Estructura completa de 4 capas (Domain, Application, Infrastructure, Presentation)
- ✓ Carpetas de Use Cases (SaveComponent, GetComponent, DeleteComponent, SyncSchema)
- ✓ Estructura de tests (Unit, Integration, E2E)
- ✓ Carpetas de schemas y templates

## Composer y Autoloading
- ✓ PSR-4 autoloading configurado para ROITheme namespace
- ✓ Autoloader optimizado regenerado

## DI Container
- ✓ DIContainer implementado con patrón Singleton
- ✓ Métodos set(), get(), has() para gestión de servicios
- ✓ Getters específicos para ComponentRepository, ValidationService, CacheService
- ✓ Placeholders que serán implementados en Fase 5
- ✓ Prevención de clonación y deserialización

## Interfaces
- ✓ ComponentRepositoryInterface (Domain)
- ✓ ValidationServiceInterface (Application)
- ✓ CacheServiceInterface (Application)
- ✓ Component entity placeholder (Domain)

## Bootstrap
- ✓ functions.php actualizado con carga de Composer autoloader
- ✓ Inicialización del DIContainer
- ✓ Helper function roi_container() disponible globalmente

## Tests
- ✓ 10 tests unitarios para DIContainer (100% cobertura)
- ✓ Total: 13 tests unitarios, 28 assertions
- ✓ Suite de tests pasando correctamente

## Validación
- ✓ Script de validación automatizado (48/48 checks pasados)
- ✓ 100% de validaciones exitosas

La arquitectura base está lista para la Fase 2.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-17 13:48:24 -06:00

94 lines
1.9 KiB
CSS

/**
* CTA Box Sidebar Styles
*
* Styles for the CTA box component that appears in the sidebar
* below the Table of Contents on single posts.
*
* @package ROI_Theme
* @since 1.0.0
*/
/* ========================================
CTA Box Container
======================================== */
.cta-box-sidebar {
background: var(--color-orange-primary);
border-radius: 8px;
padding: 24px;
text-align: center;
margin-top: 0;
margin-bottom: 15px;
height: 250px;
display: flex;
flex-direction: column;
justify-content: center;
box-shadow: 0 4px 12px rgba(255, 133, 0, 0.2);
}
/* ========================================
CTA Box Content
======================================== */
.cta-box-title {
color: #ffffff;
font-weight: 700;
font-size: 1.25rem;
margin-bottom: 1rem;
}
.cta-box-text {
color: rgba(255, 255, 255, 0.95);
font-size: 0.9rem;
margin-bottom: 1rem;
}
/* ========================================
CTA Button
======================================== */
.btn-cta-box {
background-color: #ffffff;
color: var(--color-orange-primary);
font-weight: 700;
border: none;
padding: 0.75rem 1.5rem;
border-radius: 8px;
transition: all 0.3s ease;
font-size: 1rem;
}
.btn-cta-box:hover {
background-color: var(--color-navy-primary);
color: #ffffff;
}
/* ========================================
Icon Spacing
======================================== */
.btn-cta-box i {
vertical-align: middle;
}
/* ========================================
Responsive Design
======================================== */
/* Hide on tablets and mobile */
@media (max-width: 991px) {
.cta-box-sidebar {
display: none; /* Ocultar en móviles */
}
}
/* ========================================
Print Styles
======================================== */
@media print {
.cta-box-sidebar {
display: none;
}
}