From b4508a13db8531e78aa4d20cf9a1670b07266c7e Mon Sep 17 00:00:00 2001 From: JKuijperM Date: Mon, 14 Sep 2026 20:13:49 +0200 Subject: [PATCH] Anade una escala tipografica para los encabezados base.css nunca ha definido tamanos de encabezado, asi que los ponia el navegador: 32px el h1, 24px el h2 y 18,7px el h3. En una vista densa de datos como el dashboard eso compite con las propias cifras, y ademas dejaba los tamanos a merced de que un encabezado cambiara de nivel. Fija 1.625rem / 1.25rem / 1rem con font-weight 600. Los margenes van en rem a proposito: los del navegador van en em, escalan con el tamano de fuente y dejan huecos distintos entre secciones que deberian separarse igual. Va en la zona de estilos base, antes de los componentes, para que las reglas que ya ajustan encabezados concretos (.dashboard-context h1, .settings-card h2, .home-section > h2, .info-panel-content h2) sigan ganando por orden. Afecta a toda la aplicacion. Lo que mas se nota es el titulo de pagina: pierde 21px de aire por arriba, porque el margen superior del h1 pasa a 0 y el padding de .content impedia que colapsara. Entre secciones de la home no cambia nada, ahi manda el margin-bottom de 2.5rem de .home-section. Ningun media query toca tamanos de fuente, asi que en movil la escala es la misma, y el bloque no declara colores, asi que el tema oscuro no se entera. Co-Authored-By: Claude Opus 5 --- .../expenses/static/expenses/css/base.css | 25 +++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/expenses_manager/expenses/static/expenses/css/base.css b/expenses_manager/expenses/static/expenses/css/base.css index f1c3294..beed3c2 100644 --- a/expenses_manager/expenses/static/expenses/css/base.css +++ b/expenses_manager/expenses/static/expenses/css/base.css @@ -97,6 +97,31 @@ a.danger:visited, color: var(--color-danger-accent); } +/* Escala tipográfica. Los márgenes van en rem a propósito: los del navegador + van en em y escalan con el tamaño de fuente, dejando huecos irregulares + entre secciones. */ + +h1 { + font-size: 1.625rem; + font-weight: 600; + line-height: 1.2; + margin: 0 0 1rem; +} + +h2 { + font-size: 1.25rem; + font-weight: 600; + line-height: 1.25; + margin: 1.5rem 0 0.75rem; +} + +h3 { + font-size: 1rem; + font-weight: 600; + line-height: 1.3; + margin: 1rem 0 0.5rem; +} + /* ========================= */ /* Topbar / navigation */ /* ========================= */