sfdsf
All checks were successful
Deploy / deploy-staging (push) Successful in 5s
Deploy / deploy-production (push) Has been skipped

This commit is contained in:
2026-04-23 00:40:05 +02:00
parent 39bddf39e2
commit 0c90aa0b88
10 changed files with 240 additions and 204 deletions

View File

@@ -1,20 +1,20 @@
.bc-app {
--bc-accent: #5eead4;
--bc-accent-strong: #79d7ff;
--bc-ink: #09111f;
--bc-text: rgba(236, 245, 255, 0.96);
--bc-muted: rgba(203, 218, 234, 0.78);
--bc-line: rgba(148, 163, 184, 0.22);
--bc-panel: rgba(15, 23, 42, 0.68);
--bc-panel-soft: rgba(15, 23, 42, 0.52);
--bc-positive: #86efac;
--bc-negative: #fca5a5;
--bc-accent: var(--brand-accent);
--bc-accent-strong: var(--brand-accent-2);
--bc-ink: var(--text);
--bc-text: var(--text);
--bc-muted: var(--muted);
--bc-line: var(--line);
--bc-panel: rgba(255, 255, 255, 0.78);
--bc-panel-soft: rgba(248, 252, 252, 0.92);
--bc-positive: #137333;
--bc-negative: #c62828;
color: var(--bc-text);
}
.bc-grid-bg {
position: relative;
padding: 8px 0 32px;
padding: 0 0 8px;
}
.bc-grid-bg::before {
@@ -23,8 +23,8 @@
inset: 0;
pointer-events: none;
background:
radial-gradient(circle at top right, rgba(94, 234, 212, 0.16), transparent 28%),
radial-gradient(circle at bottom left, rgba(121, 215, 255, 0.14), transparent 30%),
radial-gradient(circle at top right, color-mix(in srgb, var(--brand-accent-2) 10%, transparent), transparent 28%),
radial-gradient(circle at bottom left, color-mix(in srgb, var(--brand-accent-3) 10%, transparent), transparent 30%),
linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0));
}
@@ -102,7 +102,7 @@
border: 1px solid var(--bc-line);
border-radius: 22px;
background: var(--bc-panel);
box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
box-shadow: 0 10px 24px rgba(1, 22, 32, 0.06);
}
.bc-form-card,
@@ -154,25 +154,25 @@
}
.bc-button--tab {
background: rgba(255, 255, 255, 0.92);
background: rgba(255, 255, 255, 0.94);
color: var(--bc-ink);
font-weight: 700;
}
.bc-button--tab-active {
background: linear-gradient(135deg, var(--bc-accent-strong), var(--bc-accent));
color: var(--bc-ink);
background: linear-gradient(135deg, var(--bc-accent), var(--brand-accent-3));
color: #fff7fb;
font-weight: 700;
}
.bc-button--primary {
background: linear-gradient(135deg, var(--bc-accent), var(--bc-accent-strong));
color: var(--bc-ink);
background: linear-gradient(135deg, var(--bc-accent), var(--brand-accent-3));
color: #fff7fb;
font-weight: 700;
}
.bc-button--secondary {
background: rgba(255, 255, 255, 0.92);
background: rgba(255, 255, 255, 0.94);
color: var(--bc-ink);
font-weight: 700;
}
@@ -180,7 +180,7 @@
.bc-button--ghost {
background: color-mix(in srgb, var(--bc-accent) 14%, transparent);
border-color: color-mix(in srgb, var(--bc-accent) 34%, transparent);
color: var(--bc-accent-strong);
color: var(--bc-accent);
font-weight: 700;
}
@@ -251,7 +251,7 @@
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
filter: drop-shadow(0 12px 24px rgba(94, 234, 212, 0.22));
filter: drop-shadow(0 12px 24px color-mix(in srgb, var(--bc-accent) 18%, transparent));
}
.bc-chart-area {
@@ -259,7 +259,7 @@
}
.bc-chart-grid line {
stroke: rgba(255,255,255,0.08);
stroke: rgba(16, 33, 43, 0.08);
stroke-dasharray: 4 6;
}
@@ -271,7 +271,7 @@
.bc-range-button {
border: 1px solid color-mix(in srgb, var(--bc-accent) 26%, transparent);
background: color-mix(in srgb, var(--bc-accent) 8%, transparent);
background: rgba(255, 255, 255, 0.76);
color: var(--bc-text);
padding: 8px 12px;
border-radius: 999px;
@@ -326,8 +326,8 @@
width: fit-content;
padding: 6px 10px;
border-radius: 999px;
background: rgba(255,255,255,0.06);
color: var(--bc-muted);
background: color-mix(in srgb, var(--bc-accent) 10%, transparent);
color: var(--bc-text);
font-size: .85rem;
}
@@ -366,13 +366,13 @@
border: 1px solid var(--bc-line);
border-radius: 14px;
padding: 10px 12px;
background: rgba(2, 6, 23, 0.42);
background: var(--surface-strong);
color: var(--bc-text);
}
.bc-app input::placeholder,
.bc-app textarea::placeholder {
color: rgba(203, 218, 234, 0.48);
color: color-mix(in srgb, var(--bc-muted) 70%, transparent);
}
.bc-app a {

View File

@@ -2,11 +2,6 @@
<?= module_shell_header('boersenchecker', [
'title' => 'Depotverwaltung',
'description' => 'Depots, Positionen und Kurs-Historien verwalten.',
'tabs' => [
['label' => 'Ueberblick', 'href' => '/module/boersenchecker'],
['label' => 'Depotverwaltung', 'href' => '/module/boersenchecker/depotverwaltung', 'active' => true],
['label' => 'Aktienverwaltung', 'href' => '/module/boersenchecker/aktienverwaltung'],
],
]) ?>
<div class="bc-app">
<div class="bc-grid-bg">

View File

@@ -1,11 +1,6 @@
<?= module_shell_header('boersenchecker', [
'title' => 'Depot-Ueberblick',
'description' => 'Depots, Aktien und Kursverlaeufe in einer Oberflaeche.',
'tabs' => [
['label' => 'Ueberblick', 'href' => '/module/boersenchecker', 'active' => true],
['label' => 'Depotverwaltung', 'href' => '/module/boersenchecker/depotverwaltung'],
['label' => 'Aktienverwaltung', 'href' => '/module/boersenchecker/aktienverwaltung'],
],
]) ?>
<div class="bc-app">
<div class="bc-grid-bg">
@@ -25,80 +20,88 @@
<div class="bc-alert bc-alert--success"><?= e($notice) ?></div>
<?php endif; ?>
<div class="bc-toolbar">
<form class="bc-panel" method="get">
<div class="bc-field-label">Depotauswahl</div>
<?php if ($portfolios === []): ?>
<div class="bc-text" style="margin-top:12px;">Keine Depots vorhanden.</div>
<?php else: ?>
<label class="setup-field" style="margin-top:12px;">
<span class="bc-text">Depot</span>
<select name="portfolio_id" onchange="this.form.submit()">
<?php foreach ($portfolios as $portfolio): ?>
<option value="<?= e((string) $portfolio['id']) ?>" <?= (string) $selectedPortfolioId === (string) $portfolio['id'] ? 'selected' : '' ?>>
<?= e((string) $portfolio['name']) ?>
</option>
<?php endforeach; ?>
</select>
</label>
<?php endif; ?>
</form>
<form class="bc-panel" method="get">
<input type="hidden" name="portfolio_id" value="<?= e((string) $selectedPortfolioId) ?>">
<div class="bc-field-label">Aktienauswahl</div>
<?php if ($positions === []): ?>
<div class="bc-text" style="margin-top:12px;">Keine Aktien im ausgewaehlten Depot.</div>
<?php else: ?>
<label class="setup-field" style="margin-top:12px;">
<span class="bc-text">Aktie</span>
<select name="instrument_id" data-bc-instrument>
<?php foreach ($positions as $position): ?>
<option value="<?= e((string) $position['instrument_id']) ?>" <?= (string) $selectedInstrumentId === (string) $position['instrument_id'] ? 'selected' : '' ?>>
<?= e((string) $position['instrument_name']) ?><?= !empty($position['symbol']) ? ' (' . e((string) $position['symbol']) . ')' : '' ?>
</option>
<?php endforeach; ?>
</select>
</label>
<?php endif; ?>
</form>
<form class="bc-panel" method="post">
<input type="hidden" name="action" value="refresh_current_quotes_home">
<input type="hidden" name="portfolio_id" value="<?= e((string) $selectedPortfolioId) ?>">
<div class="bc-field-label">Marktdaten</div>
<p class="bc-text" style="margin-top:12px;">Aktuelle Kurse fuer das gewaehlte Depot ueber Alpha Vantage abrufen.</p>
<div class="bc-actions" style="margin-top:16px;">
<button class="bc-button bc-button--primary" type="submit" <?= $selectedPortfolioId > 0 ? '' : 'disabled' ?>>Aktuelle Kurse abrufen</button>
<section class="module-box">
<div class="module-box-head">
<div>
<h2 class="module-box-title">Marktueberblick</h2>
<p>Depotauswahl, Aktienfokus und aktueller Kursabruf in einem Bereich.</p>
</div>
</form>
</div>
</div>
<div class="bc-toolbar" style="margin-top:16px;">
<form class="bc-panel" method="get">
<div class="bc-field-label">Depotauswahl</div>
<?php if ($portfolios === []): ?>
<div class="bc-text" style="margin-top:12px;">Keine Depots vorhanden.</div>
<?php else: ?>
<label class="setup-field" style="margin-top:12px;">
<span class="bc-text">Depot</span>
<select name="portfolio_id" onchange="this.form.submit()">
<?php foreach ($portfolios as $portfolio): ?>
<option value="<?= e((string) $portfolio['id']) ?>" <?= (string) $selectedPortfolioId === (string) $portfolio['id'] ? 'selected' : '' ?>>
<?= e((string) $portfolio['name']) ?>
</option>
<?php endforeach; ?>
</select>
</label>
<?php endif; ?>
</form>
<div class="bc-overview-grid">
<div class="bc-stat">
<form class="bc-panel" method="get">
<input type="hidden" name="portfolio_id" value="<?= e((string) $selectedPortfolioId) ?>">
<div class="bc-field-label">Aktienauswahl</div>
<?php if ($positions === []): ?>
<div class="bc-text" style="margin-top:12px;">Keine Aktien im ausgewaehlten Depot.</div>
<?php else: ?>
<label class="setup-field" style="margin-top:12px;">
<span class="bc-text">Aktie</span>
<select name="instrument_id" data-bc-instrument onchange="this.form.submit()">
<?php foreach ($positions as $position): ?>
<option value="<?= e((string) $position['instrument_id']) ?>" <?= (string) $selectedInstrumentId === (string) $position['instrument_id'] ? 'selected' : '' ?>>
<?= e((string) $position['instrument_name']) ?><?= !empty($position['symbol']) ? ' (' . e((string) $position['symbol']) . ')' : '' ?>
</option>
<?php endforeach; ?>
</select>
</label>
<?php endif; ?>
</form>
<form class="bc-panel" method="post">
<input type="hidden" name="action" value="refresh_current_quotes_home">
<input type="hidden" name="portfolio_id" value="<?= e((string) $selectedPortfolioId) ?>">
<div class="bc-field-label">Marktdaten</div>
<p class="bc-text" style="margin-top:12px;">Aktuelle Kurse fuer das gewaehlte Depot ueber Alpha Vantage abrufen.</p>
<div class="bc-actions" style="margin-top:16px;">
<button class="bc-button bc-button--primary" type="submit" <?= $selectedPortfolioId > 0 ? '' : 'disabled' ?>>Aktuelle Kurse abrufen</button>
</div>
</form>
</div>
</section>
<div class="module-box-grid module-box-grid--stats">
<section class="module-box-soft bc-stat">
<div class="bc-field-label">Positionen</div>
<div class="bc-stat-value"><?= e((string) ($summary['positions'] ?? 0)) ?></div>
<div class="bc-text" style="margin-top:6px;">Aktien im aktuell gewaehlten Depot</div>
</div>
<div class="bc-stat">
</section>
<section class="module-box-soft bc-stat">
<div class="bc-field-label">Investiert</div>
<div class="bc-stat-value"><?= isset($summary['invested']) && $summary['invested'] !== null ? e(number_format((float) $summary['invested'], 2, ',', '.')) . ' ' . e($defaultReportCurrency) : 'n/a' ?></div>
<div class="bc-text" style="margin-top:6px;">In Berichtswahrung bewertet</div>
</div>
<div class="bc-stat">
</section>
<section class="module-box-soft bc-stat">
<div class="bc-field-label">Aktueller Wert</div>
<div class="bc-stat-value"><?= isset($summary['current']) && $summary['current'] !== null ? e(number_format((float) $summary['current'], 2, ',', '.')) . ' ' . e($defaultReportCurrency) : 'n/a' ?></div>
<div class="bc-text" style="margin-top:6px;">Basierend auf dem letzten gespeicherten Kurs</div>
</div>
<div class="bc-stat">
</section>
<section class="module-box-soft bc-stat">
<div class="bc-field-label">Performance</div>
<div class="bc-stat-value"><?= isset($summary['gain']) && $summary['gain'] !== null ? e(number_format((float) $summary['gain'], 2, ',', '.')) . ' ' . e($defaultReportCurrency) : 'n/a' ?></div>
<div class="bc-text" style="margin-top:6px;"><?= !empty($summary['best']['instrument_name']) ? 'Top-Wert: ' . e((string) $summary['best']['instrument_name']) : 'Noch keine Vergleichsdaten' ?></div>
</div>
</section>
</div>
<div class="bc-card-grid">
<div class="bc-panel">
<div class="module-box-grid module-box-grid--panels">
<section class="module-box-soft">
<div class="bc-field-label">Bester Wert</div>
<?php if (!empty($summary['best'])): ?>
<div class="bc-stat-value"><?= e((string) $summary['best']['instrument_name']) ?></div>
@@ -106,9 +109,9 @@
<?php else: ?>
<div class="bc-text" style="margin-top:12px;">Noch keine Performance verfuegbar.</div>
<?php endif; ?>
</div>
</section>
<div class="bc-panel">
<section class="module-box-soft">
<div class="bc-field-label">Schwaechster Wert</div>
<?php if (!empty($summary['worst'])): ?>
<div class="bc-stat-value"><?= e((string) $summary['worst']['instrument_name']) ?></div>
@@ -116,79 +119,94 @@
<?php else: ?>
<div class="bc-text" style="margin-top:12px;">Noch keine Performance verfuegbar.</div>
<?php endif; ?>
</div>
</section>
<?php foreach (array_slice($positions, 0, 2) as $position): ?>
<div class="bc-stat">
<section class="module-box-soft bc-stat">
<div class="bc-field-label"><?= e((string) $position['instrument_name']) ?></div>
<div class="bc-stat-value"><?= $position['latest_price'] !== null ? e(number_format((float) $position['latest_price'], 2, ',', '.')) . ' ' . e((string) $position['latest_currency']) : 'n/a' ?></div>
<div class="bc-text" style="margin-top:6px;"><?= e((string) ($position['latest_quoted_at'] ?: 'kein Kurs')) ?></div>
</div>
</section>
<?php endforeach; ?>
</div>
<section class="bc-chart-card">
<div style="display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:center;">
<section class="module-box">
<div class="module-box-head">
<div>
<div class="bc-field-label">Kursverlauf</div>
<div class="bc-stat-value" data-bc-instrument-name><?= e((string) ($selectedInstrument['instrument_name'] ?? 'Keine Aktie ausgewaehlt')) ?></div>
<?php if ($selectedInstrument): ?>
<div class="bc-text" data-bc-instrument-meta><?= e((string) ($selectedInstrument['symbol'] ?? '')) ?> · <?= e((string) ($selectedInstrument['isin'] ?? '-')) ?></div>
<?php endif; ?>
</div>
<div class="bc-range-list">
<button type="button" class="bc-range-button" data-range="1d" aria-pressed="false">Tag</button>
<button type="button" class="bc-range-button" data-range="5d" aria-pressed="false">5 Tage</button>
<button type="button" class="bc-range-button" data-range="1m" aria-pressed="true">Monat</button>
<button type="button" class="bc-range-button" data-range="3m" aria-pressed="false">3 Monate</button>
<button type="button" class="bc-range-button" data-range="6m" aria-pressed="false">6 Monate</button>
<button type="button" class="bc-range-button" data-range="1y" aria-pressed="false">Jahr</button>
<button type="button" class="bc-range-button" data-range="5y" aria-pressed="false">5 Jahre</button>
<h2 class="module-box-title">Kursverlauf</h2>
<p>Schlusskurse ueber mehrere Zeitfenster fuer das aktuell gewaehlte Instrument.</p>
</div>
</div>
<div class="bc-text" data-bc-chart-status style="margin-top:12px;">Chartdaten werden geladen...</div>
<div class="bc-stat-value" data-bc-chart-summary style="margin-top:6px;">-</div>
<div class="bc-chart-shell" data-bc-chart style="margin-top:18px;"></div>
<div class="bc-chart-card" style="margin-top:16px;">
<div style="display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:center;">
<div>
<div class="bc-field-label">Aktie</div>
<div class="bc-stat-value" data-bc-instrument-name><?= e((string) ($selectedInstrument['instrument_name'] ?? 'Keine Aktie ausgewaehlt')) ?></div>
<?php if ($selectedInstrument): ?>
<div class="bc-text" data-bc-instrument-meta><?= e((string) ($selectedInstrument['symbol'] ?? '')) ?> · <?= e((string) ($selectedInstrument['isin'] ?? '-')) ?></div>
<?php endif; ?>
</div>
<div class="bc-range-list">
<button type="button" class="bc-range-button" data-range="1d" aria-pressed="false">Tag</button>
<button type="button" class="bc-range-button" data-range="5d" aria-pressed="false">5 Tage</button>
<button type="button" class="bc-range-button" data-range="1m" aria-pressed="true">Monat</button>
<button type="button" class="bc-range-button" data-range="3m" aria-pressed="false">3 Monate</button>
<button type="button" class="bc-range-button" data-range="6m" aria-pressed="false">6 Monate</button>
<button type="button" class="bc-range-button" data-range="1y" aria-pressed="false">Jahr</button>
<button type="button" class="bc-range-button" data-range="5y" aria-pressed="false">5 Jahre</button>
</div>
</div>
<div class="bc-text" data-bc-chart-status style="margin-top:12px;">Chartdaten werden geladen...</div>
<div class="bc-stat-value" data-bc-chart-summary style="margin-top:6px;">-</div>
<div class="bc-chart-shell" data-bc-chart style="margin-top:18px;"></div>
</div>
</section>
<section class="bc-panel">
<div class="bc-field-label">Aktien im Depot</div>
<?php if ($positions === []): ?>
<div class="bc-text" style="margin-top:12px;">Keine Aktien im ausgewaehlten Depot.</div>
<?php else: ?>
<div class="bc-position-list" style="margin-top:16px;">
<?php foreach ($positions as $position): ?>
<?php $gainClass = (($position['gain_report'] ?? 0) >= 0) ? 'is-positive' : 'is-negative'; ?>
<div class="bc-position-row">
<div>
<strong><?= e((string) $position['instrument_name']) ?></strong>
<div class="bc-text" style="margin-top:4px;"><?= e((string) ($position['symbol'] ?? '')) ?> · <?= e((string) ($position['isin'] ?? '-')) ?></div>
<?php if (!empty($position['market'])): ?>
<div class="bc-pill-soft" style="margin-top:10px;"><?= e((string) $position['market']) ?></div>
<?php endif; ?>
</div>
<div>
<div class="bc-field-label">Stueckzahl</div>
<div><?= e(number_format((float) $position['quantity'], 6, ',', '.')) ?></div>
</div>
<div>
<div class="bc-field-label">Kaufpreis</div>
<div><?= e(number_format((float) $position['purchase_price'], 2, ',', '.')) ?> <?= e((string) $position['purchase_currency']) ?></div>
</div>
<div>
<div class="bc-field-label">Letzter Kurs</div>
<div><?= $position['latest_price'] !== null ? e(number_format((float) $position['latest_price'], 2, ',', '.')) . ' ' . e((string) $position['latest_currency']) : 'n/a' ?></div>
</div>
<div>
<div class="bc-field-label">Performance</div>
<div class="bc-performance <?= e($gainClass) ?>">
<?= isset($position['gain_report']) && $position['gain_report'] !== null ? e(number_format((float) $position['gain_report'], 2, ',', '.')) . ' ' . e($defaultReportCurrency) : 'n/a' ?>
<section class="module-box-table">
<div class="module-box-head">
<div>
<h2 class="module-box-title">Aktien im Depot</h2>
<p>Stueckzahl, Kaufdaten, letzter Kurs und Performance auf einen Blick.</p>
</div>
</div>
<div class="module-box-copy">
<?php if ($positions === []): ?>
<div class="bc-text" style="padding:0 0 18px;">Keine Aktien im ausgewaehlten Depot.</div>
<?php else: ?>
<div class="bc-position-list" style="padding:0 0 18px;">
<?php foreach ($positions as $position): ?>
<?php $gainClass = (($position['gain_report'] ?? 0) >= 0) ? 'is-positive' : 'is-negative'; ?>
<div class="bc-position-row">
<div>
<strong><?= e((string) $position['instrument_name']) ?></strong>
<div class="bc-text" style="margin-top:4px;"><?= e((string) ($position['symbol'] ?? '')) ?> · <?= e((string) ($position['isin'] ?? '-')) ?></div>
<?php if (!empty($position['market'])): ?>
<div class="bc-pill-soft" style="margin-top:10px;"><?= e((string) $position['market']) ?></div>
<?php endif; ?>
</div>
<div>
<div class="bc-field-label">Stueckzahl</div>
<div><?= e(number_format((float) $position['quantity'], 6, ',', '.')) ?></div>
</div>
<div>
<div class="bc-field-label">Kaufpreis</div>
<div><?= e(number_format((float) $position['purchase_price'], 2, ',', '.')) ?> <?= e((string) $position['purchase_currency']) ?></div>
</div>
<div>
<div class="bc-field-label">Letzter Kurs</div>
<div><?= $position['latest_price'] !== null ? e(number_format((float) $position['latest_price'], 2, ',', '.')) . ' ' . e((string) $position['latest_currency']) : 'n/a' ?></div>
</div>
<div>
<div class="bc-field-label">Performance</div>
<div class="bc-performance <?= e($gainClass) ?>">
<?= isset($position['gain_report']) && $position['gain_report'] !== null ? e(number_format((float) $position['gain_report'], 2, ',', '.')) . ' ' . e($defaultReportCurrency) : 'n/a' ?>
</div>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
</section>
</div>
</div>

View File

@@ -1,11 +1,6 @@
<?= module_shell_header('boersenchecker', [
'title' => 'Aktienverwaltung',
'description' => 'Stammdaten der Aktien pflegen, Symbole suchen und manuelle Kurse verwalten.',
'tabs' => [
['label' => 'Ueberblick', 'href' => '/module/boersenchecker'],
['label' => 'Depotverwaltung', 'href' => '/module/boersenchecker/depotverwaltung'],
['label' => 'Aktienverwaltung', 'href' => '/module/boersenchecker/aktienverwaltung', 'active' => true],
],
]) ?>
<div class="bc-app">
<div class="bc-grid-bg">

View File

@@ -9,12 +9,6 @@ $hasConfig = !empty($instances);
<?= module_shell_header('pihole', [
'title' => 'Pi-hole Dashboard',
'description' => 'Status, Blockings, Usage und Steuerung fuer beide Instanzen.',
'tabs' => [
['label' => 'Dashboard', 'href' => '/module/pihole', 'active' => true],
['label' => 'Instanzen', 'href' => '/module/pihole/instances'],
['label' => 'Listen', 'href' => '/module/pihole/lists'],
['label' => 'Queries', 'href' => '/module/pihole/queries'],
],
]) ?>
<div class="card pihole-page" data-pihole-page="dashboard">

View File

@@ -135,12 +135,6 @@ if ($primaryId === '') {
<?= module_shell_header('pihole', [
'title' => 'Pi-hole Instanzen',
'description' => 'Pi-hole Instanzen hinzufuegen, bearbeiten und loeschen.',
'tabs' => [
['label' => 'Dashboard', 'href' => '/module/pihole'],
['label' => 'Instanzen', 'href' => '/module/pihole/instances', 'active' => true],
['label' => 'Listen', 'href' => '/module/pihole/lists'],
['label' => 'Queries', 'href' => '/module/pihole/queries'],
],
]) ?>
<div class="card">
<div style="display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;">

View File

@@ -6,11 +6,11 @@ $assets->addScript('/module/pihole/asset?file=pihole.js', 'footer', true);
$instances = module_fn('pihole', 'instances');
$hasConfig = !empty($instances);
?>
<?= module_shell_header('pihole', [
'title' => 'Listen & Domains',
'description' => 'Top-Domains, Listen-Updates und neue Eintraege auf der Primaer-Instanz.',
]) ?>
<div class="card pihole-page" data-pihole-page="lists">
<div class="pill">Pi-hole</div>
<h1 style="margin-top:.75rem;">Listen &amp; Domains</h1>
<p class="muted">Top-Domains, Listen-Updates und neue Eintraege (Primaer-Instanz).</p>
<?php if (!$hasConfig): ?>
<div class="card" style="margin-top:1rem; border-color:var(--accent);">
<strong>Keine Instanzen konfiguriert</strong>
@@ -84,3 +84,4 @@ $hasConfig = !empty($instances);
</div>
<?php endif; ?>
</div>
<?= module_shell_footer() ?>

View File

@@ -6,11 +6,11 @@ $assets->addScript('/module/pihole/asset?file=pihole.js', 'footer', true);
$instances = module_fn('pihole', 'instances');
$hasConfig = !empty($instances);
?>
<?= module_shell_header('pihole', [
'title' => 'Zugriffe & Blockings',
'description' => 'Aktuelle Blockings, Top Clients und Status pro Instanz.',
]) ?>
<div class="card pihole-page" data-pihole-page="queries">
<div class="pill">Pi-hole</div>
<h1 style="margin-top:.75rem;">Zugriffe &amp; Blockings</h1>
<p class="muted">Aktuelle Blockings, Top Clients und Status pro Instanz.</p>
<?php if (!$hasConfig): ?>
<div class="card" style="margin-top:1rem; border-color:var(--accent);">
<strong>Keine Instanzen konfiguriert</strong>
@@ -36,3 +36,4 @@ $hasConfig = !empty($instances);
</div>
<?php endif; ?>
</div>
<?= module_shell_footer() ?>

View File

@@ -920,15 +920,15 @@ a {
.module-page-stack {
position: relative;
display: grid;
gap: 18px;
gap: 16px;
}
.module-hero {
display: grid;
gap: 18px;
padding: 28px;
gap: 14px;
padding: 20px 22px;
border: 1px solid var(--line);
border-radius: 28px;
border-radius: 24px;
background:
linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(245, 252, 251, 0.88)),
linear-gradient(90deg, color-mix(in srgb, var(--brand-accent) 14%, transparent), color-mix(in srgb, var(--brand-accent-2) 14%, transparent));
@@ -942,37 +942,45 @@ a {
}
.module-hero-top {
display: grid;
gap: 16px;
grid-template-columns: minmax(0, 1.6fr) minmax(220px, 0.8fr);
display: flex;
gap: 14px;
justify-content: space-between;
align-items: start;
}
.module-hero-copy,
.module-hero-actions {
display: grid;
gap: 12px;
gap: 8px;
}
.module-hero-copy {
min-width: 0;
}
.module-hero-copy--compact {
min-height: 1px;
}
.module-title {
margin: 0;
font-size: clamp(1.75rem, 4vw, 2.9rem);
line-height: 1;
font-size: clamp(1.45rem, 3vw, 2.2rem);
line-height: 1.04;
font-weight: 700;
letter-spacing: -0.03em;
letter-spacing: -0.04em;
}
.module-lead {
margin: 0;
color: var(--muted);
font-size: 1rem;
font-size: 0.95rem;
line-height: 1.5;
}
.module-tabs {
display: flex;
flex-wrap: wrap;
gap: 10px;
gap: 8px;
}
.module-button {
@@ -981,7 +989,8 @@ a {
justify-content: center;
border: 1px solid transparent;
border-radius: 16px;
padding: 12px 16px;
min-height: 40px;
padding: 9px 15px;
cursor: pointer;
text-decoration: none;
transition: 160ms ease;
@@ -1014,6 +1023,19 @@ a {
font-weight: 700;
}
.module-button--small {
min-height: 34px;
padding: 7px 12px;
border-radius: 14px;
font-size: 0.92rem;
}
.module-hero-actions {
justify-items: start;
align-content: start;
width: min(240px, 100%);
}
.module-box,
.module-box-soft,
.module-box-table,
@@ -1083,6 +1105,10 @@ a {
@media (max-width: 980px) {
.module-hero-top {
grid-template-columns: 1fr;
flex-direction: column;
}
.module-hero-actions {
width: 100%;
}
}

View File

@@ -280,8 +280,8 @@ function module_shell_header(string $module, array $options = []): string
{
$design = module_design($module);
$requestPath = app()->request()->path();
$title = trim((string) ($options['title'] ?? $design['title'] ?? ucfirst($module)));
$description = trim((string) ($options['description'] ?? $design['description'] ?? ''));
$title = trim((string) ($options['title'] ?? ''));
$description = trim((string) ($options['description'] ?? ''));
$eyebrow = trim((string) ($options['eyebrow'] ?? $design['eyebrow'] ?? 'Modul'));
$actions = is_array($options['actions'] ?? null) ? $options['actions'] : (is_array($design['actions'] ?? null) ? $design['actions'] : []);
$tabs = is_array($options['tabs'] ?? null) ? $options['tabs'] : (is_array($design['tabs'] ?? null) ? $design['tabs'] : []);
@@ -289,13 +289,21 @@ function module_shell_header(string $module, array $options = []): string
$html = '<div class="module-shell"><div class="module-page-bg"><div class="module-page-stack">';
$html .= '<header class="module-hero">';
$html .= '<div class="module-hero-top">';
$html .= '<div class="module-hero-copy">';
$html .= '<div class="eyebrow">' . e($eyebrow) . '</div>';
$html .= '<h1 class="module-title">' . e($title) . '</h1>';
if ($description !== '') {
$html .= '<p class="module-lead">' . e($description) . '</p>';
if ($title !== '' || $description !== '' || !empty($options['show_eyebrow'])) {
$html .= '<div class="module-hero-copy">';
if (!empty($options['show_eyebrow'])) {
$html .= '<div class="eyebrow">' . e($eyebrow) . '</div>';
}
if ($title !== '') {
$html .= '<h1 class="module-title">' . e($title) . '</h1>';
}
if ($description !== '') {
$html .= '<p class="module-lead">' . e($description) . '</p>';
}
$html .= '</div>';
} else {
$html .= '<div class="module-hero-copy module-hero-copy--compact" aria-hidden="true"></div>';
}
$html .= '</div>';
if ($actions !== []) {
$html .= '<div class="module-hero-actions">';
@@ -309,7 +317,11 @@ function module_shell_header(string $module, array $options = []): string
continue;
}
$variant = trim((string) ($action['variant'] ?? 'secondary'));
$size = trim((string) ($action['size'] ?? 'sm'));
$class = $variant === 'ghost' ? 'module-button module-button--ghost' : 'module-button module-button--secondary';
if ($size === 'sm') {
$class .= ' module-button--small';
}
$html .= '<a class="' . e($class) . '" href="' . e($href) . '">' . e($label) . '</a>';
}
$html .= '</div>';