@mostajs/wagon-ui 0.3.0 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/package.json +1 -1
- package/src/index.js +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -4,6 +4,12 @@
|
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
|
|
7
|
+
|
|
8
|
+
## 0.3.1 — 2026-10-02
|
|
9
|
+
|
|
10
|
+
- **Correctif** : l'en-tête `entete: 'barre'` portait la classe `barre`, déjà prise par la jauge de consommation
|
|
11
|
+
(`.barre{width:9em;height:.55em;border-radius:99px}`) — l'en-tête s'affichait en pilule tronquée. Il porte
|
|
12
|
+
désormais la classe `bande` ; T-WUI-15 vérifie qu'aucune autre règle ne vise la classe de l'en-tête.
|
|
7
13
|
## 0.3.0 — 2026-10-02
|
|
8
14
|
|
|
9
15
|
- **Palette Studio** (palette.amia.fr) : les jetons portent désormais les noms de la palette (`--brand`, `--link`,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mostajs/wagon-ui",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.1",
|
|
4
4
|
"description": "Les pages du wagon d'un SaaS — mise en page (langues, pied légal, en-têtes pour les moteurs), accueil, tarifs, inscription, connexion (mot de passe ou code), espace client (palier, jauges, clés, factures, gestion de l'abonnement), administration (paliers, usage), pages légales — en fr, en, ar. Extraites de mdseal, sans ce qu'il vend : l'identité et les ressources mesurées viennent de la configuration. Vues pures, zéro dépendance.",
|
|
5
5
|
"license": "AGPL-3.0-or-later",
|
|
6
6
|
"author": "Dr Hamid MADANI <drmdh@msn.com>",
|
package/src/index.js
CHANGED
|
@@ -107,11 +107,11 @@ img,pre{max-width:100%} pre{overflow-x:auto}
|
|
|
107
107
|
.champs label{flex:1 1 100%}
|
|
108
108
|
.grille-tarifs{grid-template-columns:1fr}
|
|
109
109
|
}
|
|
110
|
-
header.
|
|
111
|
-
header.
|
|
112
|
-
header.
|
|
113
|
-
header.
|
|
114
|
-
header.
|
|
110
|
+
header.bande{max-width:none;background:var(--brand);border-bottom:0;padding:.8rem max(1rem,calc((100% - 920px)/2))}
|
|
111
|
+
header.bande .brand,header.bande nav a,header.bande .moi a,header.bande .langues a,header.bande .langues b,header.bande .langues{color:var(--text-on-brand)}
|
|
112
|
+
header.bande nav a{opacity:.9} header.bande nav a.on,header.bande nav a:hover{background:rgba(255,255,255,.16);opacity:1}
|
|
113
|
+
header.bande .burger{color:var(--text-on-brand);border-color:rgba(255,255,255,.4)}
|
|
114
|
+
header.bande + main{padding-top:1.2rem}`;
|
|
115
115
|
}
|
|
116
116
|
|
|
117
117
|
/** Un thème de Palette Studio n'est accepté que s'il ne fait que redéfinir des jetons dans :root{…}. */
|
|
@@ -206,7 +206,7 @@ export function creerWagonUi({ marque, couleurs = {}, langues = ['fr', 'en', 'ar
|
|
|
206
206
|
return `<!doctype html><html lang="${L}" dir="${dirDe(L)}"><head><meta charset="utf-8">
|
|
207
207
|
<meta name="viewport" content="width=device-width, initial-scale=1"><title>${esc(titre)} — ${nom}</title>
|
|
208
208
|
${tete}<style>${STYLE}</style>${themeCss() ? `<style id="theme-palette">${themeCss()}</style>` : ''}</head><body>
|
|
209
|
-
<header${entete === 'barre' ? ' class="
|
|
209
|
+
<header${entete === 'barre' ? ' class="bande"' : ''}><a class="brand" href="/">${marque.symbole ? `${esc(marque.symbole)} ` : ''}${nom}</a><input type="checkbox" id="wagon-menu" class="bascule"><label for="wagon-menu" class="burger" aria-label="${esc(tr('layout.menu'))}">☰</label><div class="menu"><nav>${nav.map(([h, l]) => `<a href="${lien(h)}"${actif === h ? ' class="on"' : ''}>${esc(l)}</a>`).join('')}</nav><span class="moi"><a href="${connecte ? '/compte' : '/connexion'}">${esc(tr(connecte ? 'espace.compte' : 'espace.seConnecter'))}</a>${connecte ? ` · <a href="/deconnexion">${esc(tr('espace.seDeconnecter'))}</a>` : ''}</span>${choixLangue}</div></header>
|
|
210
210
|
<main>${contenu}</main>
|
|
211
211
|
<footer><b>${nom}</b>${slogan ? ` — ${esc(slogan)}` : ''} · ${esc(tr('layout.auteur'))} : <b>${esc(marque.auteur)}</b>${marque.courriel ? ` <${esc(marque.courriel)}>` : ''} · ${esc(marque.licence ?? 'AGPL-3.0')} · ${esc(tr('layout.propulse'))} <code>@mostajs/*</code><br><span class="legal">${DOCUMENTS_LEGAUX.map(([h, k]) => `<a href="/${h}">${esc(tr(`legal.${k}`))}</a>`).join(' · ')}</span></footer>
|
|
212
212
|
</body></html>`;
|