fix(cardpen): auto-shrink overflowing card titles before capture (#316) - #400
Merged
Conversation
Long non-breaking titles — notably RU Cyrillic compounds such as "НЕЙРОЛИНГВИСТИЧЕСКОЕ ПРОГРАММИРОВАНИЕ" — overflowed the .title box and were clipped mid-word, because the inner `.title > div` uses `overflow-wrap: normal`. This implements Option B from #303/#353 (auto-shrink JS), chosen over a RU-only CSS class so the fix is language- and template-agnostic. frame.js now runs autoFitCardTitles() on each <card> in generateImages(), right after font preload and before the domtoimage capture. For each `.title` it binary-searches the largest font-size that fits horizontally (floor 8px). Titles that already fit are left untouched (no-op), so non-overflowing Latin titles are unaffected. Validated via Playwright on the real Fallacies face template + CSS: - "AD HOMINEM" (Latin): 84.5px unchanged (no-op) - "НЕЙРОЛИНГВИСТИЧЕСКОЕ ПРОГРАММИРОВАНИЕ": 84.5 -> 39.1px, now fits - "ПСЕВДОНАУЧНОСТЬ": 84.5 -> 51.7px, now fits Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This was referenced May 31, 2026
jsboige
added a commit
that referenced
this pull request
Jun 2, 2026
Extends PR #400 title auto-shrink to vertical body text overflow. Binary search (10 iterations) on font-size of .desc_* and .exemple_* children within .texte container. No-op when text fits, floor 7px, 2px tolerance. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This was referenced Jun 2, 2026
jsboige
added a commit
that referenced
this pull request
Jun 3, 2026
…idation dossier (#433) §2bis updated post-recalibration (#431 merged e9600c0). Replaces the stale pre-recalibration caveat (2834, global 65/85 thresholds, "po-2024 follow-up pending") with the fresh per-CardSet × per-detector breakdown from the recalibrated run (2026-06-03, 3905 imgs): - Construction-signature table: each detector flags by card construction, not defect. White-bg cards (Rules/Scenarii) → WhiteBand+blank-ratio ~96% noise; colored-bg (Fallacies-Web/Virtues) → blank-ratio clean, bottom-sat the signal. Only discriminant detector = bottom-sat, read per-CardSet. - #188 headline: WhiteBand clean on colored cards (Fallacies-Web 0, Virtues 37 scattered singletons, no 8-lang cluster) → no white-band regression on the cards #188 affected. - True exception list (bottom-sat): Rules rules_23 = #250 FIX 2 (proposed); Scenarii ~7 dense cards saturating ~43% uniformly across all 8 langs = card-intrinsic, NOT translation (new eye point); Virtues zh/ru/es/pt length-overflow cluster = #316/#353 family (PR #400 RU auto-shrink). Binary summary stays non-discriminant (3219/3905) — value is the per-CardSet exception filter, not the binary verdict. Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Contexte — issue #316 (overflow titre RU)
Les titres de carte longs et non sécables débordaient leur conteneur
.titleet étaient rognés en plein mot. Cas emblématique : les composés cyrilliques RU commeНЕЙРОЛИНГВИСТИЧЕСКОЕ ПРОГРАММИРОВАНИЕ. Cause : l'élément interne.title > divutiliseoverflow-wrap: normal(les mots longs ne reviennent pas à la ligne et débordent → rognage par l'ancêtreoverflow:hidden).Décision — Option B (et pas Option A)
Conformément à l'arbitrage acté (#303 / #353, disposition coordinateur jsboige 2026‑05‑29 : « HOLD → Option B »), ce PR implémente l'auto‑shrink JS dans CardPen, retenu plutôt qu'une classe CSS
lang-ru(-14%) parce qu'il est indépendant de la langue ET du gabarit : il agit sur tout titre qui déborde, peu importe le script.Changement
Un seul fichier :
Generation/CardPen/js/frame.js.generateImages()appelle désormaisautoFitCardTitles(node)sur chaque<card>, après le préchargement des polices et avant la capturedomtoimage..title,autoFitTitle()fait une recherche dichotomique de la plus grande taille de police qui tient horizontalement (plancher 8px, 12 itérations).titleContentFits()détecte le débordement viascrollWidth > clientWidthsur le titre et ses descendants (le mot long déborde ledivinterne enwidth:100%).Validation visuelle (Playwright — ai‑01)
Harnais reproduisant le gabarit Fallacies Face réel (CSS + markup
<div class="title"><div>…</div></div>), titre rendu ~84.5px sur carte 709px :AD HOMINEM(latin, contrôle)НЕЙРОЛИНГВИСТИЧЕСКОЕ ПРОГРАММИРОВАНИЕПСЕВДОНАУЧНОСТЬCaptures avant/après confirmées à la vision : RU rogné → RU entièrement lisible ; latin intact.
⚠ Dépendance déploiement (régénération)
Le pipeline Release charge CardPen depuis GitHub Pages (pas l'IIS local). Pour que la régénération multilingue prenne ce correctif :
master,En Debug/IIS local, redéployer le site IIS depuis le repo si besoin.
Suite
.famille(autre élément) est hors‑scope fix(css): Cyrillic title overflow in RU/PT mind maps and cards (v1.0.0 blocker) #316 ; à traiter séparément si confirmé en QA.Co-Authored-By: Claude Opus 4.6 noreply@anthropic.com