Thèmes CSS

Les thèmes CSS changent le visuel sans remplacer le comportement de la page publique. Aucun JavaScript ne s'exécute ; ils conviennent aux couleurs, typographie, densité, bordures, styles d'état et détails responsives.

Manifest minimal

{
  "schema": "nie-sla-theme-v1",
  "id": "example-theme",
  "name": "Example Theme",
  "version": "1.0.0",
  "type": "theme",
  "mode": "css",
  "author": "Developer",
  "description": "A restrained NIE-SLA theme.",
  "license": "MIT",
  "styles": ["theme.css"],
  "files": ["manifest.json", "theme.css"]
}

schema est la constante de compatibilité actuelle des paquets de thèmes ; utilisez la valeur littérale nie-sla-theme-v1.

Règles de champs

Champ	Règle
id	3-49 lettres minuscules, chiffres ou tirets ; doit commencer par une lettre
version	SemVer, ex. 1.2.0 ou 2.0.0-beta.1
type	toujours theme
mode	css ; traité comme CSS quand omis
styles	1-4 fichiers .css du paquet, chargés dans l'ordre du tableau
files	recommandé ; doit correspondre exactement à tous les fichiers du ZIP
preview	optionnel ; pointe vers un PNG/JPEG/GIF/WebP/SVG du paquet
license	optionnel ; identifiant de style SPDX, ex. MIT, Apache-2.0
repository / homepage	optionnel ; URL HTTPS sans identifiants, jusqu'à 500 caractères

name et author sont plafonnés à 64 caractères, description à 240 et license à 32. Le système réserve des ID comme admin, api, classic, extensions, plugins et themes. Les champs inconnus ne deviennent pas des capacités d'exécution et ne permettent pas de demander des permissions de script via des champs personnalisés.

Scoping

Les règles du thème restent dans votre propre ID :

body[data-extension-theme="example-theme"] {
  --bg: #f5f8f7;
  --paper: #ffffff;
  --text: #13201e;
  --muted: #64736f;
  --line: #d7e0dd;
  --green: #087d71;
  --red: #d9503f;
  --yellow: #b7791f;
  --blue: #2563a8;
  --radius: 6px;
  --shadow: 0 10px 28px rgba(17, 39, 35, 0.08);
}

Surchargez les variables publiques de l'hôte au lieu de dépendre de nth-child profonds, de classes générées ou de la profondeur DOM courante. Une mise à jour de thème ne doit pas exiger de modifier les sources du frontend de production.

Les styles peuvent référencer polices et images du paquet ; les URL distantes sont soumises à la CSP du site et à la politique de chaîne d'approvisionnement, donc les vrais paquets doivent être autonomes.

Design et accessibilité

• Le contraste texte/fond atteint WCAG AA.
• L'état ne repose pas que sur la couleur ; conservez des différences de texte ou de forme.
• Ne masquez pas erreurs, focus, notes d'état ni contrôles critiques.
• Conservez un :focus-visible clair.
• Respectez prefers-reduced-motion.
• Les polices ont des replis locaux.
• Pas de débordement horizontal à 320, 375, 768, 1280 et 1440 pixels.
• Les longs noms de VPS, marchands, villes, lignes et étiquettes ne recouvrent pas les informations voisines.

Structure du paquet

manifest.json
theme.css
assets/
  display.woff2
preview.webp

Le manifest se trouve à la racine du ZIP ; ne l'enveloppez pas dans un dossier projet supplémentaire. Les chemins de ressources CSS relatifs restent dans le paquet et ne dépendent ni d'un CDN ni d'un serveur de dev. Les paquets d'exécution n'acceptent pas de LICENSE/NOTICE sans extension ni de Markdown ; conservez la licence complète dans le dépôt source et la page Release, et utilisez le champ license du manifest dans le ZIP.

Versionnage

• Correctifs de couleurs ou de mise en page : PATCH.
• Styles compatibles supplémentaires et nouvelles capacités optionnelles : MINOR.
• Sémantique d'interface existante changée ou nouvelle structure hôte exigée : MAJOR.

Avant d'activer, testez au moins l'installation, le désactivé par défaut, l'activation, la désactivation, la mise à niveau même ID et la suppression.

Vérifications locales

find dist -type f -print | LC_ALL=C sort
(cd dist && zip -X -r ../release/example-theme-1.0.0.zip .)
shasum -a 256 release/example-theme-1.0.0.zip

Téléverser une nouvelle version du même ID supprime l'ancienne révision et la maintient désactivée ; ce n'est pas un remplacement à chaud. Validez d'abord sur un déploiement de test, puis faites vérifier le SHA-256 par un administrateur avant d'activer.