Wiederherstellung von Funktionalität

This commit is contained in:
2026-01-23 23:24:42 +01:00
parent 744a84663e
commit b22df1dc56
3 changed files with 242 additions and 127 deletions

View File

@@ -1,50 +1,83 @@
<!DOCTYPE html>
<html lang="de" class="{% if current_user.theme == 'dark' %}dark{% endif %}">
<html lang="de">
<head>
<meta charset="UTF-8">
<title>{{ driver.name }} - Details</title>
<script>
tailwind.config = { darkMode: 'class' }
</script>
<script src="https://cdn.tailwindcss.com"></script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700;900&display=swap');
:root {
--bg-body: {{ '#0a0e17' if current_user.theme == 'dark' else '#f8fafc' }};
--bg-card: {{ '#0f172a' if current_user.theme == 'dark' else '#ffffff' }};
--text-main: {{ '#e2e8f0' if current_user.theme == 'dark' else '#1e293b' }};
--border-color: {{ 'rgba(255,255,255,0.05)' if current_user.theme == 'dark' else '#e2e8f0' }};
}
body {
background-color: var(--bg-body);
color: var(--text-main);
font-family: 'Inter', sans-serif;
transition: background 0.3s ease;
}
.card {
background: var(--bg-card);
border: 1px solid var(--border-color);
box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
}
</style>
</head>
<body class="bg-slate-50 text-slate-900 dark:bg-[#0a0e17] dark:text-white p-8 transition-colors">
<body class="p-4 md:p-8">
<div class="max-w-4xl mx-auto">
<div class="flex justify-between items-center mb-8">
<h1 class="text-4xl font-black uppercase italic">{{ driver.name }} <span class="text-blue-500">#{{ driver.car_number }}</span></h1>
<a href="/" class="bg-slate-200 dark:bg-slate-800 text-slate-800 dark:text-white px-4 py-2 rounded text-xs uppercase font-bold hover:bg-blue-500 hover:text-white transition-all">Zurück</a>
<!-- Header -->
<div class="flex flex-col md:flex-row justify-between items-start md:items-center mb-12 gap-6">
<div>
<h1 class="text-5xl font-black italic uppercase tracking-tighter">
{{ driver.name }} <span class="text-blue-600">#{{ driver.car_number }}</span>
</h1>
<p class="text-slate-500 font-bold uppercase tracking-widest text-xs mt-2">Driver Profile & Schedule</p>
</div>
<a href="/" class="bg-blue-600 text-white px-8 py-4 rounded-2xl text-xs uppercase font-black hover:bg-blue-700 transition-all shadow-lg shadow-blue-600/20">Zurück zum Planner</a>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
<div class="bg-white dark:bg-slate-900/50 p-4 rounded-xl border border-slate-200 dark:border-white/5 shadow-sm">
<div class="text-[10px] text-slate-500 uppercase font-bold">Verbrauch/Runde</div>
<div class="text-2xl font-black text-green-600 dark:text-green-500">{{ driver.cons_per_lap }}L</div>
<!-- Stats Grid -->
<div class="grid grid-cols-1 sm:grid-cols-3 gap-6 mb-12">
<div class="card p-6 rounded-3xl">
<div class="text-[10px] text-slate-500 uppercase font-bold mb-1 tracking-widest">Verbrauch / Runde</div>
<div class="text-4xl font-black text-green-500">{{ driver.cons_per_lap }}<span class="text-lg ml-1">L</span></div>
</div>
<div class="bg-white dark:bg-slate-900/50 p-4 rounded-xl border border-slate-200 dark:border-white/5 shadow-sm">
<div class="text-[10px] text-slate-500 uppercase font-bold">Ø Rundenzeit</div>
<div class="text-2xl font-black text-blue-600 dark:text-blue-500">{{ driver.avg_lap_time }}s</div>
<div class="card p-6 rounded-3xl">
<div class="text-[10px] text-slate-500 uppercase font-bold mb-1 tracking-widest">Ø Rundenzeit</div>
<div class="text-4xl font-black text-blue-600">{{ driver.avg_lap_time }}<span class="text-lg ml-1">s</span></div>
</div>
<div class="bg-white dark:bg-slate-900/50 p-4 rounded-xl border border-slate-200 dark:border-white/5 shadow-sm">
<div class="text-[10px] text-slate-500 uppercase font-bold">Stints Gesamt</div>
<div class="text-2xl font-black text-orange-600 dark:text-orange-500">{{ stints|length }}</div>
<div class="card p-6 rounded-3xl">
<div class="text-[10px] text-slate-500 uppercase font-bold mb-1 tracking-widest">Anzahl Stints</div>
<div class="text-4xl font-black text-orange-500">{{ stints|length }}</div>
</div>
</div>
<h2 class="text-xl font-bold mb-4 uppercase text-slate-400">Geplante Einsätze</h2>
<div class="space-y-2">
<!-- Schedule -->
<h2 class="text-2xl font-black mb-6 uppercase tracking-tight italic flex items-center gap-3">
<span class="w-8 h-1 bg-blue-600 rounded-full"></span>
Einsatzplanung
</h2>
<div class="space-y-4">
{% for s in stints %}
<div class="bg-white dark:bg-slate-900/80 p-4 rounded-lg flex justify-between items-center border-l-4 border-blue-600 shadow-sm">
<div class="card p-6 rounded-3xl flex justify-between items-center border-l-8 border-blue-600 transition-transform hover:scale-[1.01]">
<div>
<div class="text-[10px] text-slate-500 font-mono">{{ s.date }}</div>
<div class="text-lg font-black">{{ s.start }} - {{ s.end }}</div>
<div class="text-[10px] text-slate-500 font-bold uppercase tracking-widest mb-1">{{ s.date }}</div>
<div class="text-3xl font-black tracking-tight">{{ s.start }} {{ s.end }}</div>
</div>
<div class="text-right">
<div class="text-xs font-bold text-slate-500 uppercase">Stint #{{ s.number }}</div>
<div class="text-sm font-black">{{ s.laps }} Runden</div>
<div class="text-sm font-black uppercase text-blue-600 mb-1">Stint #{{ s.number }}</div>
<div class="text-xs font-bold text-slate-500">{{ s.laps }} Runden · {{ s.fuel }}L Start</div>
</div>
</div>
{% else %}
<div class="text-center py-12 text-slate-500 italic">Keine Stints für diesen Fahrer geplant.</div>
<div class="text-center py-20 card rounded-[2rem] opacity-50">
<p class="font-black uppercase tracking-widest text-slate-400">Keine Stints geplant</p>
</div>
{% endfor %}
</div>
</div>