186 lines
14 KiB
HTML
186 lines
14 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🧭</text></svg>">
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Prag Wetter 25.–26. Juli 2026</title>
|
||
<style>
|
||
* { box-sizing: border-box; }
|
||
html, body {
|
||
margin: 0; padding: 0;
|
||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
||
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
|
||
color: #eee;
|
||
min-height: 100vh;
|
||
}
|
||
.container { max-width: 900px; margin: 0 auto; padding: 40px 24px; }
|
||
h1 {
|
||
font-size: 38px;
|
||
margin: 0 0 8px 0;
|
||
background: linear-gradient(135deg, #4cc9f0 0%, #4361ee 100%);
|
||
-webkit-background-clip: text;
|
||
background-clip: text;
|
||
-webkit-text-fill-color: transparent;
|
||
}
|
||
.subtitle { color: #aaa; margin-bottom: 32px; font-size: 16px; }
|
||
|
||
.back-link {
|
||
display: inline-block;
|
||
margin-bottom: 24px;
|
||
color: #4cc9f0;
|
||
text-decoration: none;
|
||
font-size: 14px;
|
||
}
|
||
.back-link:hover { text-decoration: underline; }
|
||
|
||
.weather-cards {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
|
||
gap: 24px;
|
||
margin-bottom: 32px;
|
||
}
|
||
|
||
.weather-card {
|
||
background: rgba(255, 255, 255, 0.05);
|
||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||
border-radius: 16px;
|
||
padding: 28px;
|
||
backdrop-filter: blur(10px);
|
||
}
|
||
.weather-card .day {
|
||
font-size: 22px;
|
||
font-weight: 600;
|
||
color: #fff;
|
||
margin-bottom: 4px;
|
||
}
|
||
.weather-card .date {
|
||
color: #888;
|
||
font-size: 13px;
|
||
margin-bottom: 20px;
|
||
}
|
||
.weather-main {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 16px;
|
||
margin-bottom: 20px;
|
||
}
|
||
.weather-main .icon { font-size: 64px; line-height: 1; }
|
||
.weather-main .temp {
|
||
font-size: 48px;
|
||
font-weight: 700;
|
||
color: #fff;
|
||
}
|
||
.weather-main .temp-range {
|
||
font-size: 14px;
|
||
color: #aaa;
|
||
margin-top: 4px;
|
||
}
|
||
.weather-desc {
|
||
font-size: 16px;
|
||
color: #bbb;
|
||
margin-bottom: 16px;
|
||
}
|
||
.weather-details {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 12px;
|
||
font-size: 13px;
|
||
}
|
||
.weather-details .detail {
|
||
background: rgba(255, 255, 255, 0.05);
|
||
padding: 10px 12px;
|
||
border-radius: 6px;
|
||
}
|
||
.weather-details .label { color: #888; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; }
|
||
.weather-details .value { color: #fff; font-size: 16px; font-weight: 600; margin-top: 2px; }
|
||
|
||
.tip {
|
||
background: rgba(76, 201, 240, 0.1);
|
||
border-left: 3px solid #4cc9f0;
|
||
padding: 16px 20px;
|
||
border-radius: 4px;
|
||
margin: 16px 0;
|
||
font-size: 14px;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
.note {
|
||
background: rgba(255, 193, 7, 0.1);
|
||
border-left: 3px solid #ffc107;
|
||
padding: 16px 20px;
|
||
border-radius: 4px;
|
||
margin: 16px 0;
|
||
font-size: 14px;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
.link-card {
|
||
display: inline-block;
|
||
padding: 12px 24px;
|
||
background: linear-gradient(135deg, #4cc9f0 0%, #4361ee 100%);
|
||
color: #fff;
|
||
text-decoration: none;
|
||
border-radius: 8px;
|
||
font-weight: 600;
|
||
margin-top: 16px;
|
||
transition: transform 0.2s;
|
||
}
|
||
.link-card:hover { transform: scale(1.02); }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
|
||
<a href="index.html" class="back-link">← Zurück zur Übersicht</a>
|
||
|
||
<h1>🌤️ Prag Wetter</h1>
|
||
<p class="subtitle">Vorschau für das JGA-Wochenende 25.–26. Juli 2026 (historische Mittelwerte)</p>
|
||
|
||
<div class="note">
|
||
ℹ️ <strong>Hinweis:</strong> Das sind historische Mittelwerte für Ende Juli in Prag.
|
||
Aktuelle Vorhersage gibt's 1–2 Wochen vorher auf <a href="https://www.wetter.com/deutschland/tschechien/prag/ CZPR0001.html" target="_blank" style="color:#4cc9f0">wetter.com</a>,
|
||
<a href="https://www.yr.no/en/forecast/daily-table/2-3067696/Czechia/Prague/Prague" target="_blank" style="color:#4cc9f0">yr.no</a> oder
|
||
<a href="https://www.windy.com/-Weather-forecast-50.075/14.438?50.075,14.438,8" target="_blank" style="color:#4cc9f0">windy.com</a>.
|
||
</div>
|
||
|
||
<div class="weather-cards">
|
||
</div>
|
||
|
||
<div class="tip">
|
||
💡 <strong>Packliste-Tipp:</strong> Auch im Hochsommer sind abends 16–17°C möglich — leichte Jacke für die Geister-Tour & Altstadt einplanen.
|
||
Sonnenschutz nicht vergessen (Beer Boat, Outdoor-Aktivitäten).
|
||
</div>
|
||
|
||
<div class="tip">
|
||
☔ <strong>Schlechtwetter-Alternativen</strong> (alle indoor): Escape Room, KartPlanet, Bowling, Lasertag, Beer Spa, Burlesque Show, Casino.
|
||
</div>
|
||
|
||
<div style="margin: 24px 0; padding: 12px; background: #26262a; border-radius: 6px; font-size: 12px; color: #888; text-align: center;">🌐 Daten von <a href="https://open-meteo.com" target="_blank" style="color: #60a5fa;">Open-Meteo</a> · Letzte Aktualisierung: 26.06.2026 22:29 · Naechste: morgen 02:00</div>
|
||
|
||
<a href="packliste.html" class="link-card">🎒 Zur Packliste →</a>
|
||
|
||
</div>
|
||
|
||
<div class="section-title" style="margin-top: 48px;">📊 14-Tage-Trend Prag</div>
|
||
<div style="background: #26262a; border-radius: 12px; padding: 16px; overflow-x: auto; border: 1px solid #353539;">
|
||
<table style="width: 100%; border-collapse: collapse; font-size: 13px;">
|
||
<thead>
|
||
<tr style="border-bottom: 1px solid #353539; color: #aaa;">
|
||
<th style="text-align: left; padding: 8px;">Tag</th>
|
||
<th style="text-align: center; padding: 8px;">Wetter</th>
|
||
<th style="text-align: left; padding: 8px;">Temp</th>
|
||
<th style="text-align: left; padding: 8px;">Regen</th>
|
||
<th style="text-align: left; padding: 8px;">Menge</th>
|
||
<th style="text-align: left; padding: 8px;">Wind</th>
|
||
<th style="text-align: left; padding: 8px;">Beschreibung</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Sa 27. Jun</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>🌤️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>38° / 24°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>0%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>0 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>10 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Heiter</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>So 28. Jun</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>☁️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>40° / 25°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>10%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>0 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>11 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Bedeckt</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Mo 29. Jun</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>⛈️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>32° / 22°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>78%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>4.2 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>17 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Gewitter</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Di 30. Jun</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>⛈️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>27° / 22°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>80%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>11.7 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>8 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Gewitter</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Mi 1. Jul</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>⛈️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>24° / 16°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>59%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>13.8 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>16 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Gewitter</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Do 2. Jul</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>☁️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>26° / 13°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>35%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>0 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>8 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Bedeckt</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Fr 3. Jul</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>🌧️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>22° / 16°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>26%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>0.9 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>19 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Leichter Regen</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Sa 4. Jul</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>🌦️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>25° / 14°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>31%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>1.8 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>11 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Nieselregen</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>So 5. Jul</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>🌦️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>24° / 17°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>27%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>0.6 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>10 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Nieselregen</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Mo 6. Jul</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>☁️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>28° / 16°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>29%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>0 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>22 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Bedeckt</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Di 7. Jul</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>🌦️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>28° / 16°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>38%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>3.6 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>20 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Nieselregen</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Mi 8. Jul</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>🌦️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>21° / 14°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>37%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>0.6 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>17 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Nieselregen</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Do 9. Jul</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>🌤️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>25° / 14°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>20%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>0 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>10 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Heiter</td></tr><tr><td style='padding: 8px; border-bottom: 1px solid #353539;'>Fr 10. Jul</td><td style='padding: 8px; border-bottom: 1px solid #353539; text-align: center; font-size: 18px;'>☀️</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>28° / 16°</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>14%</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>0 mm</td><td style='padding: 8px; border-bottom: 1px solid #353539;'>12 km/h</td><td style='padding: 8px; border-bottom: 1px solid #353539; color: #aaa;'>Klar</td></tr>
|
||
</tbody>
|
||
</table>
|
||
<div style="margin-top: 12px; font-size: 12px; color: #888;">⭐ = JGA-Tag</div>
|
||
</div>
|
||
</body>
|
||
</html>
|