[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>
This commit is contained in:
FrankZamora
2025-11-06 19:30:17 -06:00
parent 714b5d8b10
commit 41b1220249
3 changed files with 31 additions and 0 deletions

View File

@@ -165,6 +165,10 @@ body {
}
*/
/*
* BOTÓN LET'S TALK CSS MOVIDO A: assets/css/style.css (líneas 766-785)
* Comentado para evitar duplicación según Issue #101
*
.btn-lets-talk {
background-color: var(--color-orange-primary);
color: #ffffff;
@@ -183,6 +187,7 @@ body {
.btn-lets-talk i {
color: #ffffff;
}
*/
/* ========================================
HERO SECTION

View File

@@ -762,3 +762,24 @@ img {
background-color: rgba(255, 133, 0, 0.1);
color: var(--color-orange-primary);
}
/* === BOTÓN LET'S TALK === */
.btn-lets-talk {
background-color: var(--color-orange-primary);
color: #ffffff;
font-weight: 600;
padding: 0.5rem 1.5rem;
border: none;
border-radius: 6px;
transition: all 0.3s ease;
}
.btn-lets-talk:hover {
background-color: var(--color-orange-hover);
color: #ffffff;
}
.btn-lets-talk i {
color: #ffffff;
}

View File

@@ -99,6 +99,10 @@ add_action('wp_enqueue_scripts', 'apus_enqueue_main_stylesheet', 5);
*/
function apus_enqueue_fase2_styles() {
// Buttons CSS - Let's Talk button (Issue #58)
// DESHABILITADO: CSS movido a assets/css/style.css (líneas 766-785)
// buttons.css tenía implementación incorrecta (gradiente en lugar de sólido)
// Ver Issue #101
/*
wp_enqueue_style(
'apus-buttons',
get_template_directory_uri() . '/assets/css/buttons.css',
@@ -106,6 +110,7 @@ function apus_enqueue_fase2_styles() {
filemtime(get_template_directory() . '/assets/css/buttons.css'),
'all'
);
*/
// Hero Section CSS - Gradiente azul (Issue #59)
wp_enqueue_style(