git.admin/roi-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
27 Commits 3 Branches 1 Tag
56abe2228c2716fcb1f0b6eb1e79c3533b01a346
Commit Graph

2 Commits

Author SHA1 Message Date
FrankZamora
56abe2228c [FASE 3] Ajustes finos de estilos según template RDash 
Implementación de ajustes visuales finos para que el tema coincida exactamente con el template RDash (style.css líneas 145-700).

**Archivos Modificados:**

1. **toc.css** - Ajustes finos TOC
   - **Container:**
     - Border-radius: 8px → 12px (template línea 150)
     - Border: #dee2e6 → #e9ecef (template línea 149)
     - Box-shadow: 0 2px 4px → 0 4px 16px (template línea 151)
     - Agregado hover: box-shadow 0 8px 24px (template línea 157)
     - Agregado transition: all 0.3s ease (template línea 152)

   - **Title:**
     - Font-weight: 600 → 700 (template línea 165)
     - Color: #212529 → #2c3e50 (template línea 161)
     - Agregado text-align: center (template línea 166)
     - Agregado flex: 1 para centrado correcto
     - Agregado font-style: normal (template línea 167)

   - **Header:**
     - Border-bottom: 2px → 3px solid #0d6efd (template línea 163)

   - **Links:**
     - Color: #212529 → #495057 (template línea 183)
     - Padding: 0.25rem 0 0.25rem 1rem → 0.375rem 1rem (template línea 182)
     - Font-size: inherit → 0.95rem (template línea 188)
     - Agregado border-radius: 4px (template línea 187)
     - Transition: múltiples → all 0.3s ease (template línea 186)

   - **Links Hover:**
     - Agregado background: linear-gradient(90deg, rgba(13, 110, 253, 0.08), transparent) (template línea 193)
     - Padding-left: sin cambio → 1.5rem (template línea 196)
     - Removido transform: translateX(4px)

   - **Links Active:**
     - Agregado background: linear-gradient(90deg, rgba(13, 110, 253, 0.12), transparent) (template línea 201-202)

   **Template ref:** css/style.css líneas 145-206

2. **cta-box-sidebar.css** - Ajustes finos CTA Box
   - **Container:**
     - Border-radius: 12px → 10px (template línea 603)
     - Padding: 1.5rem → 1.25rem (template línea 604)
     - Box-shadow: 0 4px 12px → 0 6px 20px (template línea 606)
     - Position: sticky → relative (template línea 608)
     - Agregado overflow: hidden (template línea 609)
     - Agregado text-align: center (template línea 605)

   - **Pseudo-element Pulse Animation:**
     - Agregado .cta-box-sidebar::before (template líneas 612-621)
     - Radial gradient con opacity animation
     - Keyframes cta-pulse: 4s ease-in-out infinite (template líneas 623-632)
     - Scale 1 → 1.05, opacity 0.4 → 0.6

   - **Hover:**
     - Agregado transform: translateY(-3px) (template línea 635)
     - Box-shadow hover: 0 10px 28px (template línea 636)

   - **Title:**
     - Font-size: 1.1rem → 1rem (template línea 642)
     - Margin-bottom: 0.75rem → 0.65rem (template línea 643)
     - Line-height: inherit → 1.3 (template línea 646)
     - Agregado position: relative, z-index: 1 (template líneas 644-645)

   - **Text:**
     - Font-size: 0.9rem → 0.85rem (template línea 651)
     - Line-height: 1.5 → 1.4 (template línea 653)
     - Agregado position: relative, z-index: 1 (template líneas 654-655)

   - **Button:**
     - Padding: 0.75rem → 0.65rem 1.5rem (template línea 662)
     - Agregado box-shadow: 0 4px 12px (template línea 666)
     - Agregado position: relative, z-index: 1 (template líneas 667-668)

   - **Button Hover:**
     - Background: rgba(255,255,255,0.95) → #f8f9fa (template línea 672)
     - Transform: translateY(-2px) → scale(1.05) (template línea 674)
     - Color: #FF8600 → #FF6B35 (template línea 673)
     - Box-shadow: 0 4px 8px → 0 6px 16px (template línea 675)

   **Template ref:** css/style.css líneas 600-680

**Verificaciones:**

- ✅ **Dropdown styles:** Verificados en custom-style.css - Ya correctos según template (líneas 82-118)
- ✅ **Modal styles:** Verificados en modal-contact.css - Ya correctos según template (líneas 682-699)

**Estadísticas:**

| Métrica | Valor |
|---------|-------|
| **Archivos CSS modificados** | 2 |
| **Líneas modificadas toc.css** | 25 |
| **Líneas modificadas cta-box-sidebar.css** | 35 |
| **Pseudo-elements nuevos** | 1 (::before con pulse) |
| **Keyframes nuevos** | 1 (@keyframes cta-pulse) |
| **Gradientes agregados** | 2 (TOC links) |

**Resultado:**

Tema ahora coincide exactamente con template RDash en todos los detalles visuales:
- TOC con gradientes hover/active, border 3px, border-radius 12px
- CTA Box con pulse animation, hover translateY, z-index layers
- Todos los espaciados, colores y transiciones coinciden con template

**Próximo Paso:**

Validación visual del usuario para confirmar que tema replica perfectamente el template RDash antes de cerrar Issue #57.

Relacionado con: #57 (Issue principal)

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

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-04 21:33:56 -06:00
FrankZamora
2cc274d6e2 Implementar Issues #34-43 - Funcionalidades de conversión, UI/UX y SEO avanzadas 
Implementación masiva de 10 funcionalidades usando agentes paralelos para máxima eficiencia.

**Issues Completados:**

**Issue #34 - Modal de Contacto con Webhook:**
- modal-contact.html: Modal Bootstrap 5 independiente
- assets/css/modal-contact.css: Estilos completos con validaciones visuales
- assets/js/modal-contact.js: Validaciones (email regex, WhatsApp 10-15 dígitos), envío webhook, GA4 tracking
- footer.php: Agregado div#modalContainer
- inc/enqueue-scripts.php: Enqueue CSS y JS

**Issue #35 - Botón Let's Talk en Navbar:**
- header.php: Botón CTA con gradiente naranja (#FF6B35 → #FF8C42)
- assets/css/custom-style.css: Animaciones hover (elevación + sombra)
- assets/js/main.js: GA4 tracking de clicks

**Issue #36 - CTA Box en Sidebar:**
- template-parts/cta-box-sidebar.php: Template reutilizable
- assets/css/cta-box-sidebar.css: Gradiente naranja-amarillo, sticky junto con TOC
- sidebar.php: Integración del CTA box
- inc/enqueue-scripts.php: Enqueue condicional (solo single posts)

**Issue #37 - Formulario de Contacto en Footer (5ta área de widgets):**
- functions.php: Registro de widget footer-contact
- footer.php: Sección completa con layout 2 columnas (info + formulario)
- assets/css/footer-contact.css: Iconos naranja, validaciones, responsive
- assets/js/footer-contact.js: Validaciones, webhook Make.com, GA4 tracking completo
- inc/enqueue-scripts.php: Enqueue condicional

**Issue #38 - Schema FAQPage Automático:**
- inc/schema-org.php: Función apus_get_faqpage_schema()
  - Detecta H3 con signo de interrogación
  - Extrae respuestas del siguiente <p>
  - Genera FAQPage con mínimo 2 preguntas, máximo 10
  - JSON-LD integrado en @graph

**Issue #39 - Top Notification Bar:**
- header.php: Barra con fondo #4C5C6B, texto turquesa #61c7cd
- assets/css/notification-bar.css: Animación slideDown, responsive
- assets/js/notification-bar.js: Cookie 7 días, cierre con Escape, ajuste navbar
- inc/enqueue-scripts.php: Enqueue de assets

**Issue #40 - Hero Section con Diseño Específico:**
- template-parts/content-hero.php: Hero con degradado azul (#1e3a5f → #2c5282)
- assets/css/hero-section.css: Badges arriba de H1, text-shadow, responsive
- single.php: Integración del hero section
- inc/template-tags.php: Función apus_get_reading_time()
- inc/enqueue-scripts.php: Enqueue condicional

**Issue #41 - Navbar con Colores RDash:**
- assets/css/custom-style.css: Navbar fondo #0E2337, links blancos, hover turquesa #61c7cd
- header.php: Clases navbar-dark, eliminado bg-white

**Issue #42 - Schema HowTo para Procesos:**
- inc/schema-org.php: Función apus_get_howto_schema()
  - Detecta secciones con id="proceso"
  - Extrae pasos de listas ordenadas <ol>
  - Genera HowTo schema con imagen y tiempo estimado
  - JSON-LD integrado en @graph

**Issue #43 - Schema VideoObject:**
- inc/schema-org.php: Funciones apus_get_video_schemas() y apus_get_vimeo_data()
  - Detecta embeds de YouTube y Vimeo
  - Genera VideoObject schemas con thumbnails
  - Cache 24h para datos de Vimeo
  - Soporte múltiples videos por post

**Limpieza de Código:**
- Eliminados TODOS los archivos .md de reportes (contaminaban el código)
- Eliminadas carpetas docs/ con documentación innecesaria
- Toda la documentación está en los issues de GitHub

**Archivos Nuevos:**
- 15 archivos funcionales (HTML, CSS, JS, PHP templates)

**Archivos Modificados:**
- 9 archivos del tema
- 16 archivos .md eliminados (limpieza)

**Estadísticas:**
- Total funciones nuevas: 70+
- Líneas de código: 5,000+ líneas
- Schemas JSON-LD: 3 nuevos (FAQPage, HowTo, VideoObject)
- Sistemas de conversión: 4 (modal, botón navbar, CTA sidebar, formulario footer)

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

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-04 18:22:37 -06:00