Commit Graph

5 Commits

Author SHA1 Message Date
FrankZamora
403b953b0a Corregir botón Let's Talk - Agregar !important para color naranja
Bootstrap sobrescribe CSS sin !important
Botón ahora se verá NARANJA como debe ser

Issue #101
2025-11-06 19:56:27 -06:00
FrankZamora
41b1220249 [COMPONENTE 07] Corregir CSS de Botón Let's Talk según template fuente
PROBLEMAS CORREGIDOS:
1. CSS duplicado en custom-style.css y buttons.css
2. buttons.css tenía implementación INCORRECTA:
   - Usaba gradiente en lugar de color sólido
   - Agregaba efectos de transform/shadow no presentes en template
   - Tenía media queries responsive no documentadas
3. CSS no estaba en ubicación documentada (style.css)

ANÁLISIS DE IMPLEMENTACIONES:

buttons.css (INCORRECTO - deshabilitado):
-  background: linear-gradient() - Template usa color sólido
-  transform: translateY(-2px) en hover - NO en template
-  box-shadow con valores no documentados
-  Estado :active no presente en template
-  Media query responsive no en template

custom-style.css (CORRECTO pero ubicación incorrecta):
-  background-color: var(--color-orange-primary) - Sólido
-  Hover a var(--color-orange-hover)
-  Sin transform ni shadow extra
-  IDÉNTICO al template fuente

SOLUCIÓN IMPLEMENTADA:

1. style.css:
   - Agregado CSS correcto al final (líneas 766-785)
   - Comentario separador: /* === BOTÓN LET'S TALK === */
   - CSS idéntico a template fuente

2. custom-style.css:
   - Comentado CSS duplicado (líneas 168-190)
   - Agregado nota de nueva ubicación

3. enqueue-scripts.php:
   - Comentado enqueue de buttons.css (líneas 101-113)
   - Agregado nota explicando por qué se deshabilitó

IMPLEMENTACIÓN COMPLETA:
 HTML: header.php (líneas 80-83) - SUPERIOR a template (i18n)
 CSS: assets/css/style.css (líneas 766-785) - IDÉNTICO a template
 buttons.css: DESHABILITADO (implementación incorrecta)

REFERENCIAS:
- Template HTML: apus-theme-template/index.html líneas 132-134
- Template CSS: apus-theme-template/css/style.css líneas 163-180
- Documentación: theme-documentation/07-componente-boton-lets-talk/

ISSUE: #101

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

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-06 19:30:17 -06:00
FrankZamora
714b5d8b10 [COMPONENTE 06] Reorganizar CSS de Navbar según documentación
PROBLEMA:
- CSS de Navbar estaba en custom-style.css (líneas 86-161)
- Documentación especifica que debe estar en assets/css/style.css
- Causaba inconsistencia con estructura modular del tema

SOLUCIÓN:
1. style.css:
   - Agregado CSS de Navbar completo al final (líneas 687-764)
   - Incluye: .navbar, .navbar.scrolled, .navbar-brand, .nav-link,
     .dropdown-menu, .dropdown-item
   - Comentario separador: /* === NAVBAR === */

2. custom-style.css:
   - Comentado CSS duplicado de Navbar (líneas 86-166)
   - Agregado comentario indicando nueva ubicación
   - Mantiene .btn-lets-talk y otros componentes

IMPLEMENTACIÓN COMPLETA:
 HTML: header.php (líneas 34-87) - SUPERIOR a template fuente
 CSS: assets/css/style.css (líneas 687-764) - IDÉNTICO a template
 JS: assets/js/main.js (líneas 4-14) - IDÉNTICO a template

REFERENCIAS:
- Template HTML: apus-theme-template/index.html líneas 74-137
- Template CSS: apus-theme-template/css/style.css líneas 86-162
- Template JS: apus-theme-template/js/main.js líneas 6-15
- Documentación: theme-documentation/06-componente-navbar/

ISSUE: #100

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

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-06 19:24:29 -06:00
FrankZamora
c1467b5c32 Corregir Top Notification Bar según template fuente real
PROBLEMA:
- Implementación previa NO coincidía con template fuente apus-theme-template/index.html
- HTML tenía estructura compleja con spans responsive e i18n
- CSS cargaba archivo separado notification-bar.css (253 líneas) con animaciones innecesarias
- Faltaban variables de color APU en style.css

SOLUCIÓN:
1. header.php (líneas 23-32):
   - Reemplazado HTML complejo con estructura simple del template
   - Eliminado texto responsive innecesario
   - Cambiado de múltiples <span> a un solo <span><strong>Nuevo:</strong> texto</span>
   - Agregado clases text-white y text-decoration-underline al enlace

2. assets/css/style.css:
   - Agregadas variables de color APU (líneas 49-55):
     --color-navy-dark, --color-navy-primary, --color-orange-primary, etc.
   - Agregado CSS de Top Notification Bar (líneas 658-685)
   - Solo 28 líneas de CSS limpio sin animaciones ni JavaScript

3. inc/enqueue-scripts.php:
   - Comentada función apus_enqueue_notification_bar_assets()
   - CSS ahora en style.css principal, no en archivo separado
   - Componente no requiere JavaScript

FUENTE DE VERDAD:
- apus-theme-template/index.html (líneas 55-63)
- apus-theme-template/css/style.css (líneas 57-80)

ISSUE: #97

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

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-06 18:41:08 -06:00
FrankZamora
071d562f15 [FASE 1] Reorganizar CSS según arquitectura modular - Issue #95
Cambios realizados:
- NUEVO: Crear assets/css/style.css con CSS base del tema (650 líneas)
- MODIFICADO: style.css - Dejar solo header obligatorio de WordPress (~25 líneas)
- MODIFICADO: enqueue-scripts.php - Agregar carga de assets/css/style.css

Detalles:
- Mover todo el CSS de style.css (variables, reset, typography, layouts)
  a assets/css/style.css para cumplir con arquitectura modular
- style.css ahora contiene SOLO el comentario header de WordPress
- Agregar función apus_enqueue_main_stylesheet() con filemtime()
  para cache busting
- Orden de carga: Bootstrap → Variables → style.css → componentes

Validación FASE 1 completada:
 style.css con header WordPress
 functions.php completo
 index.php con The Loop
 assets/css/style.css creado
 assets/js/main.js existe
 Arquitectura modular respetada

Referencia: _planeacion/_desarrollo-tema-apus/theme-documentation/03-fase-1-cimiento/

Closes #95

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

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