ObsiGate/frontend/recherche.html

<!DOCTYPE html>
<html lang="fr" data-theme="dark">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Rechercher partout — ObsiGate</title>
  <!-- Gabarit ObsiGate (chantier 2+3) : la page /recherche est servie
       hors SPA (route déclarée avant le catch-all, comme /admin.html),
       elle reprend donc les feuilles de l'app (style.css + barre) et
       la structure de index.html (barre de fusion, en-tête, sidebar,
       zone de contenu) au lieu de la page nue précédente.
       Jetons {{URL_*}} remplacés par la route /recherche (même contrat
       que le fragment de barre) ; servie brute via /static, la page
       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.6 + 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 :
       5e onglet Console Spark (data-app="agent", jeton {{URL_AGENT}}
       remplacé par la route /recherche comme les 4 autres) et
       icône SVG du bouton Alertes, repris d'index.html. Les menus,
       le panneau Spark, les alertes et le domaine restent des
       comportements de la SPA et ne sont pas rejoués ici.
       Sidebar statique (navigation de l'app) : les vaults, tags et
       récents dynamiques vivent dans la SPA, pas sur cette page. -->
  <link rel="stylesheet" href="/static/style.css">
  <link rel="stylesheet" href="/static/draco-barre.css">
  <link rel="stylesheet" href="/static/recherche.css">
</head>
<body class="has-draco-bar rp-og">
  <header class="draco-bar" data-current="obsigate">
    <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">✦</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}}">
          <span class="draco-apptab-ico" style="--app:#7a5af5">▤</span>
          <span class="draco-apptab-txt"><strong>ObsiGate</strong><small>Notes</small></span>
        </a>
        <a class="draco-apptab" data-app="flowdeck" href="{{URL_FLOWDECK}}">
          <span class="draco-apptab-ico" style="--app:#2f6fed">▦</span>
          <span class="draco-apptab-txt"><strong>Flowdeck</strong><small>Projets</small></span>
        </a>
        <a class="draco-apptab" data-app="tiktak" href="{{URL_TIKTAK}}">
          <span class="draco-apptab-ico" style="--app:#e8762c">✓</span>
          <span class="draco-apptab-txt"><strong>TikTak</strong><small>Tâches</small></span>
          <span class="draco-badge" data-badge="tiktak" hidden>0</span>
        </a>
        <a class="draco-apptab" data-app="kanbante" href="{{URL_KANBANTE}}">
          <span class="draco-apptab-ico" style="--app:#0d9488">▥</span>
          <span class="draco-apptab-txt"><strong>Kanbante</strong><small>Kanban</small></span>
          <span class="draco-badge" data-badge="kanbante" hidden>0</span>
        </a>
        <a class="draco-apptab" data-app="agent" href="{{URL_AGENT}}">
          <span class="draco-apptab-ico" style="--app:#c2437e">✦</span>
          <span class="draco-apptab-txt"><strong>Console Spark</strong><small>Agent commun</small></span>
        </a>
      </nav>
    </div>
    <div class="draco-bar-zone draco-bar-centre">
      <button type="button" class="draco-search" data-act="palette" aria-label="Rechercher partout (Ctrl+K)">
        <span class="draco-search-ico">⌕</span>
        <span class="draco-search-txt">Rechercher partout…</span>
        <kbd>⌘K</kbd>
      </button>
    </div>
    <div class="draco-bar-zone draco-bar-droite">
      <div class="draco-domaines" role="group" aria-label="Domaine">
        <span class="draco-domaines-lbl">Domaine</span>
        <button type="button" data-act="domaine" data-dom="pro">Pro</button>
        <button type="button" data-act="domaine" data-dom="famille">Famille</button>
        <button type="button" data-act="domaine" data-dom="perso">Perso</button>
      </div>
      <button type="button" class="draco-alertes" data-act="alertes" aria-label="Alertes unifiées">
        <svg viewBox="0 0 24 24" width="19" height="19" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9"/><path d="M10.3 21a1.94 1.94 0 0 0 3.4 0"/></svg>
        <span class="draco-alertes-txt">Alertes</span>
        <span class="draco-badge" data-badge="alertes" hidden>0</span>
      </button>
      <button type="button" class="draco-spark" data-act="spark" aria-label="Ouvrir Spark, l'agent commun">
        <span class="draco-spark-ico">✦</span><span class="draco-spark-txt">Spark</span>
        <span class="draco-badge" data-badge="spark" hidden>0</span>
      </button>
      <button type="button" class="draco-avatar" id="draco-avatar" data-act="compte" aria-label="Compte" aria-haspopup="menu" aria-expanded="false" title="">✦</button>
    </div>
  </header>
  <div id="app" class="app-container">
    <header class="header">
      <div class="header-left">
        <div class="header-logo">ObsiGate</div>
        <a href="/">Retour à l'application</a>
      </div>
    </header>
    <div class="main-body">
      <aside class="sidebar" id="sidebar" role="navigation" aria-label="Navigation ObsiGate">
        <nav class="rp-og-nav">
          <a href="/">Tableau de bord</a>
          <a href="/recherche" aria-current="page">Rechercher partout</a>
          <p class="rp-og-note">La navigation par vaults (fichiers, tags, récents) vit dans l'application ObsiGate.</p>
        </nav>
      </aside>
      <div class="content-wrapper">
        <div class="content-area">
          <main class="rp-page" id="recherche" data-host="obsigate"
                data-base-obsigate="{{URL_OBSIGATE}}"
                data-base-flowdeck="{{URL_FLOWDECK}}"
                data-base-tiktak="{{URL_TIKTAK}}"
                data-base-kanbante="{{URL_KANBANTE}}">
            <h1>Rechercher partout</h1>
            <p class="rp-hint">Notes ObsiGate, pages Flowdeck, tâches TikTak, cartes Kanbante — dans l'environnement courant (dev reste dev). « / » ou Ctrl+K pour rechercher, ↑/↓ puis Entrée pour ouvrir un résultat. « Tout voir » bascule vers l'onglet de l'application, sans quitter la page.</p>
            <div class="rp-form">
              <input id="rp-q" class="rp-input" type="search" name="q" value=""
                     placeholder="Rechercher partout…" autocomplete="off" autofocus>
            </div>
            <nav class="rp-tabs" role="tablist" aria-label="Résultats par application">
              <button type="button" class="rp-tab active" role="tab" aria-selected="true" data-rp-tab="all">Tout <span class="rp-tab-count"></span></button>
              <button type="button" class="rp-tab" role="tab" aria-selected="false" tabindex="-1" data-rp-tab="obsigate">ObsiGate <span class="rp-tab-count"></span></button>
              <button type="button" class="rp-tab" role="tab" aria-selected="false" tabindex="-1" data-rp-tab="flowdeck">Flowdeck <span class="rp-tab-count"></span></button>
              <button type="button" class="rp-tab" role="tab" aria-selected="false" tabindex="-1" data-rp-tab="tiktak">TikTak <span class="rp-tab-count"></span></button>
              <button type="button" class="rp-tab" role="tab" aria-selected="false" tabindex="-1" data-rp-tab="kanbante">Kanbante <span class="rp-tab-count"></span></button>
              <button type="button" class="rp-tab" role="tab" aria-selected="false" tabindex="-1" data-rp-tab="console">Console Spark <span class="rp-tab-count"></span></button>
            </nav>
            <section class="rp-section" data-rp-section="obsigate">
              <div class="rp-head"><h2>ObsiGate — notes</h2><span class="rp-count"></span><a class="rp-all" href="#">Tout voir</a></div>
              <div class="rp-body"><p class="rp-state">Tapez une recherche ci-dessus.</p></div>
            </section>
            <section class="rp-section" data-rp-section="flowdeck">
              <div class="rp-head"><h2>Flowdeck — pages</h2><span class="rp-count"></span><a class="rp-all" href="#">Tout voir</a></div>
              <div class="rp-body"><p class="rp-state">Tapez une recherche ci-dessus.</p></div>
            </section>
            <section class="rp-section" data-rp-section="tiktak">
              <div class="rp-head"><h2>TikTak — tâches</h2><span class="rp-count"></span><a class="rp-all" href="#">Tout voir</a></div>
              <div class="rp-body"><p class="rp-state">Tapez une recherche ci-dessus.</p></div>
            </section>
            <section class="rp-section" data-rp-section="kanbante">
              <div class="rp-head"><h2>Kanbante — cartes</h2><span class="rp-count"></span><a class="rp-all" href="#">Tout voir</a></div>
              <div class="rp-body"><p class="rp-state">Tapez une recherche ci-dessus.</p></div>
            </section>
            <section class="rp-section" data-rp-section="console">
              <div class="rp-head"><h2>Console Spark — discussions</h2><span class="rp-count"></span><a class="rp-all" href="#">Tout voir</a></div>
              <div class="rp-body"><p class="rp-state">Tapez une recherche ci-dessus.</p></div>
            </section>
          </main>
        </div>
      </div>
    </div>
  </div>
  <script src="/static/js/recherche.js"></script>
</body>
</html>