[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
// © 2026 TechnoLibre (http://www.technolibre.ca)
|
|
|
|
|
|
// License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl)
|
|
|
|
|
|
|
|
|
|
|
|
// Registre des marques porteuses d'information et des textes (§ 14.5,
|
|
|
|
|
|
// § 7.5, § 7.6, § 7.7). Chaque entrée nomme le jeton qui la peint et chaque
|
|
|
|
|
|
// jeton sur lequel elle se peint ; verifierPalette (palette.js) mesure le
|
|
|
|
|
|
// seuil de chaque couple dans les deux thèmes, sous les trois dichromaties,
|
|
|
|
|
|
// et les épreuves de rendu atteignent la marque par data-marque, qui porte
|
|
|
|
|
|
// son nom.
|
|
|
|
|
|
//
|
|
|
|
|
|
// Les remplissages d'une chaise sont son fond, son remplissage plein et les
|
|
|
|
|
|
// deux couleurs de la hachure — des traits --couleur-hachure sur le fond de
|
|
|
|
|
|
// la chaise : une marque posée sur une chaise se mesure sur chacun.
|
[ADD] interface: visual foundations, pills, cards, icons, navy header
Screens need colour that separates information without ever carrying it
alone. Tokens gain state, membership and status tints whose marks hold
3:1 and texts 4.5:1 in both themes and under three dichromacies, and
every hue stays 30 degrees from the reserved conflict hues. Commands get
three levels; Pastille, Carte and an icon module join the primitives;
memberships map to six stable tints over sorted names. A pill label
wraps and never truncates, and keeps one line beside a nowrap neighbour.
Checked: node 3949; browser 767, only the walkthrough captures differ.
--- FR ---
[ADD] interface : fondations, pastilles, cartes, icônes, bandeau marine
Les écrans ont besoin d'une couleur qui distingue l'information sans
jamais la porter seule. Les jetons gagnent des teintes d'état,
d'appartenance et de statut dont les marques tiennent 3:1 et les textes
4,5:1 dans les deux thèmes et sous trois dichromaties, chaque teinte à
30 degrés des teintes de conflit réservées. Les commandes ont trois
niveaux ; Pastille, Carte et un module d'icônes rejoignent les
primitives ; les appartenances reçoivent six teintes stables sur les
noms triés. Un libellé de pastille se replie, jamais tronqué.
Vérifié : node 3949 ; navigateur 767, seules les captures du parcours.
Assisted-by: Claude Opus 5.5
2026-10-10 22:59:51 -04:00
|
|
|
|
//
|
|
|
|
|
|
// Deux registres de marques : MARQUES, celles que les écrans rendent sous
|
|
|
|
|
|
// data-marque et que les épreuves de rendu mesurent sur ce qui est peint
|
|
|
|
|
|
// dessous ; SIGNES, celles des pastilles, des messages, de la bande de mode
|
|
|
|
|
|
// et de l'action principale, qui se valident par calcul sur chacun de leurs
|
|
|
|
|
|
// fonds. Un signe ne porte jamais seul une information : un libellé
|
|
|
|
|
|
// l'accompagne toujours.
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
|
|
|
|
|
|
const c = (nom) => `--couleur-${nom}`;
|
|
|
|
|
|
|
|
|
|
|
|
const REMPLISSAGES_CHAISE = ['chaise-fond', 'chaise-pleine', 'hachure'];
|
|
|
|
|
|
|
|
|
|
|
|
function entree(nom, jeton, fonds, seuil) {
|
|
|
|
|
|
return Object.freeze({ nom, jeton: c(jeton), fonds: Object.freeze(fonds.map(c)), seuil });
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
const marque = (nom, jeton, fonds) => entree(nom, jeton, fonds, 3);
|
|
|
|
|
|
const texte = (nom, jeton, fonds) => entree(nom, jeton, fonds, 4.5);
|
|
|
|
|
|
|
[ADD] plan: one hue and pattern per conflict rule, legend, appartenance
The plan drew every conflict in one hue, so a table that seats colleagues
together looked like one where people meet again. Each active rule now has
its own reserved hue and pattern: same appartenance hatched one way, met
again hatched the other, back at a table dotted; rules on one table
overlap, the badge keeps the total. A legend from the view bar shows each
active rule's sample. A table's tooltip names the appartenance that brings
a pair together. The hues are validated by computation in both themes and
the spec (7.5, 12.7) follows. Checked: 2848 node, 580 browser tests.
--- FR ---
[ADD] plan : une teinte et une trame par règle, légende, appartenance
Le plan dessinait tout conflit d'une seule teinte : une table qui réunit
des collègues ressemblait à une table où des gens se revoient. Chaque
règle active a sa teinte réservée et sa trame : même appartenance hachurée
dans un sens, voisins revus dans l'autre, table revue en pointillé ; les
règles d'une table se superposent, la pastille garde le total. Une légende
dans la barre de vue montre l'échantillon de chaque règle active.
L'infobulle nomme l'appartenance qui réunit une paire. Teintes validées
par calcul dans les deux thèmes ; spec § 7.5, § 12.7. Vérifié : 2848, 580.
Assisted-by: Claude Opus 5.5
2026-10-08 04:33:43 -04:00
|
|
|
|
// Les sortes de conflit : règle, marque de la trame, jeton court, forme.
|
|
|
|
|
|
const SORTES_CONFLIT = [
|
|
|
|
|
|
['separerAppartenances', 'trameAppartenance', 'conflit-appartenance', 'hachuresDescendantes'],
|
|
|
|
|
|
['nouveauxVoisins', 'trameVoisins', 'conflit-voisins', 'hachuresMontantes'],
|
|
|
|
|
|
['nouvelleTable', 'trameTable', 'conflit-table', 'points'],
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
/** Les trois sortes de conflit qu'une table porte (§ 7.5, § 12.7), une par
|
|
|
|
|
|
* règle que le moteur localise (conflitsParTable), dans son ordre — l'ordre
|
|
|
|
|
|
* du dessin, de la légende et de l'infobulle : { regle, marque, jeton,
|
|
|
|
|
|
* forme } — la règle du moteur, la marque data-marque de sa trame, le jeton
|
|
|
|
|
|
* de sa teinte, réservée à cette trame, et la forme de son motif
|
|
|
|
|
|
* (Motifs.svelte), qui la distingue sans la couleur. Deux règles violées à
|
|
|
|
|
|
* une même table superposent leurs trames : les hachures descendantes et
|
|
|
|
|
|
* montantes se croisent en quadrillage, les points se posent par-dessus. */
|
|
|
|
|
|
export const CONFLITS = Object.freeze(
|
|
|
|
|
|
SORTES_CONFLIT.map(([regle, trame, jeton, forme]) => Object.freeze({ regle, marque: trame, jeton: c(jeton), forme })),
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
|
|
/** Les jetons des teintes de conflit, dans l'ordre de CONFLITS. */
|
|
|
|
|
|
export const JETONS_CONFLIT = Object.freeze(CONFLITS.map(({ jeton }) => jeton));
|
|
|
|
|
|
|
|
|
|
|
|
/** Écarts perçus minimaux d'une teinte de conflit, en distance OKLab × 100
|
|
|
|
|
|
* mesurée en couleurs d'origine et sous chaque dichromatie (ecartPercu,
|
|
|
|
|
|
* palette.js) : entreConflits, d'une teinte de conflit à une autre — la
|
|
|
|
|
|
* couleur redit la forme de la règle ; autresMarques, d'une teinte de
|
|
|
|
|
|
* conflit à chaque autre marque du plan. Le second seuil est plus bas : les
|
|
|
|
|
|
* gris du mobilier occupent la clarté où une teinte de conflit tient 3:1
|
|
|
|
|
|
* sur le plateau sombre, et la forme distingue toujours la trame de ce
|
[FIX] interface: ghost labels, keyboard, valid HTML, closed data-* list
The drag ghost names what releasing at the point changes, floor included.
Escape on a seat returns to its table, a refused Tab stays put, the legend
toggle exposes aria-expanded, and the header markup is valid HTML. Every
data-* attribute the interface sets belongs to one closed list that a guard
reads. The tree guards follow helpers a test imports, and the reporter says
the whole series stays watched under coverage on a small machine.
Checked: every new test red first; 3001 node, 635 browser and 63 long tests
green from the index alone.
--- FR ---
[FIX] interface : fantôme nommé, clavier, HTML valide, data-* fermés
Le fantôme du glisser nomme ce que relâcher au point modifie, sol compris.
Échap sur un siège remonte à sa table, un Tab refusé reste en place, la
bascule de la légende expose aria-expanded, et la tête est du HTML valide.
Chaque attribut data-* que l'interface pose appartient à une liste fermée
qu'une garde lit. Les gardes de l'arbre suivent les aides qu'une épreuve
importe, et le rapporteur dit la série entière surveillée sous couverture.
Vérifié : chaque épreuve rouge d'abord ; 3001 node, 635 navigateur et 63
longues vertes depuis l'index seul.
Assisted-by: Claude Opus 5.5
2026-10-09 04:01:57 -04:00
|
|
|
|
* qu'elle côtoie. Sa valeur, 5, ne vient d'aucune référence de perception :
|
|
|
|
|
|
* elle se pose juste sous la plus petite séparation que la palette tient
|
|
|
|
|
|
* entre une teinte de conflit et une autre marque, et garde la palette de
|
|
|
|
|
|
* reculer sans établir qu'un écart de 5 se perçoit. */
|
[ADD] interface: visual foundations, pills, cards, icons, navy header
Screens need colour that separates information without ever carrying it
alone. Tokens gain state, membership and status tints whose marks hold
3:1 and texts 4.5:1 in both themes and under three dichromacies, and
every hue stays 30 degrees from the reserved conflict hues. Commands get
three levels; Pastille, Carte and an icon module join the primitives;
memberships map to six stable tints over sorted names. A pill label
wraps and never truncates, and keeps one line beside a nowrap neighbour.
Checked: node 3949; browser 767, only the walkthrough captures differ.
--- FR ---
[ADD] interface : fondations, pastilles, cartes, icônes, bandeau marine
Les écrans ont besoin d'une couleur qui distingue l'information sans
jamais la porter seule. Les jetons gagnent des teintes d'état,
d'appartenance et de statut dont les marques tiennent 3:1 et les textes
4,5:1 dans les deux thèmes et sous trois dichromaties, chaque teinte à
30 degrés des teintes de conflit réservées. Les commandes ont trois
niveaux ; Pastille, Carte et un module d'icônes rejoignent les
primitives ; les appartenances reçoivent six teintes stables sur les
noms triés. Un libellé de pastille se replie, jamais tronqué.
Vérifié : node 3949 ; navigateur 767, seules les captures du parcours.
Assisted-by: Claude Opus 5.5
2026-10-10 22:59:51 -04:00
|
|
|
|
export const SEPARATIONS = Object.freeze({ entreConflits: 12, autresMarques: 5, entreAppartenances: 10, clarteAppartenances: 10 });
|
|
|
|
|
|
|
|
|
|
|
|
/** La palette catégorielle des appartenances, sur les listes seulement —
|
|
|
|
|
|
* jamais sur le plan, dont le canal chromatique appartient aux conflits :
|
|
|
|
|
|
* { rang, marque, fond }, rang de 1 à n, le jeton de son point et celui du
|
|
|
|
|
|
* fond de sa pastille. Ses marques se séparent deux à deux de
|
|
|
|
|
|
* SEPARATIONS.entreAppartenances sous les trois dichromaties, et deux
|
|
|
|
|
|
* teintes voisines de SEPARATIONS.clarteAppartenances en clarté
|
|
|
|
|
|
* (verifierClartes) : six teintes au plus tiennent ces deux seuils à 3:1
|
|
|
|
|
|
* sur la carte. Au-delà de n appartenances, la pastille est neutre
|
|
|
|
|
|
* (appartenances.js). */
|
|
|
|
|
|
export const TEINTES_APPARTENANCE = Object.freeze(
|
|
|
|
|
|
[1, 2, 3, 4, 5, 6].map((rang) =>
|
|
|
|
|
|
Object.freeze({ rang, marque: c(`appartenance-${rang}-marque`), fond: c(`appartenance-${rang}-fond`) }),
|
|
|
|
|
|
),
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
|
|
// Les surfaces de contenu sur lesquelles une pastille se pose.
|
|
|
|
|
|
const SURFACES = ['carte-fond', 'carte-fond-sourd', 'page-fond'];
|
|
|
|
|
|
// Les teintes d'une pastille dont la marque se pose aussi hors de son fond.
|
|
|
|
|
|
const TEINTES_DE_PASTILLE = [
|
|
|
|
|
|
['etatBrouillon', 'etat-brouillon'],
|
|
|
|
|
|
['etatPropose', 'etat-propose'],
|
|
|
|
|
|
['etatRetenu', 'etat-retenu'],
|
|
|
|
|
|
['etatBloque', 'etat-bloque'],
|
|
|
|
|
|
['neutre', 'neutre'],
|
|
|
|
|
|
...TEINTES_APPARTENANCE.map(({ rang }) => [`appartenance${rang}`, `appartenance-${rang}`]),
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
/** Les signes, même forme que MARQUES, seuil 3 : l'icône ou le point d'une
|
|
|
|
|
|
* pastille sur son fond teinté et sur les surfaces de contenu ; l'icône
|
|
|
|
|
|
* d'un message sur son fond ; l'icône de la bande de mode, de la teinte du
|
|
|
|
|
|
* cadre de mode, sur le fond de la bande ; le fond de l'action principale,
|
|
|
|
|
|
* qui délimite le bouton, sur les surfaces. */
|
|
|
|
|
|
export const SIGNES = Object.freeze([
|
|
|
|
|
|
...TEINTES_DE_PASTILLE.map(([nom, teinte]) => marque(nom, `${teinte}-marque`, [`${teinte}-fond`, ...SURFACES])),
|
|
|
|
|
|
marque('signeAvis', 'avis-marque', ['avis-fond']),
|
|
|
|
|
|
marque('signeRefus', 'refus-marque', ['refus-fond']),
|
|
|
|
|
|
marque('signeInformation', 'information-marque', ['information-fond']),
|
|
|
|
|
|
marque('bandeEcriture', 'cadre-ecriture', ['mode-ecriture-fond']),
|
|
|
|
|
|
marque('bandeLecture', 'cadre-lecture', ['mode-lecture-fond']),
|
|
|
|
|
|
marque('bandeBloque', 'cadre-bloque', ['mode-bloque-fond']),
|
|
|
|
|
|
marque('actionPrincipale', 'action-fond', SURFACES),
|
|
|
|
|
|
]);
|
[ADD] plan: one hue and pattern per conflict rule, legend, appartenance
The plan drew every conflict in one hue, so a table that seats colleagues
together looked like one where people meet again. Each active rule now has
its own reserved hue and pattern: same appartenance hatched one way, met
again hatched the other, back at a table dotted; rules on one table
overlap, the badge keeps the total. A legend from the view bar shows each
active rule's sample. A table's tooltip names the appartenance that brings
a pair together. The hues are validated by computation in both themes and
the spec (7.5, 12.7) follows. Checked: 2848 node, 580 browser tests.
--- FR ---
[ADD] plan : une teinte et une trame par règle, légende, appartenance
Le plan dessinait tout conflit d'une seule teinte : une table qui réunit
des collègues ressemblait à une table où des gens se revoient. Chaque
règle active a sa teinte réservée et sa trame : même appartenance hachurée
dans un sens, voisins revus dans l'autre, table revue en pointillé ; les
règles d'une table se superposent, la pastille garde le total. Une légende
dans la barre de vue montre l'échantillon de chaque règle active.
L'infobulle nomme l'appartenance qui réunit une paire. Teintes validées
par calcul dans les deux thèmes ; spec § 7.5, § 12.7. Vérifié : 2848, 580.
Assisted-by: Claude Opus 5.5
2026-10-08 04:33:43 -04:00
|
|
|
|
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
/** Les marques porteuses d'information (§ 14.5) : { nom, jeton, fonds, seuil: 3 } — nom, la
|
|
|
|
|
|
* désignation data-marque ; jeton, celui qui la peint ; fonds, chaque jeton sur lequel elle
|
|
|
|
|
|
* se peint, chaque remplissage d'une chaise pour une marque qui passe sur une chaise. */
|
|
|
|
|
|
export const MARQUES = Object.freeze([
|
|
|
|
|
|
// Sur la chaise (§ 7.6) : cadenas posés sur ses remplissages ; l'anneau
|
|
|
|
|
|
// l'entoure, sur le sol et le bord du plateau qu'elle touche.
|
|
|
|
|
|
marque('cadenasFerme', 'marque', REMPLISSAGES_CHAISE),
|
|
|
|
|
|
marque('cadenasOuvert', 'marque', REMPLISSAGES_CHAISE),
|
|
|
|
|
|
marque('anneau', 'marque', ['sol', 'table-fond', ...REMPLISSAGES_CHAISE]),
|
|
|
|
|
|
marque('hachure', 'hachure', ['chaise-fond']),
|
|
|
|
|
|
marque('remplissagePlein', 'chaise-pleine', ['sol', 'table-fond']),
|
[ADD] plan: one hue and pattern per conflict rule, legend, appartenance
The plan drew every conflict in one hue, so a table that seats colleagues
together looked like one where people meet again. Each active rule now has
its own reserved hue and pattern: same appartenance hatched one way, met
again hatched the other, back at a table dotted; rules on one table
overlap, the badge keeps the total. A legend from the view bar shows each
active rule's sample. A table's tooltip names the appartenance that brings
a pair together. The hues are validated by computation in both themes and
the spec (7.5, 12.7) follows. Checked: 2848 node, 580 browser tests.
--- FR ---
[ADD] plan : une teinte et une trame par règle, légende, appartenance
Le plan dessinait tout conflit d'une seule teinte : une table qui réunit
des collègues ressemblait à une table où des gens se revoient. Chaque
règle active a sa teinte réservée et sa trame : même appartenance hachurée
dans un sens, voisins revus dans l'autre, table revue en pointillé ; les
règles d'une table se superposent, la pastille garde le total. Une légende
dans la barre de vue montre l'échantillon de chaque règle active.
L'infobulle nomme l'appartenance qui réunit une paire. Teintes validées
par calcul dans les deux thèmes ; spec § 7.5, § 12.7. Vérifié : 2848, 580.
Assisted-by: Claude Opus 5.5
2026-10-08 04:33:43 -04:00
|
|
|
|
// Le conflit (§ 7.5) : contour épaissi sur le sol, commun aux trois
|
|
|
|
|
|
// règles et peint de l'encre forte du plan ; une trame par règle violée
|
|
|
|
|
|
// sur le plateau, chacune de sa teinte, ses traits détachés par un halo
|
|
|
|
|
|
// du fond du plateau ; pastille chiffrée près de la table.
|
|
|
|
|
|
marque('contourConflit', 'contour-fort', ['sol', 'table-fond']),
|
|
|
|
|
|
...SORTES_CONFLIT.map(([, trame, jeton]) => marque(trame, jeton, ['table-fond'])),
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
marque('pastille', 'pastille-fond', ['sol', 'table-fond']),
|
|
|
|
|
|
marque('poignee', 'poignee', ['sol']),
|
|
|
|
|
|
marque('gel', 'gel', ['sol', 'table-fond']),
|
|
|
|
|
|
// La désignation se pose sur la page, le sol, le plateau et une chaise
|
|
|
|
|
|
// vide, pourvue ou à pourvoir : chacun de ses remplissages est un fond.
|
|
|
|
|
|
marque('miseEnEvidence', 'mise-en-evidence', ['page-fond', 'sol', 'table-fond', ...REMPLISSAGES_CHAISE]),
|
|
|
|
|
|
marque('selection', 'selection', ['page-fond', 'sol', 'table-fond', ...REMPLISSAGES_CHAISE]),
|
|
|
|
|
|
// Le cadre de mode (§ 8.4) entoure le contenu de l'événement, sur la page.
|
|
|
|
|
|
marque('cadreLecture', 'cadre-lecture', ['page-fond']),
|
|
|
|
|
|
marque('cadreEcriture', 'cadre-ecriture', ['page-fond']),
|
|
|
|
|
|
marque('cadreBloque', 'cadre-bloque', ['page-fond']),
|
[ADD] interface: visual foundations, pills, cards, icons, navy header
Screens need colour that separates information without ever carrying it
alone. Tokens gain state, membership and status tints whose marks hold
3:1 and texts 4.5:1 in both themes and under three dichromacies, and
every hue stays 30 degrees from the reserved conflict hues. Commands get
three levels; Pastille, Carte and an icon module join the primitives;
memberships map to six stable tints over sorted names. A pill label
wraps and never truncates, and keeps one line beside a nowrap neighbour.
Checked: node 3949; browser 767, only the walkthrough captures differ.
--- FR ---
[ADD] interface : fondations, pastilles, cartes, icônes, bandeau marine
Les écrans ont besoin d'une couleur qui distingue l'information sans
jamais la porter seule. Les jetons gagnent des teintes d'état,
d'appartenance et de statut dont les marques tiennent 3:1 et les textes
4,5:1 dans les deux thèmes et sous trois dichromaties, chaque teinte à
30 degrés des teintes de conflit réservées. Les commandes ont trois
niveaux ; Pastille, Carte et un module d'icônes rejoignent les
primitives ; les appartenances reçoivent six teintes stables sur les
noms triés. Un libellé de pastille se replie, jamais tronqué.
Vérifié : node 3949 ; navigateur 767, seules les captures du parcours.
Assisted-by: Claude Opus 5.5
2026-10-10 22:59:51 -04:00
|
|
|
|
marque('focus', 'focus', ['page-fond', 'bandeau-fond', 'carte-fond', 'carte-fond-sourd', 'sol', 'table-fond', ...REMPLISSAGES_CHAISE]),
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
// Le mobilier sur le sol : le trait de la table, celui de la chaise, qui
|
|
|
|
|
|
// touche aussi le plateau.
|
|
|
|
|
|
marque('contourTable', 'table-trait', ['sol']),
|
|
|
|
|
|
marque('contourChaise', 'chaise-trait', ['sol', 'table-fond']),
|
|
|
|
|
|
// L'échelle graphique (§ 7.7) vit dans la surface du plan, sur le sol ou la
|
|
|
|
|
|
// page ; le fantôme d'un glissement passe sur le sol, les tables et les
|
|
|
|
|
|
// chaises.
|
|
|
|
|
|
marque('echelle', 'echelle', ['sol', 'page-fond']),
|
|
|
|
|
|
marque('fantome', 'fantome', ['sol', 'table-fond', ...REMPLISSAGES_CHAISE]),
|
[IMP] home: list shown at once, computed columns loaded per event
The event list waited until every event's ranking was evaluated, about
10 ms per event with propositions, before showing anything. It now shows
as soon as the folder is read; each line's retained-plan columns and best
proposition load one event at a time, yielding to the browser between
events, behind a rotating SVG spinner, and show as each result arrives.
Work for a list no longer shown is dropped. The spinner is the one named
exception to the no-animation rule: still under reduced motion, cancelled
for captures, announced once. Checked: 2935 node, 616 browser, 62 long.
--- FR ---
[IMP] accueil : liste aussitôt montrée, colonnes calculées par événement
La liste des événements attendait l'évaluation du classement de chaque
événement, environ 10 ms par événement qui a des propositions, avant de
rien montrer. Elle paraît dès la lecture du dossier ; les colonnes du
retenu et la meilleure proposition de chaque ligne se chargent un
événement à la fois, le navigateur reprenant la main entre deux, derrière
une icône SVG qui tourne. Le travail d'une liste qui n'est plus montrée
est abandonné. L'icône est la seule exception nommée à l'interdit
d'animation. Vérifié : 2935 node, 616 navigateur, 62 longues.
Assisted-by: Claude Opus 5.5
2026-10-08 17:07:31 -04:00
|
|
|
|
// Le signe du chargement d'une valeur de la liste des événements (§ 8.1) :
|
|
|
|
|
|
// un arc tracé de l'encre secondaire, sur la page.
|
|
|
|
|
|
marque('chargement', 'page-texte-secondaire', ['page-fond']),
|
[ADD] print: preview screen, printable sheet, paper question
Printed pages must show exactly what will come out of the printer. An
Imprimer button in the event header opens a preview screen where each page
is a sheet at paper size, light whatever the theme, with its footer and,
under the strict draft rule, BROUILLON in outline; a proposal shown on a
retained plan prints as a draft. The paper is asked once per machine and
can be changed there. The table sheets offer one sheet per round. A failed
print shows IMPRESSION_ECHEC. The captures are republished with the button.
Checked: red first; 3651 node, 707 browser and 101 long tests green from
the index alone.
--- FR ---
[ADD] impression : aperçu, feuille imprimable, question du papier
Une page imprimée doit montrer exactement ce que l'imprimante rendra. Un
bouton Imprimer de la tête de l'événement ouvre un aperçu où chaque page
est une feuille au format du papier, claire quel que soit le thème, avec
son pied et, sous la règle stricte, BROUILLON au trait ; une proposition
montrée sur un plan retenu s'imprime en brouillon. Le papier se demande une
fois par machine et s'y change. Les feuilles par table offrent une feuille
par tour. Une impression échouée affiche IMPRESSION_ECHEC. Les captures
sont republiées avec le bouton.
Vérifié : rouge d'abord ; 3651 node, 707 navigateur et 101 longues vertes
depuis l'index seul.
Assisted-by: Claude Opus 5.5
2026-10-09 17:09:29 -04:00
|
|
|
|
// Le filigrane BROUILLON (§ 11.7) : un texte au trait, par-dessus le
|
|
|
|
|
|
// contenu d'une feuille imprimée, mesuré sur le papier, clair dans les
|
|
|
|
|
|
// deux thèmes.
|
|
|
|
|
|
marque('filigrane', 'filigrane', ['papier']),
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
]);
|
|
|
|
|
|
|
[ADD] interface: visual foundations, pills, cards, icons, navy header
Screens need colour that separates information without ever carrying it
alone. Tokens gain state, membership and status tints whose marks hold
3:1 and texts 4.5:1 in both themes and under three dichromacies, and
every hue stays 30 degrees from the reserved conflict hues. Commands get
three levels; Pastille, Carte and an icon module join the primitives;
memberships map to six stable tints over sorted names. A pill label
wraps and never truncates, and keeps one line beside a nowrap neighbour.
Checked: node 3949; browser 767, only the walkthrough captures differ.
--- FR ---
[ADD] interface : fondations, pastilles, cartes, icônes, bandeau marine
Les écrans ont besoin d'une couleur qui distingue l'information sans
jamais la porter seule. Les jetons gagnent des teintes d'état,
d'appartenance et de statut dont les marques tiennent 3:1 et les textes
4,5:1 dans les deux thèmes et sous trois dichromaties, chaque teinte à
30 degrés des teintes de conflit réservées. Les commandes ont trois
niveaux ; Pastille, Carte et un module d'icônes rejoignent les
primitives ; les appartenances reçoivent six teintes stables sur les
noms triés. Un libellé de pastille se replie, jamais tronqué.
Vérifié : node 3949 ; navigateur 767, seules les captures du parcours.
Assisted-by: Claude Opus 5.5
2026-10-10 22:59:51 -04:00
|
|
|
|
// Les fonds teintés d'une pastille : ceux de ses teintes, puis ceux des
|
|
|
|
|
|
// messages, qu'un statut reprend, et la teinte de l'action.
|
|
|
|
|
|
const FONDS_ETIQUETTE = [
|
|
|
|
|
|
...TEINTES_DE_PASTILLE.map(([, teinte]) => `${teinte}-fond`),
|
|
|
|
|
|
'avis-fond',
|
|
|
|
|
|
'refus-fond',
|
|
|
|
|
|
'information-fond',
|
|
|
|
|
|
'action-teinte',
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
/** Les textes et leurs fonds, même forme, seuil 4,5 : page, secondaire,
|
|
|
|
|
|
* bandeau, refus, avis, listes du plan sur le sol, pastille du plan ; puis
|
|
|
|
|
|
* l'encre de la page sur la carte, l'encre secondaire sur la carte, le
|
|
|
|
|
|
* texte d'une étiquette — l'encre de la page sur chaque fond teinté de
|
|
|
|
|
|
* pastille (§ 12.7) —, celui de la bande de mode, la version et la
|
|
|
|
|
|
* provenance du bandeau, le thème retenu du bandeau, aux couleurs du
|
|
|
|
|
|
* bandeau inversées, le texte de l'action principale, un lien ou un texte
|
|
|
|
|
|
* mis en valeur de l'encre de l'action, et l'information. Le refus, l'avis
|
|
|
|
|
|
* et l'information gardent l'encre de leur message, sur son fond. */
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
export const TEXTES = Object.freeze([
|
|
|
|
|
|
texte('page', 'page-texte', ['page-fond']),
|
|
|
|
|
|
texte('secondaire', 'page-texte-secondaire', ['page-fond']),
|
|
|
|
|
|
texte('bandeau', 'bandeau-texte', ['bandeau-fond']),
|
[ADD] interface: visual foundations, pills, cards, icons, navy header
Screens need colour that separates information without ever carrying it
alone. Tokens gain state, membership and status tints whose marks hold
3:1 and texts 4.5:1 in both themes and under three dichromacies, and
every hue stays 30 degrees from the reserved conflict hues. Commands get
three levels; Pastille, Carte and an icon module join the primitives;
memberships map to six stable tints over sorted names. A pill label
wraps and never truncates, and keeps one line beside a nowrap neighbour.
Checked: node 3949; browser 767, only the walkthrough captures differ.
--- FR ---
[ADD] interface : fondations, pastilles, cartes, icônes, bandeau marine
Les écrans ont besoin d'une couleur qui distingue l'information sans
jamais la porter seule. Les jetons gagnent des teintes d'état,
d'appartenance et de statut dont les marques tiennent 3:1 et les textes
4,5:1 dans les deux thèmes et sous trois dichromaties, chaque teinte à
30 degrés des teintes de conflit réservées. Les commandes ont trois
niveaux ; Pastille, Carte et un module d'icônes rejoignent les
primitives ; les appartenances reçoivent six teintes stables sur les
noms triés. Un libellé de pastille se replie, jamais tronqué.
Vérifié : node 3949 ; navigateur 767, seules les captures du parcours.
Assisted-by: Claude Opus 5.5
2026-10-10 22:59:51 -04:00
|
|
|
|
texte('refus', 'refus', ['page-fond', 'refus-fond', 'carte-fond']),
|
|
|
|
|
|
texte('avis', 'avis', ['page-fond', 'avis-fond', 'carte-fond']),
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
texte('listes', 'liste-texte', ['sol']),
|
|
|
|
|
|
texte('pastille', 'pastille-texte', ['pastille-fond']),
|
[ADD] interface: visual foundations, pills, cards, icons, navy header
Screens need colour that separates information without ever carrying it
alone. Tokens gain state, membership and status tints whose marks hold
3:1 and texts 4.5:1 in both themes and under three dichromacies, and
every hue stays 30 degrees from the reserved conflict hues. Commands get
three levels; Pastille, Carte and an icon module join the primitives;
memberships map to six stable tints over sorted names. A pill label
wraps and never truncates, and keeps one line beside a nowrap neighbour.
Checked: node 3949; browser 767, only the walkthrough captures differ.
--- FR ---
[ADD] interface : fondations, pastilles, cartes, icônes, bandeau marine
Les écrans ont besoin d'une couleur qui distingue l'information sans
jamais la porter seule. Les jetons gagnent des teintes d'état,
d'appartenance et de statut dont les marques tiennent 3:1 et les textes
4,5:1 dans les deux thèmes et sous trois dichromaties, chaque teinte à
30 degrés des teintes de conflit réservées. Les commandes ont trois
niveaux ; Pastille, Carte et un module d'icônes rejoignent les
primitives ; les appartenances reçoivent six teintes stables sur les
noms triés. Un libellé de pastille se replie, jamais tronqué.
Vérifié : node 3949 ; navigateur 767, seules les captures du parcours.
Assisted-by: Claude Opus 5.5
2026-10-10 22:59:51 -04:00
|
|
|
|
texte('carte', 'page-texte', ['carte-fond', 'carte-fond-sourd']),
|
|
|
|
|
|
texte('secondaireCarte', 'page-texte-secondaire', ['carte-fond', 'carte-fond-sourd']),
|
|
|
|
|
|
texte('etiquette', 'page-texte', FONDS_ETIQUETTE),
|
|
|
|
|
|
texte('bandeMode', 'page-texte', ['mode-ecriture-fond', 'mode-lecture-fond', 'mode-bloque-fond']),
|
|
|
|
|
|
texte('bandeauSecondaire', 'bandeau-texte-secondaire', ['bandeau-fond']),
|
|
|
|
|
|
texte('bandeauChoisi', 'bandeau-fond', ['bandeau-texte']),
|
|
|
|
|
|
texte('action', 'action-texte', ['action-fond']),
|
|
|
|
|
|
texte('lien', 'action-encre', ['page-fond', 'carte-fond', 'carte-fond-sourd', 'action-teinte']),
|
|
|
|
|
|
texte('information', 'information', ['information-fond', 'page-fond', 'carte-fond']),
|
[ADD] interface: colour tokens, two themes, checked palette, marks
The plan's colours carry meaning — a conflict, a reservation, a mode — so
they must stay readable for every reader and in both themes. jetons.css
defines the tokens for the light and dark themes, set by data-theme on the
root; palette.js reads them from the stylesheet text and checks, by
computation, contrast to WCAG and separation under the three
dichromacies, keeping the conflict hue reserved. The theme follows the
system at each start and the operator's choice lasts the session.
Checked: 1709 node and 43 browser tests.
--- FR ---
[ADD] interface : jetons de couleur, deux thèmes, palette, marques
Les couleurs du plan portent un sens — un conflit, une réservation, un mode
— et doivent rester lisibles pour tout lecteur et dans les deux thèmes.
jetons.css définit les jetons des thèmes clair et sombre, posés par
data-theme sur la racine ; palette.js les lit dans le texte de la feuille
et contrôle, par calcul, le contraste au sens des WCAG et la séparation
sous les trois dichromaties, la teinte du conflit restant réservée. Le
thème suit le système à chaque démarrage ; le choix de l'opérateur vaut
pour la séance.
Vérifié : 1709 node et 43 navigateur.
Assisted-by: Claude Opus 5.5
2026-10-07 02:33:12 -04:00
|
|
|
|
]);
|