CRÍTICO: Eliminar TODAS las reglas .btn de theme.css

PROBLEMA ROOT CAUSE FINAL:
theme.css tenía MÚLTIPLES reglas sobrescribiendo Bootstrap:
- .btn y button (background-color global)
- .btn:focus, button:focus (box-shadow)
- .btn:disabled, button:disabled (opacity)
- .btn-secondary, .btn-success, .btn-danger, etc. (colores)
- .btn-sm, .btn-lg (tamaños)

TODAS estas reglas sobrescribían btn-outline de Bootstrap

SOLUCIÓN DEFINITIVA:
- ELIMINADAS todas las reglas globales .btn y button
- ELIMINADAS todas las variantes .btn-*
- ELIMINADOS tamaños .btn-sm y .btn-lg
- Mantener SOLO estilos para inputs SIN clases btn
- Bootstrap maneja TODO lo relacionado con botones

Archivos modificados:
- assets/css/theme.css (eliminadas ~80 líneas de CSS)

RESULTADO:
Bootstrap btn-outline-* funciona SIN interferencia

Fixes #124

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
FrankZamora
2025-11-07 12:08:09 -06:00
parent f3c2bbb3e7
commit 143298fc09
2 changed files with 15 additions and 88 deletions

View File

@@ -1051,9 +1051,7 @@ img {
color: #ffffff;
}
/* ========================================
SHARE BUTTONS
======================================== */
/* === SHARE BUTTONS === */
.share-buttons .btn {
transition: all 0.3s ease;

View File

@@ -347,99 +347,28 @@ input[type="reset"]:not([class*="btn"]):hover {
text-decoration: none;
}
button:focus,
.btn:focus,
input[type="button"]:focus,
input[type="submit"]:focus,
input[type="reset"]:focus {
input[type="button"]:not([class*="btn"]):focus,
input[type="submit"]:not([class*="btn"]):focus,
input[type="reset"]:not([class*="btn"]):focus {
outline: none;
box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.5);
}
button:disabled,
.btn:disabled,
input[type="button"]:disabled,
input[type="submit"]:disabled,
input[type="reset"]:disabled {
input[type="button"]:not([class*="btn"]):disabled,
input[type="submit"]:not([class*="btn"]):disabled,
input[type="reset"]:not([class*="btn"]):disabled {
opacity: 0.65;
cursor: not-allowed;
}
/* Button variants */
.btn-secondary {
background-color: var(--secondary-color);
color: var(--white);
}
.btn-secondary:hover {
background-color: #5a6268;
}
.btn-success {
background-color: var(--success-color);
color: var(--white);
}
.btn-success:hover {
background-color: #157347;
}
.btn-danger {
background-color: var(--danger-color);
color: var(--white);
}
.btn-danger:hover {
background-color: #bb2d3b;
}
.btn-warning {
background-color: var(--warning-color);
color: var(--gray-900);
}
.btn-warning:hover {
background-color: #ffbb33;
}
.btn-info {
background-color: var(--info-color);
color: var(--white);
}
.btn-info:hover {
background-color: #0aa8cc;
}
.btn-light {
background-color: var(--light-color);
color: var(--gray-900);
border-color: var(--gray-300);
}
.btn-light:hover {
background-color: #e2e6ea;
}
.btn-dark {
background-color: var(--dark-color);
color: var(--white);
}
.btn-dark:hover {
background-color: #1a1e21;
}
/* Button sizes */
.btn-sm {
padding: 0.25rem 0.5rem;
font-size: var(--font-size-sm);
}
.btn-lg {
padding: 0.75rem 1.5rem;
font-size: var(--font-size-lg);
}
/* Button variants
* ELIMINADO: Bootstrap ya define todas estas clases
* .btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-light, .btn-dark
* .btn-outline-primary, .btn-outline-secondary, etc.
* .btn-sm, .btn-lg
*
* No sobrescribir Bootstrap - dejarlo manejar los estilos de botones
*/
/* Alerts */
.alert {