eff90e9517
- Thunderbird Auto-Update: update_url im Manifest, updates.json, release.sh - .xpi neu gebaut (mit update_url, ohne defaults.local.json/Token) - README + CLAUDE.md: Auto-Update-Doku, Repo muss public bleiben - web-editor/ (Node/Docker WYSIWYG-Editor) hinzugefügt - gitea-sync.js + templates_options: bestehende Anpassungen Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
152 lines
6.1 KiB
HTML
152 lines
6.1 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<title>HPS Vorlagen & Signaturen</title>
|
||
<link rel="stylesheet" href="style.css" />
|
||
<link rel="icon" href="logo.svg" />
|
||
</head>
|
||
<body>
|
||
<!-- ── Topbar ── -->
|
||
<header class="topbar">
|
||
<div class="brand">
|
||
<span class="brand-logo"><img src="logo.svg" alt="Hotel Park Soltau" /></span>
|
||
<span class="brand-divider" aria-hidden="true"></span>
|
||
<span class="brand-title">Vorlagen & Signaturen</span>
|
||
</div>
|
||
<div class="topbar-right">
|
||
<span id="status-pill" class="status-pill status-unknown" title="Verbindungsstatus">
|
||
<span class="status-dot"></span>
|
||
<span id="status-text">Verbinde…</span>
|
||
</span>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- ── Config-Banner ── -->
|
||
<div id="config-banner" class="config-banner" hidden>
|
||
<strong>Verbindung nicht konfiguriert.</strong>
|
||
<span>
|
||
Bitte die Umgebungsvariablen <code>GITEA_URL</code>, <code>GITEA_OWNER</code>,
|
||
<code>GITEA_REPO</code> und <code>GITEA_TOKEN</code> setzen (siehe <code>.env.example</code>)
|
||
und den Dienst neu starten.
|
||
</span>
|
||
</div>
|
||
|
||
<!-- ── App ── -->
|
||
<div class="app">
|
||
<!-- Kategorie-Tabs -->
|
||
<nav class="cat-tabs" role="tablist">
|
||
<button class="cat-tab is-active" data-cat="templates" role="tab">
|
||
<span class="cat-ico">📄</span> Vorlagen
|
||
</button>
|
||
<button class="cat-tab" data-cat="footers" role="tab">
|
||
<span class="cat-ico">📜</span> Fußzeilen
|
||
</button>
|
||
<button class="cat-tab" data-cat="headers" role="tab">
|
||
<span class="cat-ico">✍️</span> Signaturen
|
||
</button>
|
||
<span class="cat-spacer"></span>
|
||
<button id="btn-refresh" class="icon-btn" title="Liste neu laden">⟳</button>
|
||
</nav>
|
||
|
||
<div class="workspace">
|
||
<!-- Listen-Spalte -->
|
||
<aside class="listpane">
|
||
<div class="listpane-head">
|
||
<input type="search" id="tree-search" class="tree-search" placeholder="Suchen…" autocomplete="off" />
|
||
<button id="btn-list-add" class="btn btn-primary btn-sm">＋ Neu</button>
|
||
</div>
|
||
<div id="list-body" class="list-body"></div>
|
||
</aside>
|
||
|
||
<!-- Editor-Spalte -->
|
||
<main class="editorpane">
|
||
<!-- Leerzustand -->
|
||
<div class="empty-state" id="empty-state">
|
||
<div class="empty-illu" aria-hidden="true">
|
||
<svg viewBox="0 0 24 24" width="64" height="64" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M4 4h11l5 5v11a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1Z"/>
|
||
<path d="M14 4v5h5"/><path d="M8 13h8"/><path d="M8 17h5"/>
|
||
</svg>
|
||
</div>
|
||
<h2>Wähle links einen Eintrag</h2>
|
||
<p>Vorlage, Fußzeile oder Signatur anklicken zum Bearbeiten – oder über <strong>＋ Neu</strong> einen neuen Eintrag anlegen.</p>
|
||
</div>
|
||
|
||
<!-- Editor -->
|
||
<div class="editor-panel" id="editor-panel" hidden>
|
||
<div class="editor-head">
|
||
<div class="editor-titles">
|
||
<h2 id="file-friendly">—</h2>
|
||
<code id="file-path" class="file-path">—</code>
|
||
</div>
|
||
<div class="editor-head-actions">
|
||
<span id="dirty-badge" class="dirty-badge" hidden>Nicht gespeichert</span>
|
||
<button class="btn btn-ghost" id="btn-reload" title="Vom Server neu laden">Neu laden</button>
|
||
<button class="btn btn-danger-ghost" id="btn-delete">Löschen</button>
|
||
<button class="btn btn-primary" id="btn-save">Speichern</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="editor-tabs" role="tablist">
|
||
<button class="editor-tab is-active" id="tab-visual" data-view="visual" role="tab">Bearbeiten</button>
|
||
<button class="editor-tab" id="tab-html" data-view="html" role="tab">HTML</button>
|
||
<button class="editor-tab" id="tab-preview" data-view="preview" role="tab">Vorschau</button>
|
||
</div>
|
||
|
||
<div class="editor-body">
|
||
<div class="epane" id="pane-visual">
|
||
<textarea id="visual-editor"></textarea>
|
||
</div>
|
||
<div class="epane" id="pane-html" hidden>
|
||
<textarea class="html-editor" id="html-editor" spellcheck="false" wrap="soft"></textarea>
|
||
</div>
|
||
<div class="epane" id="pane-preview" hidden>
|
||
<div class="preview-frame-wrap">
|
||
<iframe class="preview-frame" id="preview-frame" title="Vorschau" sandbox=""></iframe>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ── Toasts ── -->
|
||
<div class="toast-stack" id="toast-stack" aria-live="polite"></div>
|
||
|
||
<!-- ── Lade-Overlay ── -->
|
||
<div class="loading-overlay" id="loading-overlay" hidden>
|
||
<div class="spinner" aria-label="Lädt"></div>
|
||
</div>
|
||
|
||
<!-- ── Confirm-Modal ── -->
|
||
<div class="modal-backdrop" id="confirm-backdrop" hidden>
|
||
<div class="modal" role="dialog" aria-modal="true" aria-labelledby="confirm-title">
|
||
<h3 id="confirm-title">Bestätigen</h3>
|
||
<p id="confirm-message">Bist du sicher?</p>
|
||
<div class="modal-actions">
|
||
<button class="btn btn-ghost" id="confirm-cancel">Abbrechen</button>
|
||
<button class="btn btn-danger" id="confirm-ok">Bestätigen</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ── Prompt-Modal ── -->
|
||
<div class="modal-backdrop" id="prompt-backdrop" hidden>
|
||
<form class="modal" id="prompt-form" role="dialog" aria-modal="true" aria-labelledby="prompt-title">
|
||
<h3 id="prompt-title">Eingabe</h3>
|
||
<div id="prompt-fields"></div>
|
||
<div class="modal-actions">
|
||
<button type="button" class="btn btn-ghost" id="prompt-cancel">Abbrechen</button>
|
||
<button type="submit" class="btn btn-primary" id="prompt-ok">OK</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
<script src="/vendor/tinymce/tinymce.min.js"></script>
|
||
<script src="app.js"></script>
|
||
</body>
|
||
</html>
|