Correction CSS Swup, types WS et création fichier de suivi

- Extraction de tous les styles inline en css/pages.css (chargé globalement)
  pour corriger le CSS cassé lors des navigations Swup
- Correction types WebSocket : proxmox_resources → resources_update
  et msg.data → msg.payload (format réel du hub Go)
- Ajout d'un fetch HTTP immédiat dans dashboardPage/proxmoxPage
  pour éviter l'attente du premier tick (10s) du polling WS
- Correction msg.payload pour les updates (update_output/done/error)
- Ajout class terminal-wrapper sur .main-layout de terminal.html
  pour le fullscreen height sans affecter les autres pages
- Création SUIVI.md : état d'implémentation vs instruction.md

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
enzo 2026-03-21 17:49:33 +01:00
parent a4b5b06f04
commit 9739dbaee8
11 changed files with 640 additions and 258 deletions

View file

@ -8,6 +8,7 @@
<link rel="stylesheet" href="/css/neu.css" />
<link rel="stylesheet" href="/css/dark.css" />
<link rel="stylesheet" href="/css/light.css" />
<link rel="stylesheet" href="/css/pages.css" />
<link rel="stylesheet" href="/css/xterm.css" />
<script src="/js/vendors/htmx.min.js"></script>
<script src="/js/vendors/swup.iife.js"></script>
@ -34,7 +35,7 @@
</nav>
</aside>
<div class="main-layout">
<div class="main-layout terminal-wrapper">
<nav class="navbar" x-data="navbar()" x-cloak>
<h2 class="navbar-title" x-text="t('nav.terminal')"></h2>
<div class="navbar-actions">
@ -57,17 +58,5 @@
</main>
</div>
<style>
[x-cloak]{display:none!important}
.main-layout{display:flex;flex-direction:column;flex:1;margin-left:var(--sidebar-width,240px);transition:margin-left .2s;height:100vh;overflow:hidden}
.terminal-layout{flex:1;display:flex;flex-direction:column;padding:0!important;overflow:hidden}
.terminal-toolbar{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;border-bottom:1px solid var(--neu-border);background:var(--neu-surface);flex-shrink:0}
.terminal-status{font-size:.8rem;font-family:monospace}
.terminal-status.connected{color:var(--neu-success)}
.terminal-status.disconnected,.terminal-status.error{color:var(--neu-danger)}
.terminal-status.connecting{color:var(--neu-text-muted)}
.terminal-container{flex:1;overflow:hidden;background:#1a1a2e;padding:.5rem}
.terminal-container .xterm{height:100%}
</style>
</body>
</html>