clupilot/templates/akutell/Site Details.html

392 lines
33 KiB
HTML

<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>CluPilot — Site Details</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="clupilot.css">
<style>
/* ---- site header ---- */
.site-hero{display:flex;align-items:center;gap:14px}
.site-hero .favicon{width:42px;height:42px;border-radius:11px;font-size:16px}
.site-hero h1{margin:0;font-size:18px;font-weight:600;letter-spacing:-0.02em}
.site-hero .sub{font-family:var(--mono);font-size:11.5px;color:var(--muted);margin-top:3px;display:flex;gap:10px;flex-wrap:wrap}
/* ---- detail tab bar ---- */
.dtabs{display:flex;gap:3px;padding:5px;border-radius:15px;overflow-x:auto;
background:var(--glass-strong);backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);
border:1px solid var(--glass-border);box-shadow:var(--glass-shadow), var(--glass-inset)}
.dtab{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:10px;color:#3a3a47;font-weight:600;font-size:12.5px;white-space:nowrap;transition:all .15s}
.dtab:hover{background:rgba(255,255,255,0.55)}
.dtab.active{color:var(--fg);background:linear-gradient(180deg,#fff,rgba(255,255,255,0.8));box-shadow:0 4px 12px -5px rgba(40,52,92,0.3)}
.dtab .ico{width:16px;height:16px;color:var(--muted)}
.dtab.active .ico{color:var(--accent)}
.dtab .count{font-family:var(--mono);font-size:10px;background:rgba(30,35,60,0.08);padding:1px 6px;border-radius:8px;color:var(--muted)}
.pane{display:none}
.pane.active{display:flex;flex-direction:column;gap:18px;animation:fade .25s ease}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* ---- file manager ---- */
.fm{display:grid;grid-template-columns:268px 1fr;gap:18px;align-items:start}
.tree{padding:10px;max-height:600px;overflow:auto}
.tree-head{display:flex;align-items:center;justify-content:space-between;padding:6px 8px 10px;border-bottom:1px solid var(--hairline);margin-bottom:6px}
.tree-head .path{font-family:var(--mono);font-size:11px;color:var(--muted)}
.tree-item{display:flex;align-items:center;gap:8px;padding:6px 9px;border-radius:8px;font-size:12.5px;cursor:pointer;font-family:var(--mono);color:#3a3a47;white-space:nowrap;transition:background .12s}
.tree-item:hover{background:rgba(255,255,255,0.6)}
.tree-item.active{background:var(--accent-soft);color:var(--accent)}
.tree-item .ti-ico{width:15px;height:15px;flex:none;color:var(--muted-2)}
.tree-item.dir{font-weight:600;color:var(--fg)}
.tree-item.active .ti-ico{color:var(--accent)}
.tree-children{margin-left:9px;border-left:1px solid var(--hairline);padding-left:5px}
.tree-children.collapsed{display:none}
.chev{transition:transform .15s;color:var(--muted-2)}
.tree-item.open .chev{transform:rotate(90deg)}
.editor{display:flex;flex-direction:column;height:600px;overflow:hidden}
.editor-head{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--hairline)}
.crumb{font-family:var(--mono);font-size:12px;color:var(--muted);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crumb b{color:var(--fg)}
.editor-tagline{font-family:var(--mono);font-size:10.5px;color:var(--muted-2)}
.code-wrap{flex:1;display:flex;overflow:hidden;background:rgba(255,255,255,0.35)}
.gutter{padding:14px 0;text-align:right;color:var(--muted-2);background:rgba(30,35,60,0.04);user-select:none;font-family:var(--mono);font-size:12px;line-height:1.65;border-right:1px solid var(--hairline);overflow:hidden}
.gutter div{padding:0 11px}
.code-area{flex:1;border:0;outline:0;resize:none;padding:14px 16px;font-family:var(--mono);font-size:12.5px;line-height:1.65;background:transparent;color:var(--fg);white-space:pre;overflow:auto;tab-size:4}
.editor-foot{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;border-top:1px solid var(--hairline)}
.editor-empty{flex:1;display:grid;place-items:center;color:var(--muted-2);font-family:var(--mono);font-size:12px;text-align:center;gap:10px;padding:40px}
/* ---- console / logs ---- */
.console{border-radius:var(--radius);background:linear-gradient(180deg,rgba(24,26,42,0.96),rgba(17,19,32,0.96));border:1px solid rgba(255,255,255,0.09);padding:6px 0;font-family:var(--mono);font-size:12px;line-height:1.7;color:#cfd3e6;max-height:540px;overflow:auto;box-shadow:inset 0 1px 0 rgba(255,255,255,0.06), 0 10px 34px -10px rgba(40,52,92,0.3)}
.log-line{display:flex;gap:12px;padding:1px 16px;white-space:pre-wrap}
.log-line:hover{background:rgba(255,255,255,0.04)}
.log-time{color:#6b7191;flex:none}
.log-lvl{font-weight:600;flex:none;width:50px}
.lvl-INFO{color:#5aa9ff}.lvl-WARN{color:#e7b94e}.lvl-ERROR{color:#ff7373}.lvl-OK{color:#4cd6a0}.lvl-DEBUG{color:#a98bff}
.log-msg{color:#cfd3e6}
.console::-webkit-scrollbar{width:9px}.console::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.14);border-radius:5px}
.switch-line{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--muted);font-weight:500;cursor:pointer}
/* settings two-column forms */
.set-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 26px}
@media (max-width:1100px){.fm{grid-template-columns:1fr}.set-grid{grid-template-columns:1fr}}
</style>
</head>
<body>
<div class="app">
<aside class="sidebar" data-screen-label="Sidebar">
<div class="brand"><div class="brand-mark" aria-hidden="true"></div><div class="brand-name">CluPilot<span>v2.4</span></div></div>
<button class="ws-switch" aria-label="Workspace wechseln">
<div class="ws-avatar">AC</div>
<div class="ws-meta"><div class="ws-name">Acme Cluster</div><div class="ws-plan">team · 14 user</div></div>
<svg class="ws-chev" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M8 9l4-4 4 4M8 15l4 4 4-4"/></svg>
</button>
<nav class="nav">
<a class="nav-item" href="CluPilot Dashboard Glass.html"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><rect x="3" y="3" width="7" height="9" rx="1.5"/><rect x="14" y="3" width="7" height="5" rx="1.5"/><rect x="14" y="12" width="7" height="9" rx="1.5"/><rect x="3" y="16" width="7" height="5" rx="1.5"/></svg><span>Dashboard</span></a>
<a class="nav-item" href="Server.html"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><rect x="3" y="4" width="18" height="7" rx="1.5"/><rect x="3" y="13" width="18" height="7" rx="1.5"/><circle cx="7" cy="7.5" r="0.7" fill="currentColor"/><circle cx="7" cy="16.5" r="0.7" fill="currentColor"/></svg><span>Server</span><span class="count">6</span></a>
<a class="nav-item active" href="Sites.html"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><circle cx="12" cy="12" r="9"/><path d="M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18"/></svg><span>Sites</span><span class="count">87</span></a>
<a class="nav-item" href="Backups.html"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M21 12c0 5-9 9-9 9s-9-4-9-9V5l9-3 9 3v7z"/><path d="M9 11l2 2 4-4"/></svg><span>Backups</span></a>
<a class="nav-item" href="Sicherheit.html"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M12 3l8 4v5c0 5-3.5 8-8 9-4.5-1-8-4-8-9V7l8-4z"/></svg><span>Sicherheit</span><span class="count" style="color:var(--warning);background:var(--warning-soft);border-color:rgba(194,130,15,0.3)">3</span></a>
<div class="nav-title">Konto</div>
<a class="nav-item" href="Team.html"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.9M16 3.1a4 4 0 0 1 0 7.8"/></svg><span>Team</span></a>
<a class="nav-item" href="Einstellungen.html"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.1a1.7 1.7 0 0 0-1.1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1A1.7 1.7 0 0 0 4.6 9a1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3H9a1.7 1.7 0 0 0 1-1.5V3a2 2 0 1 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8V9a1.7 1.7 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1z"/></svg><span>Einstellungen</span></a>
</nav>
<div class="plan-box">
<div class="plan-row"><div class="plan-name">Team Plan</div><div class="plan-tag">PRO</div></div>
<div class="plan-meter"><span></span></div>
<div class="plan-stats"><span>87 / 140 sites</span><span>62%</span></div>
</div>
</aside>
<main class="main" data-screen-label="Site Details">
<!-- topbar -->
<div class="topbar">
<a class="icon-btn" href="Sites.html" aria-label="Zurück zu Sites">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M15 18l-6-6 6-6"/></svg>
</a>
<div class="site-hero">
<div class="favicon" style="background:#15a06a">S</div>
<div>
<h1>shop.bergmann-coffee.com</h1>
<div class="sub"><span>eu-prod-01</span><span>· wp 6.4.3</span><span>· php 8.1</span><span>· ssl ✓</span></div>
</div>
</div>
<span class="status-chip"><span class="pulse-dot"></span> online</span>
<div class="top-spacer"></div>
<button class="btn-ghost"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 3h7v7M21 3l-9 9M19 14v5a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2h5"/></svg>Besuchen</button>
<button class="btn-primary"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 17l5-5-5-5M13 19h7"/></svg>WP-Admin</button>
</div>
<div class="content">
<!-- detail tabs -->
<div class="dtabs" id="dtabs">
<button class="dtab active" data-tab="overview"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9"><rect x="3" y="3" width="7" height="7" rx="1.5"/><rect x="14" y="3" width="7" height="7" rx="1.5"/><rect x="3" y="14" width="7" height="7" rx="1.5"/><rect x="14" y="14" width="7" height="7" rx="1.5"/></svg>Übersicht</button>
<button class="dtab" data-tab="wp"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9"><circle cx="12" cy="12" r="9"/><path d="M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18"/></svg>WordPress</button>
<button class="dtab" data-tab="php"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9"><path d="M4 7h16M4 12h16M4 17h10"/></svg>PHP / ini</button>
<button class="dtab" data-tab="files"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9"><path d="M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/></svg>Datei-Manager</button>
<button class="dtab" data-tab="cron"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg>Cronjobs<span class="count">5</span></button>
<button class="dtab" data-tab="logs"><svg class="ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9"><path d="M4 5h16M4 10h16M4 15h10M4 20h7"/></svg>Logs</button>
</div>
<!-- ============ ÜBERSICHT ============ -->
<div class="pane active" id="tab-overview">
<div class="metrics">
<div class="metric"><div class="metric-top"><div class="metric-label">Besucher / 24h</div><div class="m-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/></svg></div></div><div class="metric-value">48,7<span class="sub">k</span></div><div class="metric-delta"><span class="chg up">↑ 9,2%</span> vs. gestern</div></div>
<div class="metric"><div class="metric-top"><div class="metric-label">Speicher</div><div class="m-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><ellipse cx="12" cy="6" rx="8" ry="3"/><path d="M4 6v12c0 1.7 3.6 3 8 3s8-1.3 8-3V6"/></svg></div></div><div class="metric-value">14,2<span class="sub">/ 40 GB</span></div><div class="metric-delta"><span class="chg">36%</span> belegt</div></div>
<div class="metric"><div class="metric-top"><div class="metric-label">PageSpeed</div><div class="m-ico success"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 3a9 9 0 1 0 9 9M12 12l5-5"/></svg></div></div><div class="metric-value">92<span class="sub">/ 100</span></div><div class="metric-delta"><span class="chg up">core web vitals ✓</span></div></div>
<div class="metric"><div class="metric-top"><div class="metric-label">Updates</div><div class="m-ico warning"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 12a9 9 0 1 1-3-6.7M21 4v5h-5"/></svg></div></div><div class="metric-value">3</div><div class="metric-delta"><span class="chg warn">1 core</span> · 2 plugins</div></div>
</div>
<div class="grid-2">
<section class="card">
<div class="card-head"><h3>Installation</h3></div>
<div class="card-body">
<div class="kv"><span class="k">Primäre Domain</span><span class="v">shop.bergmann-coffee.com</span></div>
<div class="kv"><span class="k">Dokument-Root</span><span class="v">/var/www/bergmann/htdocs</span></div>
<div class="kv"><span class="k">WordPress</span><span class="v">6.4.3</span></div>
<div class="kv"><span class="k">PHP</span><span class="v">8.1.27 · FPM</span></div>
<div class="kv"><span class="k">Datenbank</span><span class="v">MariaDB 10.11 · 312 MB</span></div>
<div class="kv"><span class="k">SSL</span><span class="v">Let's Encrypt · 54 t</span></div>
<div class="kv"><span class="k">Aktives Theme</span><span class="v">Storefront Child</span></div>
</div>
</section>
<section class="card">
<div class="card-head"><h3>Schnellaktionen</h3></div>
<div class="card-body" style="padding-top:4px">
<div class="toggle-row"><div class="tr-body"><div class="tr-title">Wartungsmodus</div><div class="tr-desc">site für besucher sperren</div></div><div class="toggle"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">Objekt-Cache (Redis)</div><div class="tr-desc">datenbankabfragen zwischenspeichern</div></div><div class="toggle on"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">Edge-CDN</div><div class="tr-desc">statische inhalte global cachen</div></div><div class="toggle on"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">HTTPS erzwingen</div><div class="tr-desc">alle anfragen auf ssl umleiten</div></div><div class="toggle on"></div></div>
</div>
</section>
</div>
</div>
<!-- ============ WORDPRESS ============ -->
<div class="pane" id="tab-wp">
<section class="card">
<div class="card-head"><h3><svg class="hico" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 7h16M4 12h16M4 17h10"/></svg>wp-config.php</h3><span class="meta">/htdocs/wp-config.php</span></div>
<div class="card-body">
<div class="set-grid">
<div class="field"><label>Tabellen-Präfix</label><input class="input input-mono" value="wp_bg_" /></div>
<div class="field"><label>WP_MEMORY_LIMIT</label><div class="input-group"><input class="input-mono" value="256" style="font-family:var(--mono)"/><span class="suffix">MB</span></div></div>
<div class="field"><label>WP_MAX_MEMORY_LIMIT</label><div class="input-group"><input class="input-mono" value="512" style="font-family:var(--mono)"/><span class="suffix">MB</span></div></div>
<div class="field"><label>AUTOSAVE_INTERVAL</label><div class="input-group"><input class="input-mono" value="60" style="font-family:var(--mono)"/><span class="suffix">sek</span></div></div>
<div class="field"><label>WP_POST_REVISIONS</label><input class="input input-mono" value="10" /></div>
<div class="field"><label>Sprache (WPLANG)</label><input class="input input-mono" value="de_DE" /></div>
</div>
<div style="margin-top:8px">
<div class="toggle-row"><div class="tr-body"><div class="tr-title">WP_DEBUG</div><div class="tr-desc">debug-modus &amp; fehlerprotokoll</div></div><div class="toggle"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">WP_CACHE</div><div class="tr-desc">persistentes caching aktiv</div></div><div class="toggle on"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">DISALLOW_FILE_EDIT</div><div class="tr-desc">datei-editor im wp-admin sperren</div></div><div class="toggle on"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">AUTOMATIC_UPDATER_DISABLED</div><div class="tr-desc">automatische core-updates deaktiviert</div></div><div class="toggle"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">FORCE_SSL_ADMIN</div><div class="tr-desc">wp-admin nur über https</div></div><div class="toggle on"></div></div>
</div>
</div>
<div class="form-actions"><button class="btn-ghost">In Editor öffnen</button><button class="btn-primary">wp-config speichern</button></div>
</section>
<div class="grid-2">
<section class="card">
<div class="card-head"><h3>Datenbank</h3><span class="pill success">verbunden</span></div>
<div class="card-body">
<div class="field"><label>DB_NAME</label><input class="input input-mono" value="bergmann_prod" /></div>
<div class="field"><label>DB_USER</label><input class="input input-mono" value="bergmann_wp" /></div>
<div class="field"><label>DB_HOST</label><input class="input input-mono" value="127.0.0.1:3306" /></div>
<div class="field" style="margin-bottom:0"><label>DB_PASSWORD</label><div class="input-group"><input class="input-mono" type="password" value="************" style="font-family:var(--mono)"/><span class="suffix" style="cursor:pointer">anzeigen</span></div></div>
</div>
</section>
<section class="card">
<div class="card-head"><h3>Sicherheits-Schlüssel (Salts)</h3></div>
<div class="card-body">
<p class="tr-desc" style="margin:0 0 14px">AUTH_KEY, SECURE_AUTH_KEY, LOGGED_IN_KEY, NONCE_KEY &amp; zugehörige Salts. Neu generieren meldet alle Benutzer ab.</p>
<div class="kv"><span class="k">Zuletzt rotiert</span><span class="v">14.03.2026</span></div>
<div class="kv"><span class="k">Schlüssel-Länge</span><span class="v">64 zeichen</span></div>
<div class="kv" style="border-bottom:0"><span class="k">Status</span><span class="v" style="color:var(--success)">stark</span></div>
</div>
<div class="form-actions"><button class="btn-ghost" style="color:var(--warning);border-color:rgba(194,130,15,0.35)">Salts neu generieren</button></div>
</section>
</div>
<section class="card">
<div class="card-head"><h3>Allgemeine WordPress-Einstellungen</h3></div>
<div class="card-body">
<div class="set-grid">
<div class="field"><label>Seitentitel</label><input class="input" value="Bergmann Coffee Shop" /></div>
<div class="field"><label>Untertitel</label><input class="input" value="Rösterei &amp; Onlineshop" /></div>
<div class="field"><label>WordPress-Adresse (URL)</label><input class="input input-mono" value="https://shop.bergmann-coffee.com" /></div>
<div class="field"><label>Permalink-Struktur</label><input class="input input-mono" value="/%postname%/" /></div>
</div>
<div style="margin-top:8px">
<div class="toggle-row"><div class="tr-body"><div class="tr-title">Suchmaschinen-Sichtbarkeit</div><div class="tr-desc">von google &amp; co. indexieren lassen</div></div><div class="toggle on"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">Registrierung erlauben</div><div class="tr-desc">neue benutzer können sich registrieren</div></div><div class="toggle"></div></div>
</div>
</div>
<div class="form-actions"><button class="btn-primary">Einstellungen speichern</button></div>
</section>
</div>
<!-- ============ PHP / INI ============ -->
<div class="pane" id="tab-php">
<section class="card">
<div class="card-head"><h3><svg class="hico" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 7h16M4 12h16M4 17h10"/></svg>php.ini</h3><span class="meta">php 8.1 · fpm pool: bergmann</span></div>
<div class="card-body">
<div class="set-grid">
<div class="field"><label>memory_limit</label><div class="input-group"><input class="input-mono" value="256" style="font-family:var(--mono)"/><span class="suffix">M</span></div></div>
<div class="field"><label>max_execution_time</label><div class="input-group"><input class="input-mono" value="120" style="font-family:var(--mono)"/><span class="suffix">sek</span></div></div>
<div class="field"><label>upload_max_filesize</label><div class="input-group"><input class="input-mono" value="128" style="font-family:var(--mono)"/><span class="suffix">M</span></div></div>
<div class="field"><label>post_max_size</label><div class="input-group"><input class="input-mono" value="128" style="font-family:var(--mono)"/><span class="suffix">M</span></div></div>
<div class="field"><label>max_input_vars</label><input class="input input-mono" value="3000" /></div>
<div class="field"><label>max_input_time</label><div class="input-group"><input class="input-mono" value="120" style="font-family:var(--mono)"/><span class="suffix">sek</span></div></div>
<div class="field"><label>default_charset</label><input class="input input-mono" value="UTF-8" /></div>
<div class="field"><label>date.timezone</label><input class="input input-mono" value="Europe/Berlin" /></div>
</div>
<div style="margin-top:8px">
<div class="toggle-row"><div class="tr-body"><div class="tr-title">display_errors</div><div class="tr-desc">php-fehler im browser anzeigen (nur dev)</div></div><div class="toggle"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">opcache.enable</div><div class="tr-desc">bytecode-cache aktiv</div></div><div class="toggle on"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">log_errors</div><div class="tr-desc">fehler in error.log schreiben</div></div><div class="toggle on"></div></div>
<div class="toggle-row"><div class="tr-body"><div class="tr-title">allow_url_fopen</div><div class="tr-desc">externe urls als datei öffnen</div></div><div class="toggle on"></div></div>
</div>
</div>
<div class="form-actions"><button class="btn-ghost">PHP-FPM neu starten</button><button class="btn-primary">php.ini speichern</button></div>
</section>
<div class="grid-2">
<section class="card">
<div class="card-head"><h3>OPcache</h3><span class="pill success">aktiv</span></div>
<div class="card-body">
<div class="kv"><span class="k">Trefferquote</span><span class="v" style="color:var(--success)">99,2%</span></div>
<div class="kv"><span class="k">Speicher</span><span class="v">142 / 256 MB</span></div>
<div class="kv"><span class="k">Zwischengesp. Skripte</span><span class="v">4.218</span></div>
<div class="kv" style="border-bottom:0"><span class="k">opcache.revalidate_freq</span><span class="v">60 s</span></div>
</div>
<div class="form-actions"><button class="btn-ghost">OPcache leeren</button></div>
</section>
<section class="card">
<div class="card-head"><h3>Aktive Erweiterungen</h3><span class="meta">28 module</span></div>
<div class="card-body" style="display:flex;flex-wrap:wrap;gap:8px">
<span class="pill">curl</span><span class="pill">gd</span><span class="pill">imagick</span><span class="pill">intl</span><span class="pill">mbstring</span><span class="pill">mysqli</span><span class="pill">opcache</span><span class="pill">redis</span><span class="pill">soap</span><span class="pill">zip</span><span class="pill">bcmath</span><span class="pill">exif</span><span class="pill accent">+ 16</span>
</div>
</section>
</div>
</div>
<!-- ============ DATEI-MANAGER ============ -->
<div class="pane" id="tab-files">
<div class="section-head">
<h2><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/></svg>Datei-Manager</h2>
<div class="toolbar">
<button class="chip-filter"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 5v14M5 12h14"/></svg>Neue Datei</button>
<button class="chip-filter"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 16V4M7 9l5-5 5 5M4 20h16"/></svg>Upload</button>
</div>
</div>
<div class="fm">
<section class="card tree">
<div class="tree-head">
<span class="path">/var/www/bergmann</span>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--muted-2)" stroke-width="2"><path d="M3 12a9 9 0 1 0 3-6.7M3 4v4h4"/></svg>
</div>
<div id="file-tree"></div>
</section>
<section class="card editor">
<div class="editor-head">
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="var(--muted)" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/></svg>
<span class="crumb" id="crumb">Wähle eine Datei aus dem Baum</span>
<span class="editor-tagline" id="editor-tagline"></span>
</div>
<div class="code-wrap" id="code-wrap" style="display:none">
<div class="gutter" id="gutter"></div>
<textarea class="code-area" id="code-area" spellcheck="false"></textarea>
</div>
<div class="editor-empty" id="editor-empty">
<svg width="34" height="34" viewBox="0 0 24 24" fill="none" stroke="var(--muted-2)" stroke-width="1.5"><path d="M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/></svg>
<div>Klicke links auf eine Datei,<br>um sie hier zu bearbeiten.</div>
</div>
<div class="editor-foot">
<span class="editor-tagline" id="editor-status">bereit</span>
<div style="display:flex;gap:8px">
<button class="btn-ghost" id="btn-revert" style="padding:7px 13px;font-size:12px">Verwerfen</button>
<button class="btn-primary" id="btn-save" style="padding:7px 13px;font-size:12px"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"/><path d="M17 21v-8H7v8M7 3v5h8"/></svg>Speichern</button>
</div>
</div>
</section>
</div>
</div>
<!-- ============ CRONJOBS ============ -->
<div class="pane" id="tab-cron">
<div class="section-head">
<h2><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg>Cronjobs</h2>
<button class="btn-primary" id="btn-add-cron"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4"><path d="M12 5v14M5 12h14"/></svg>Cronjob anlegen</button>
</div>
<!-- inline create form -->
<section class="card" id="cron-form" style="display:none">
<div class="card-head"><h3>Neuer Cronjob</h3></div>
<div class="card-body">
<div class="set-grid">
<div class="field"><label>Name</label><input class="input" id="cf-name" placeholder="z. B. WooCommerce Lagerabgleich" /></div>
<div class="field"><label>Zeitplan</label>
<select class="input" id="cf-preset">
<option value="*/5 * * * *">Alle 5 Minuten</option>
<option value="0 * * * *">Stündlich</option>
<option value="0 3 * * *" selected>Täglich 03:00</option>
<option value="0 4 * * 1">Wöchentlich (Mo 04:00)</option>
<option value="custom">Eigener Ausdruck…</option>
</select>
</div>
</div>
<div class="set-grid">
<div class="field"><label>Cron-Ausdruck</label><input class="input input-mono" id="cf-expr" value="0 3 * * *" /></div>
<div class="field"><label>Typ</label>
<select class="input" id="cf-type"><option>WP-CLI</option><option>URL-Aufruf</option><option>Shell-Befehl</option></select>
</div>
</div>
<div class="field" style="margin-bottom:0"><label>Befehl</label><input class="input input-mono" id="cf-cmd" value="wp cron event run --due-now --path=/var/www/bergmann/htdocs" /></div>
</div>
<div class="form-actions"><button class="btn-ghost" id="cf-cancel">Abbrechen</button><button class="btn-primary" id="cf-save">Cronjob speichern</button></div>
</section>
<section class="card">
<div class="card-head"><h3>Geplante Aufgaben <span class="pill" id="cron-count" style="margin-left:4px">5</span></h3><span class="meta">system + wp-cron</span></div>
<div class="scroll-x">
<table class="table">
<thead><tr><th>Name</th><th>Zeitplan</th><th>Befehl</th><th>Letzter Lauf</th><th>Status</th><th class="num"></th></tr></thead>
<tbody id="cron-body"></tbody>
</table>
</div>
</section>
</div>
<!-- ============ LOGS ============ -->
<div class="pane" id="tab-logs">
<div class="section-head">
<h2><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 5h16M4 10h16M4 15h10M4 20h7"/></svg>Logs</h2>
<div class="toolbar">
<div class="seg" id="log-seg">
<button class="active" data-log="access">access.log</button>
<button data-log="error">error.log</button>
<button data-log="php">php-fpm</button>
<button data-log="wp">wp-debug</button>
</div>
<label class="switch-line"><span class="toggle on" id="log-follow" style="width:34px;height:20px"></span>Live folgen</label>
<button class="chip-filter" id="log-clear"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 6h18M8 6V4h8v2M19 6l-1 14H6L5 6"/></svg>Leeren</button>
</div>
</div>
<div class="card" style="padding:0;overflow:hidden">
<div class="card-head"><h3 id="log-title">access.log</h3><span class="live-tag"><span class="pulse-dot" style="color:var(--success)"></span>live</span></div>
<div class="console" id="console"></div>
</div>
</div>
<div class="foot">CluPilot · shop.bergmann-coffee.com · region eu-central-1</div>
</div>
</main>
</div>
<script src="sitedetails.js"></script>
</body>
</html>