Files
ai-control/panel.html
T
marcus.hinz 165501c8f9 Panel: Clobber-Schutz, Content-Editor, Archiv-Reveal/Guard, Rechtschreib-Sprache
- register_mcp_server schreibt .claude.json nur bei fehlendem/abweichendem
  Eintrag (claudes Live-State nicht unnötig ueberschreiben).
- Content-Editor im Panel (Rohtext-Textarea): Cmd/Ctrl+Enter speichert via
  panel_set, Esc verwirft; eingehende Updates werden waehrend der Bearbeitung
  gepuffert (Button "geaendert"), Speichern gewinnt.
- Archivieren zeigt die Datei danach im Dateimanager (reveal_path_cmd, cfg pro
  OS). Breadth-Guard: Archiv-Ordner darf kein Home-Vorfahre sein, muss absolut
  sein; expand_home loest bare ~ auf.
- Rechtschreibpruefung: Default in settings.json (spellcheckLang "de"), pro
  Text per Selector ueberschreibbar.
2026-07-11 14:24:16 +02:00

238 lines
6.8 KiB
HTML

<!doctype html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<title>Entwurf</title>
<style>
html,
body {
height: 100%;
margin: 0;
background: #1e1e2e;
color: #cdd6f4;
overflow: hidden;
}
body {
display: flex;
flex-direction: column;
}
.panel-head {
flex: none;
display: flex;
flex-direction: column;
gap: 3px;
padding: 7px 8px 9px 14px;
background: #181825;
border-bottom: 1px solid #313244;
font:
500 12px/1 -apple-system,
system-ui,
sans-serif;
user-select: none;
-webkit-user-select: none;
}
.panel-titlerow {
display: flex;
align-items: center;
gap: 2px;
min-width: 0;
}
.panel-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 2px;
}
.panel-title {
flex: 0 1 auto;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #a6adc8;
}
.panel-title[contenteditable="true"] {
overflow: visible;
text-overflow: clip;
outline: none;
color: inherit;
cursor: text;
}
.panel-btn {
border: none;
background: transparent;
color: #a6adc8;
cursor: default;
border-radius: 6px;
padding: 6px 9px;
font: inherit;
display: flex;
align-items: center;
}
.panel-btn:hover {
background: #313244;
color: #cdd6f4;
}
.panel-btn.copied {
color: #a6e3a1;
}
.panel-btn.error {
color: #f38ba8;
}
.panel-btn svg {
display: block;
stroke: currentColor;
stroke-width: 1.3;
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
}
.panel-btn.active {
background: #313244;
color: #cdd6f4;
}
.panel-btn.changed {
color: #f9e2af;
}
.panel-editor {
flex: 1;
min-height: 0;
resize: none;
border: none;
outline: none;
padding: 16px 20px;
background: transparent;
color: inherit;
font-family: "JetBrains Mono", Menlo, monospace;
font-size: 12px;
line-height: 1.55;
}
.panel-editor[hidden] {
display: none;
}
.panel-lang {
margin-right: auto;
background: #313244;
color: #a6adc8;
border: none;
border-radius: 6px;
padding: 3px 4px;
font: inherit;
font-size: 11px;
cursor: default;
}
#panel-content {
flex: 1;
min-height: 0;
overflow: auto;
padding: 16px 20px;
user-select: text;
-webkit-user-select: text;
cursor: text;
font-size: 13px;
line-height: 1.55;
}
#panel-content::-webkit-scrollbar {
width: 8px;
}
#panel-content::-webkit-scrollbar-thumb {
background: #313244;
border-radius: 4px;
}
#panel-content.raw {
white-space: pre-wrap;
word-break: break-word;
font-family: "JetBrains Mono", Menlo, monospace;
font-size: 12px;
}
#panel-content.md h1,
#panel-content.md h2,
#panel-content.md h3 {
line-height: 1.25;
margin: 1em 0 0.4em;
}
#panel-content.md h1 {
font-size: 1.4em;
}
#panel-content.md h2 {
font-size: 1.2em;
}
#panel-content.md h3 {
font-size: 1.05em;
}
#panel-content.md :first-child {
margin-top: 0;
}
#panel-content.md p,
#panel-content.md ul,
#panel-content.md ol,
#panel-content.md pre,
#panel-content.md blockquote {
margin: 0 0 0.7em;
}
#panel-content.md code {
font-family: "JetBrains Mono", Menlo, monospace;
font-size: 0.9em;
background: #313244;
border-radius: 4px;
padding: 1px 5px;
}
#panel-content.md pre {
background: #11111b;
border-radius: 8px;
padding: 12px 14px;
overflow: auto;
}
#panel-content.md pre code {
background: none;
padding: 0;
}
#panel-content.md blockquote {
border-left: 3px solid #313244;
padding-left: 12px;
color: #a6adc8;
}
#panel-content.md a {
color: #89b4fa;
}
</style>
</head>
<body>
<div class="panel-head">
<div class="panel-titlerow" data-tauri-drag-region>
<span class="panel-title">Entwurf</span>
<button class="panel-btn panel-edit" id="panel-title-edit" title="Titel bearbeiten"></button>
</div>
<div class="panel-actions">
<select class="panel-lang" id="panel-lang" title="Sprache der Rechtschreibprüfung">
<option value="de">DE</option>
<option value="en">EN</option>
<option value="en-GB">EN-GB</option>
<option value="fr">FR</option>
<option value="es">ES</option>
<option value="it">IT</option>
<option value="nl">NL</option>
</select>
<button class="panel-btn" id="panel-mode" title="Rohtext / gerendert">MD</button>
<button class="panel-btn" id="panel-content-edit" title="Entwurf bearbeiten (Cmd/Ctrl+Enter speichert, Esc verwirft)">
<svg width="14" height="14" viewBox="0 0 16 16"><path d="M10.8 2.6 13.4 5.2 6 12.6l-3.1.5.5-3.1z" /><path d="M9.7 3.7 12.3 6.3" /></svg>
</button>
<button class="panel-btn" id="panel-copy" title="In die Zwischenablage kopieren">
<svg width="14" height="14" viewBox="0 0 16 16"><rect x="5.5" y="5.5" width="8" height="8" rx="1.5" /><path d="M10.5 3.2V3A1.5 1.5 0 0 0 9 1.5H3A1.5 1.5 0 0 0 1.5 3v6A1.5 1.5 0 0 0 3 10.5h.2" /></svg>
</button>
<button class="panel-btn" id="panel-archive" title="In den Archiv-Ordner speichern">
<svg width="14" height="14" viewBox="0 0 16 16"><rect x="1.5" y="2.5" width="13" height="3.5" rx="1" /><path d="M2.8 6v6.5a1 1 0 0 0 1 1h8.4a1 1 0 0 0 1-1V6" /><path d="M6.3 9h3.4" /></svg>
</button>
<button class="panel-btn" id="panel-dock" title="Wieder andocken">
<svg width="14" height="14" viewBox="0 0 16 16"><rect x="1.5" y="2.5" width="13" height="11" rx="1.5" /><path d="M9.5 2.5v11" /><path d="M4 8h3.4M6 6.2 7.8 8 6 9.8" /></svg>
</button>
<button class="panel-btn" id="panel-close" title="Panel schließen">
<svg width="12" height="12" viewBox="0 0 12 12"><path d="M3 3l6 6M9 3l-6 6" /></svg>
</button>
</div>
</div>
<div id="panel-content" class="md"></div>
<script type="module" src="/src/panel.ts"></script>
</body>
</html>