|
|
@@ -5,7 +5,6 @@ include 'db_config.php';
|
|
|
$allTeams = $pdo->query("SELECT * FROM spieler ORDER BY name ASC")->fetchAll();
|
|
|
$teamFilter = isset($_GET['team_id']) ? (int)$_GET['team_id'] : 0;
|
|
|
|
|
|
-// Neue SQL-Struktur mit Joins für Reihe und Typ
|
|
|
$sql = "SELECT sp.*,
|
|
|
sc.zeit, sc.hilfe, sc.sterne,
|
|
|
s.name as team_name,
|
|
|
@@ -21,16 +20,14 @@ if ($teamFilter > 0) {
|
|
|
$sql .= " WHERE s.id = $teamFilter";
|
|
|
}
|
|
|
|
|
|
-// Sortierung nach Reihenname, Spieltitel und dann Score-Zeit
|
|
|
$sql .= " ORDER BY r.name ASC, sp.titel ASC, sc.zeit ASC";
|
|
|
-$stmt = $pdo->query($sql);
|
|
|
-$results = $stmt->fetchAll();
|
|
|
+$results = $pdo->query($sql)->fetchAll();
|
|
|
|
|
|
-// --- 2. GRUPPIERUNG NACH REIHE UND SPIEL ---
|
|
|
+// --- 2. GRUPPIERUNG ---
|
|
|
$groupedData = [];
|
|
|
foreach ($results as $row) {
|
|
|
$reihe = !empty($row['reihe_name']) ? $row['reihe_name'] : 'Sonstige';
|
|
|
- $gameId = $row['id']; // ID als Key nutzen, falls Titel doppelt vorkommen könnten
|
|
|
+ $gameId = $row['id'];
|
|
|
|
|
|
if (!isset($groupedData[$reihe][$gameId])) {
|
|
|
$groupedData[$reihe][$gameId] = [
|
|
|
@@ -52,7 +49,7 @@ foreach ($results as $row) {
|
|
|
<html lang="de">
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
- <title>EXIT Log - Gelöste Abenteuer</title>
|
|
|
+ <title>EXIT Log - Kompaktansicht</title>
|
|
|
<style>
|
|
|
:root {
|
|
|
--bg: #f4f7f6; --card: #ffffff; --text: #333; --border: #ddd; --accent: #e67e22;
|
|
|
@@ -62,44 +59,42 @@ foreach ($results as $row) {
|
|
|
--bg: #121212; --card: #1e1e1e; --text: #ffffff; --border: #333; --muted: #aaa;
|
|
|
}
|
|
|
|
|
|
- body { font-family: 'Segoe UI', sans-serif; background: var(--bg); color: var(--text); padding: 20px; transition: 0.3s; }
|
|
|
- .container { max-width: 1200px; margin: 0 auto; }
|
|
|
+ body { font-family: 'Segoe UI', sans-serif; background: var(--bg); color: var(--text); padding: 15px; transition: 0.3s; margin: 0; }
|
|
|
+ .container { max-width: 1400px; margin: 0 auto; } /* Container verbreitert */
|
|
|
|
|
|
- header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; border-bottom: 2px solid var(--accent); padding-bottom: 10px; }
|
|
|
- h1 { color: var(--accent); margin: 0; font-size: 1.8rem; }
|
|
|
+ header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; border-bottom: 2px solid var(--accent); padding-bottom: 8px; }
|
|
|
+ h1 { color: var(--accent); margin: 0; font-size: 1.4rem; }
|
|
|
|
|
|
- .btn-nav { background: var(--accent); color: white; text-decoration: none; padding: 10px 15px; border-radius: 8px; font-weight: bold; font-size: 0.9em; display: inline-block; }
|
|
|
- .theme-toggle { background: none; border: none; font-size: 1.5rem; cursor: pointer; padding: 0; line-height: 1; }
|
|
|
+ .btn-nav { background: var(--accent); color: white; text-decoration: none; padding: 6px 12px; border-radius: 6px; font-weight: bold; font-size: 0.85em; }
|
|
|
+ .theme-toggle { background: none; border: none; font-size: 1.2rem; cursor: pointer; }
|
|
|
|
|
|
- .filter-bar { background: var(--card); padding: 15px; border-radius: 12px; border: 1px solid var(--border); margin-bottom: 25px; display: flex; align-items: center; gap: 15px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); }
|
|
|
- select { padding: 8px 15px; border-radius: 6px; border: 1px solid var(--border); background: var(--bg); color: var(--text); cursor: pointer; }
|
|
|
+ .filter-bar { background: var(--card); padding: 10px; border-radius: 8px; border: 1px solid var(--border); margin-bottom: 20px; display: flex; align-items: center; gap: 10px; font-size: 0.9em; }
|
|
|
+ select { padding: 5px 10px; border-radius: 4px; border: 1px solid var(--border); background: var(--bg); color: var(--text); }
|
|
|
|
|
|
- .reihe-divider { grid-column: 1 / -1; margin: 40px 0 20px; padding: 12px 20px; background: var(--reihe-bg); color: white; border-radius: 8px; font-size: 1.1rem; font-weight: bold; text-transform: uppercase; letter-spacing: 2px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
|
|
|
- .reihe-divider:first-of-type { margin-top: 0; }
|
|
|
+ .reihe-divider { grid-column: 1 / -1; margin: 25px 0 10px; padding: 8px 15px; background: var(--reihe-bg); color: white; border-radius: 6px; font-size: 0.9rem; font-weight: bold; text-transform: uppercase; letter-spacing: 1px; }
|
|
|
|
|
|
- .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 25px; }
|
|
|
- .item { background: var(--card); border-radius: 12px; border: 1px solid var(--border); box-shadow: 0 4px 15px rgba(0,0,0,0.1); overflow: hidden; display: flex; flex-direction: column; }
|
|
|
- .item img { width: 100%; height: 200px; object-fit: cover; background: #2a2a2a; border-bottom: 1px solid var(--border); }
|
|
|
+ /* Raster verkleinert für mehr Karten nebeneinander */
|
|
|
+ .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 15px; }
|
|
|
|
|
|
- .stats { padding: 15px; flex-grow: 1; }
|
|
|
- .game-title { font-weight: bold; display: block; margin-bottom: 5px; font-size: 1.2em; color: var(--accent); text-align: center; line-height: 1.2; }
|
|
|
- .game-subtitle { display: block; text-align: center; font-size: 0.75em; opacity: 0.6; margin-bottom: 15px; text-transform: uppercase; }
|
|
|
+ .item { background: var(--card); border-radius: 8px; border: 1px solid var(--border); box-shadow: 0 2px 8px rgba(0,0,0,0.1); overflow: hidden; display: flex; flex-direction: column; }
|
|
|
+ .item img { width: 100%; height: 140px; object-fit: cover; background: #2a2a2a; }
|
|
|
|
|
|
- .team-section-label { font-size: 0.7em; color: var(--muted); display: block; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 10px; border-bottom: 1px solid var(--border); padding-bottom: 5px; }
|
|
|
+ .stats { padding: 10px; flex-grow: 1; }
|
|
|
+ .game-title { font-weight: bold; display: block; margin-bottom: 2px; font-size: 1rem; color: var(--accent); text-align: center; }
|
|
|
+ .game-subtitle { display: block; text-align: center; font-size: 0.7em; opacity: 0.6; margin-bottom: 10px; text-transform: uppercase; }
|
|
|
+
|
|
|
+ .team-section-label { font-size: 0.65em; color: var(--muted); display: block; text-transform: uppercase; margin-bottom: 8px; border-bottom: 1px solid var(--border); padding-bottom: 3px; }
|
|
|
|
|
|
- .team-entry { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px dashed var(--border); }
|
|
|
+ .team-entry { margin-bottom: 8px; padding-bottom: 8px; border-bottom: 1px dashed var(--border); }
|
|
|
.team-entry:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
|
|
|
|
|
|
- .team-name-text { font-size: 0.95em; font-weight: bold; display: block; margin-bottom: 5px; }
|
|
|
+ .team-name-text { font-size: 0.85em; font-weight: bold; display: block; margin-bottom: 3px; }
|
|
|
|
|
|
- .result-row { display: flex; justify-content: space-between; font-size: 0.8em; }
|
|
|
- .res-item span { opacity: 0.6; margin-right: 4px; }
|
|
|
+ .result-row { display: flex; justify-content: space-between; font-size: 0.75em; }
|
|
|
.res-item b { color: var(--accent); }
|
|
|
- .res-only-solved { font-size: 0.8em; color: var(--muted); font-style: italic; }
|
|
|
+ .res-only-solved { font-size: 0.75em; color: var(--muted); font-style: italic; }
|
|
|
|
|
|
@media (max-width: 600px) {
|
|
|
- header { flex-direction: column; gap: 15px; text-align: center; }
|
|
|
- .filter-bar { flex-direction: column; align-items: stretch; }
|
|
|
.grid { grid-template-columns: 1fr; }
|
|
|
}
|
|
|
</style>
|
|
|
@@ -109,17 +104,17 @@ foreach ($results as $row) {
|
|
|
<div class="container">
|
|
|
<header>
|
|
|
<h1>📂 Gelöste Abenteuer</h1>
|
|
|
- <div style="display: flex; align-items: center; gap: 15px;">
|
|
|
+ <div style="display: flex; align-items: center; gap: 10px;">
|
|
|
<button onclick="toggleTheme()" class="theme-toggle" id="theme-icon">🌙</button>
|
|
|
<a href="index.php" class="btn-nav">Dashboard</a>
|
|
|
</div>
|
|
|
</header>
|
|
|
|
|
|
<div class="filter-bar">
|
|
|
- <strong>Filter nach Team:</strong>
|
|
|
+ <strong>Filter:</strong>
|
|
|
<form id="filterForm" method="GET">
|
|
|
<select name="team_id" onchange="this.form.submit()">
|
|
|
- <option value="0">-- Alle Teams --</option>
|
|
|
+ <option value="0">Alle Teams</option>
|
|
|
<?php foreach ($allTeams as $t): ?>
|
|
|
<option value="<?= $t['id'] ?>" <?= $teamFilter == $t['id'] ? 'selected' : '' ?>>
|
|
|
<?= htmlspecialchars($t['name']) ?>
|
|
|
@@ -135,23 +130,23 @@ foreach ($results as $row) {
|
|
|
|
|
|
<?php foreach ($games as $gameId => $data): ?>
|
|
|
<div class="item">
|
|
|
- <img src="<?= htmlspecialchars($data['bild_url']) ?>" onerror="this.src='https://via.placeholder.com/300x200?text=Escape+Spiel'">
|
|
|
+ <img src="<?= htmlspecialchars($data['bild_url']) ?>" onerror="this.src='https://via.placeholder.com/240x140?text=EXIT'">
|
|
|
<div class="stats">
|
|
|
<span class="game-title"><?= htmlspecialchars($data['titel']) ?></span>
|
|
|
<span class="game-subtitle"><?= htmlspecialchars($data['typ_name'] ?: '') ?></span>
|
|
|
|
|
|
- <span class="team-section-label">Gelöst von</span>
|
|
|
+ <span class="team-section-label">Teams</span>
|
|
|
|
|
|
<?php foreach ($data['teams'] as $team): ?>
|
|
|
<div class="team-entry">
|
|
|
<span class="team-name-text">👥 <?= htmlspecialchars($team['name']) ?></span>
|
|
|
|
|
|
<?php if ($team['zeit'] === 0 && $team['hilfe'] === 0 && $team['sterne'] === 0): ?>
|
|
|
- <div class="res-only-solved">✅ Erfolgreich gelöst (Archiv)</div>
|
|
|
+ <div class="res-only-solved">✅ Gelöst</div>
|
|
|
<?php else: ?>
|
|
|
<div class="result-row">
|
|
|
- <div class="res-item"><span>Zeit:</span><b><?= $team['zeit'] ?> Min.</b></div>
|
|
|
- <div class="res-item"><span>Hilfe:</span><b><?= $team['hilfe'] ?></b></div>
|
|
|
+ <div class="res-item"><b><?= $team['zeit'] ?></b> Min.</div>
|
|
|
+ <div class="res-item">Hilfe: <b><?= $team['hilfe'] ?></b></div>
|
|
|
<div class="res-item"><b>⭐ <?= $team['sterne'] ?></b></div>
|
|
|
</div>
|
|
|
<?php endif; ?>
|
erdo