From 003a9a9e47556dbf0448919df165a519814656ab Mon Sep 17 00:00:00 2001 From: dev Date: Sat, 6 Jun 2026 00:16:48 +0200 Subject: [PATCH] fix(forma): full-bleed cover at `full` so its corners match the card MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The previous fix dropped the cover to a clean --radius-xl, but a sharp 16px corner floating inside the card's 169px pill curve still read as broken. The only way a child's corner can match a `full` parent (whose radius caps per-dimension, so concentric math is impossible) is to let the parent CLIP it: at `full` the cover now bleeds edge-to-edge with no radius of its own, and the card's overflow:hidden + real corner round its top to match exactly. Updated SHAPE_ENGINE_RFC §5 accordingly. Co-Authored-By: Claude Opus 4.8 (1M context) --- src/uix/eidos/SHAPE_ENGINE_RFC.md | 8 +++++--- web/routes/temas/forma/+page.svelte | 9 +++++---- 2 files changed, 10 insertions(+), 7 deletions(-) diff --git a/src/uix/eidos/SHAPE_ENGINE_RFC.md b/src/uix/eidos/SHAPE_ENGINE_RFC.md index 9d3ad630a..bb01b3f3f 100644 --- a/src/uix/eidos/SHAPE_ENGINE_RFC.md +++ b/src/uix/eidos/SHAPE_ENGINE_RFC.md @@ -105,9 +105,11 @@ nada → cero rotura): > se **recorta a la mitad de la dimensión menor de cada elemento** — un contenedor alto y su hijo > ancho (p. ej. 16:10) recortan a valores distintos, así que **no pueden ser concéntricos**. `full` > es para **hojas** (chips · botones · avatares · inputs-píldora), no para contenedores con hijos -> que deban encajar. La regla `[data-shape-nest]` se desactiva ahí; el hijo se queda en un radio -> finito limpio. El demo `/temas/forma` lo refleja: al elegir `full`, el toggle "radios -> concéntricos" se inhabilita («n/a a full — geometría de hoja») y la carátula cae a `--radius-xl`. +> que deban encajar. La regla `[data-shape-nest]` se desactiva ahí. El demo `/temas/forma` lo +> refleja: al elegir `full`, el toggle "radios concéntricos" se inhabilita («n/a a full — geometría +> de hoja») y la carátula **sangra a borde completo sin radio propio** — el `overflow: hidden` + la +> curva real del card la recortan para que su esquina superior coincida exacta con la del card (la +> única forma de "encajar" sin radios finitos: dejar que el padre recorte al hijo, no calcular). ## 6. Fases (la flexibilidad va horneada en cada una) diff --git a/web/routes/temas/forma/+page.svelte b/web/routes/temas/forma/+page.svelte index ccf3c6c0a..ee4f60c72 100644 --- a/web/routes/temas/forma/+page.svelte +++ b/web/routes/temas/forma/+page.svelte @@ -349,10 +349,11 @@ overflow: hidden; } .cover-naive { border-radius: var(--radius-xl); } - /* at `full` the card is a pill (radius caps to half its width); a 16:10 cover would cap to half - its HEIGHT → a horizontal pill that can't be concentric with a vertical-pill parent. Concentric - needs finite radii. So at full the cover stays cleanly rounded (a leaf), never "pill-in-pill". */ - .cover-full { border-radius: var(--radius-xl); } + /* at `full` the card is a pill (radius caps to half its shorter side); a finite-radius cover + floating inside reads as broken, and a concentric cover is impossible (different aspect ratios + cap differently). So at full the cover bleeds edge-to-edge with NO radius of its own — the + card's overflow:hidden + its real corner clip the cover's top to match the card exactly. */ + .cover-full { margin: 0; border-radius: 0; } .player-play { inline-size: 3.25rem; aspect-ratio: 1;