From c90a2d86eba4a814e567eac18afede31ea9bd8b1 Mon Sep 17 00:00:00 2001 From: Loki Date: Sat, 15 Aug 2026 22:03:28 +0000 Subject: [PATCH] =?UTF-8?q?Largeur=20de=20lecture=20:=20suivre=20le=20pann?= =?UTF-8?q?eau=20au=20lieu=20d'une=20colonne=20=C3=A9troite=20centr=C3=A9e?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Sur un écran large, le fil se réduisait à ~590 px de texte entouré de vide : la mesure était plafonnée à 760 px et centrée sur la fenêtre, alors que la charte fait courir le texte sur toute la largeur du panneau. Elle était en plus codée à TROIS endroits avec des valeurs différentes (450 / 380 / 360 px), donc condamnée à diverger entre le fil et la carte de saisie. Une seule variable --measure les pilote désormais tous les deux. La borne haute reste : au-delà, l'œil perd le début de la ligne suivante. 1080 px ≈ 110 caractères — large, mais encore lisible. Mesuré au navigateur en 2000 px : réponse 1050 px (contre 589), question 788 px (75 %, conforme à la charte), carte de saisie alignée sur le fil. --- internal/loki/ui/index.html | 14 ++++++++++++++ internal/loki/ui/src/styles.css | 14 ++++++++++++++ 2 files changed, 28 insertions(+) diff --git a/internal/loki/ui/index.html b/internal/loki/ui/index.html index bb4776d..0554a51 100644 --- a/internal/loki/ui/index.html +++ b/internal/loki/ui/index.html @@ -1330,6 +1330,20 @@ button:hover{border-color:var(--dim);color:var(--text)} #send:hover:not(:disabled){background:var(--accent);border-color:var(--accent);color:#fff;opacity:.88} #stop{background:var(--err);border-color:var(--err);color:#fff} #stop:hover{background:var(--err);border-color:var(--err);color:#fff;opacity:.88} + +/* --- Terre : largeur de lecture -------------------------------------- + La mesure était plafonnée à 760 px et centrée sur la fenêtre : sur un écran + large, le fil se réduisait à une colonne étroite entourée de vide, alors que + la charte fait courir le texte sur toute la largeur du panneau. + Une seule variable pilote désormais le fil ET la carte de saisie — ils + étaient réglés séparément (450 / 380 / 360 px), donc condamnés à diverger. + La borne haute reste : au-delà, une ligne devient pénible à lire (l'œil perd + le début de la suivante). 1080 px ≈ 110 caractères, large mais tenable. */ +@media (min-width:721px){ + :root{--measure:min(1080px,100%)} + #chat{padding:26px max(20px,calc(50% - var(--measure)/2)) 8px} + #composer{--col:calc(max(20px,calc(50% - var(--measure)/2)) + var(--sbw,0px))} +}