Merge pull request 'ObsiGate 2.82.7 : barre v0.1.11 — marque monochrome, anneau avatar' (#56) from barre-v0111-2-82-7 into main

CHANGELOG.md

@@ -6,7 +6,7 @@ Format basé sur [Keep a Changelog](https://keepachangelog.com/fr/1.1.0/),
 et [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 > **En cours de développement** : les changements à venir sont listés dans la section
-> [Unreleased](#unreleased). La dernière version livrée est **2.82.6**.
+> [Unreleased](#unreleased). La dernière version livrée est **2.82.7**.
 
 ---
 
@@ -14,6 +14,11 @@ et [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ---
 
+## [2.82.7] — 2026-10-29
+
+- **Barre commune (dracodev-commons v0.1.11 vendangée)** : la marque de la barre n'est plus le logo rouge — c'est l'étoile Spark monochrome (`frontend/img/brand-spark.png`, servi en `/static/img/brand-spark.png`, 26 px), blanche sur barre foncée et noire sur barre claire : ObsiGate pose déjà `data-theme` sur `<html>` (sombre par défaut, mode persisté), donc la règle vendangée `[data-theme="dark"] .draco-bar .draco-brand-mark img { filter: none; }` s'applique directement et aucune surcharge propre n'est nécessaire. L'onglet Console Spark (et son entrée de menu, qui le clone) GARDE le logo rouge. Le bouton avatar Spark flottant bas-centre gagne un anneau rouge `#c00000` (bordure 3 px, `var(--agent)`), via le CSS vendangé.
+- **Pages concernées** : la barre est rendue en ligne dans `frontend/index.html` et dans sa copie de `frontend/recherche.html` — les deux sont portées à la v0.1.11 ; `frontend/draco-barre.css` remplacé verbatim par la v0.1.11, `frontend/draco-barre.js` inchangé (identique à commons, lui-même inchangé en v0.1.11). Le reste de l'intégration est inchangé. Précision : sur `/recherche`, copie statique, le bouton flottant y est visuel seulement, comme au lot précédent — l'ouverture du panneau vit dans la SPA.
+
 ## [2.82.6] — 2026-10-29
 
 - **Barre commune (dracodev-commons v0.1.10 vendangée)** : le rose Spark `#c2437e` disparaît de la barre — `--agent` passe au rouge Spark `#c00000` (échantillonné dans le logo Spark), l'onglet Console Spark passe à `--app #c00000`, et la marque ✦ devient le logo Spark (26 px). Le bouton « Spark » rose de la barre est supprimé, remplacé par le bouton avatar Spark flottant bas-centre (cercle personnage, `frontend/img/avatar-spark.png`, servi en `/static/img/avatar-spark.png`, `data-act="spark"` → panneau Spark de l'hôte, comme l'ancien bouton). Le bouton Alertes n'affiche plus que la cloche (pastille conservée), donc une barre plus étroite.

VERSION

@@ -1 +1 @@
-2.82.6
+2.82.7

frontend/draco-barre.css

@@ -10,6 +10,8 @@
    v0.1.10 : rose --agent → rouge Spark #c00000 ; marque = logo Spark ;
    bouton Spark supprimé (remplacé par l'avatar flottant bas-centre) ;
    Alertes icône seule.
+   v0.1.11 : marque = étoile Spark monochrome (blanche barre foncée,
+   noire barre claire) ; anneau rouge #c00000 autour de l'avatar flottant.
    Jetons repris du prototype validé Console v7.2.
    Thème : clair par défaut, sombre via [data-theme="dark"] sur <html>
    ou prefers-color-scheme si l'app intégratrice ne force rien. */
@@ -41,7 +43,14 @@
 .draco-brand:hover { background: var(--surface-2); }
 .draco-brand:focus-visible { outline: 2px solid var(--agent); outline-offset: 2px; }
 .draco-brand-mark { line-height: 0; }
-.draco-brand-mark img { width: 26px; height: 26px; border-radius: 8px; object-fit: cover; display: block; }
+/* Marque monochrome v0.1.11 : étoile blanche extraite du logo rouge,
+   fond transparent — noire sur barre claire (filtre), blanche sur
+   barre foncée (filtre annulé par les règles thème ci-dessous). */
+.draco-brand-mark img { width: 26px; height: 26px; object-fit: cover; display: block; filter: brightness(0); }
+@media (prefers-color-scheme: dark) {
+  .draco-bar .draco-brand-mark img { filter: none; }
+}
+[data-theme="dark"] .draco-bar .draco-brand-mark img { filter: none; }
 
 /* Menu des applications — construit par le JS depuis les onglets */
 .draco-apps-menu {
@@ -156,7 +165,7 @@
   border-radius: 50%; background: transparent; cursor: pointer;
   box-shadow: 0 8px 28px rgb(0 0 0 / .45);
 }
-.draco-spark-flottant img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; display: block; }
+.draco-spark-flottant img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; display: block; box-sizing: border-box; border: 3px solid var(--agent); }
 .draco-spark-flottant:hover { transform: translateX(-50%) scale(1.05); }
 .draco-spark-flottant:focus-visible { outline: 2px solid var(--agent); outline-offset: 3px; }
 

frontend/index.html

@@ -268,7 +268,7 @@
 
         <!-- Main Application (wrapped for show/hide) -->
         <!-- Barre d'apps commune dracodev — Fusion #215 (ACC-1.1).
-             Snippet FIGÉ vendangé depuis Projets/dracodev-commons v0.1.10
+             Snippet FIGÉ vendangé depuis Projets/dracodev-commons v0.1.11
              (ui/barre-apps/) : ne pas modifier la structure ici ; toute
              évolution passe par une nouvelle version de commons.
              CSS/JS : /static/draco-barre.css, /static/draco-barre.js.
@@ -280,6 +280,14 @@
              → logo Spark 26 px, bouton Spark rose supprimé (remplacé par
              l'avatar flottant bas-centre /static/img/avatar-spark.png,
              data-act="spark" → panneau Spark), Alertes = cloche seule.
+             v0.1.11 (2026-10-29) : marque → étoile Spark monochrome
+             /static/img/brand-spark.png 26 px (blanche sur barre foncée
+             via [data-theme="dark"] d'ObsiGate, noire sur barre claire
+             via le filtre brightness(0) du CSS vendangé — aucune
+             surcharge propre nécessaire, la barre suit déjà
+             data-theme) ; onglet agent GARDANT le logo rouge ;
+             anneau rouge #c00000 (bordure 3 px) autour de l'avatar
+             flottant, via le CSS vendangé.
              Chantier 5 (fusion #69/#71, sans bump) : 5e onglet Console Spark
              (data-app="agent", défaut prod ; la réécriture DRACO_URLS
              couvre la clé "agent" comme les autres onglets), après Kanbante ;
@@ -288,7 +296,7 @@
             <div class="draco-bar-zone draco-bar-gauche">
                 <button type="button" class="draco-icon-btn" data-act="rail" aria-label="Barre latérale">☰</button>
                 <a class="draco-brand" href="/" data-act="apps" aria-haspopup="true" aria-expanded="false" aria-label="dracodev — changer d&#39;application" title="Changer d&#39;application">
-                    <span class="draco-brand-mark"><img src="/static/img/logos/spark.png" alt="" width="26" height="26"></span><span class="draco-brand-name">dracodev</span>
+                    <span class="draco-brand-mark"><img src="/static/img/brand-spark.png" alt="" width="26" height="26"></span><span class="draco-brand-name">dracodev</span>
                 </a>
                 <nav class="draco-apptabs" aria-label="Applications">
                     <a class="draco-apptab" data-app="obsigate" href="https://og.dracodev.net/">

frontend/recherche.html

@@ -14,7 +14,7 @@
        retomberait sur les défauts prod (les jetons sont ignorés par
        le JS) — jamais d'URL inventée.
        La barre ci-dessous est une copie statique du snippet figé de
-       index.html (commons v0.1.10 + chantier 5 fusion #69/#71, sans
+       index.html (commons v0.1.11 + chantier 5 fusion #69/#71, sans
        bump) : les onglets sont des liens réels, le bouton central
        replace le curseur dans la boîte (recherche.js,
        clic data-act="palette"). Re-vendoring alignement recherche :
@@ -58,7 +58,7 @@
     <div class="draco-bar-zone draco-bar-gauche">
       <button type="button" class="draco-icon-btn" data-act="rail" aria-label="Barre latérale">☰</button>
       <a class="draco-brand" href="/" data-act="apps" aria-haspopup="true" aria-expanded="false" aria-label="dracodev — changer d'application" title="Changer d'application">
-        <span class="draco-brand-mark"><img src="/static/img/logos/spark.png" alt="" width="26" height="26"></span><span class="draco-brand-name">dracodev</span>
+        <span class="draco-brand-mark"><img src="/static/img/brand-spark.png" alt="" width="26" height="26"></span><span class="draco-brand-name">dracodev</span>
       </a>
       <nav class="draco-apptabs" aria-label="Applications">
         <a class="draco-apptab" data-app="obsigate" href="{{URL_OBSIGATE}}">

tests/test_draco_barre.py

@@ -37,13 +37,22 @@ def test_menu_des_applications_par_la_marque():
     # v0.1.3 : la marque ouvre le menu des applications
     # (changement d'app en mobile). v0.1.10 : la marque n'est plus
     # le glyphe ✦ à 24 px mais le logo Spark en img 26 px.
+    # v0.1.11 : la marque n'est plus le logo rouge mais l'étoile
+    # Spark monochrome (brand-spark.png) ; l'onglet agent, lui,
+    # garde le logo rouge.
     html = _index()
     assert 'data-act="apps"' in html
     js = (FRONTEND / "draco-barre.js").read_text(encoding="utf-8")
     assert "draco-apps-menu" in js
-    assert '<span class="draco-brand-mark"><img src="/static/img/logos/spark.png"' in html
+    assert '<span class="draco-brand-mark"><img src="/static/img/brand-spark.png"' in html
     assert ".draco-brand-mark img" in _css()
     assert "width: 26px" in _css()
+    assert "filter: brightness(0)" in _css()
+    assert '[data-theme="dark"] .draco-bar .draco-brand-mark img { filter: none; }' in _css()
+    assert 'data-icon="agent"><img src="/static/img/logos/spark.png"' in html
+    assert "border: 3px solid var(--agent)" in _css()
+    recherche = (FRONTEND / "recherche.html").read_text(encoding="utf-8")
+    assert '<span class="draco-brand-mark"><img src="/static/img/brand-spark.png"' in recherche
 
 
 def test_panneau_spark_integre_218():