erikghandClaude Opus 5.5
89e54a6e84
Primitivas y contenido del rediseño (escala tipográfica, Revelar, MarcaSeccion, Seccion, Antetitulo, SimboloMarca, Resplandor, ClaridadHero, sección Proceso de ocho etapas, lib/content.ts reestructurado en seis secciones con alias para las viejas). Mecanismo y FormaTrabajar se retiran. Encima, lo de esta sesión: - recorrido: creeer vuelve a responder cada situación en vez de repetirla (el alias apuntaba respuesta a situacion); respuestas en plural. Créditos de las seis fotos de México. - contacto: WhatsApp, email (con mailto:) y LinkedIn reales; iconos de las redes en el cierre y el footer (IconoRed, trazos de Simple Icons, CC0). - enlaces: lo externo abre en otra pestaña con noopener y aviso para lectores de pantalla (lib/enlaces.ts); mailto y anclas se quedan. - Proceso: las ocho tarjetas no aparecían nunca en móvil (amount 0.3 sobre una lista de ~3000px); ahora cada una se revela sola. El ≡ de la 08 ya no tapa un entregable, título equilibrado, etiqueta a 12px, sin elevar al hover lo que no es clicable. - Disciplinas: la frase «No son la promesa — son los medios» gana peso y se agrupa con título e ilustración; sin cortes huérfanos en móvil. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
32 lines
1.3 KiB
TypeScript
32 lines
1.3 KiB
TypeScript
import { describe, it, expect } from 'vitest';
|
|
import config from '../../tailwind.config';
|
|
|
|
// The scale is a contract, not a preference: the problem this redesign fixes is
|
|
// that five elements were tied for largest on the page, and because of that,
|
|
// none of them read as largest. Five roles: only one reaches above 4rem.
|
|
const escala = () => (config.theme?.extend?.fontSize ?? {}) as Record<string, [string, object]>;
|
|
|
|
describe('escala tipográfica', () => {
|
|
it('define los cinco roles del documento', () => {
|
|
expect(Object.keys(escala())).toEqual(
|
|
expect.arrayContaining(['display', 'titulo', 'sumario', 'cuerpo', 'rotulo']),
|
|
);
|
|
});
|
|
|
|
it('display es el único que llega a 7rem', () => {
|
|
const conSieteRem = Object.entries(escala()).filter(([, v]) => v[0].includes('7rem'));
|
|
expect(conSieteRem.map(([k]) => k)).toEqual(['display']);
|
|
});
|
|
|
|
it('el cuerpo se compone holgado y el display apretado', () => {
|
|
const lh = (rol: string) => (escala()[rol][1] as { lineHeight: string }).lineHeight;
|
|
expect(Number(lh('display'))).toBeLessThan(1);
|
|
expect(Number(lh('cuerpo'))).toBeGreaterThan(1.6);
|
|
});
|
|
|
|
it('reserva una medida de 68 caracteres para el texto corrido', () => {
|
|
const anchos = (config.theme?.extend?.maxWidth ?? {}) as Record<string, string>;
|
|
expect(anchos.medida).toBe('68ch');
|
|
});
|
|
});
|