You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
kmftools/weer_app/templates/index.html

48 lines
1.7 KiB

<!DOCTYPE html>
<html lang="nl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Weervoorspelling</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
<h1>Weervoorspelling per dag</h1>
<div class="weather-container">
{% for day in weather_data %}
<div class="weather-box
{% if day.avg_solar <= 20 %}
low-solar
{% elif day.avg_solar <= 50 %}
medium-solar
{% elif day.avg_solar <= 75 %}
high-solar
{% else %}
very-high-solar
{% endif %}
">
<h2>{{ day.dag_van_de_week }} - {{ day.date }}</h2>
<p><strong>Gemiddelde temperatuur:</strong> {{ '%.1f' % day.avg_temp }} °C</p>
<p><strong>Weersomstandigheden:</strong> {{ day.descriptions }}</p>
<p><strong>Windkracht:</strong> {{ day.windkracht_tekst }} (Windkracht {{ day.windkracht_num }})</p>
<!-- Zonprestatie (afhankelijk van de solar performance) -->
<div class="sun-rating">
{% if day.avg_solar <= 20 %}
🌑
{% elif day.avg_solar <= 50 %}
🌒
{% elif day.avg_solar <= 75 %}
🌞🌞
{% else %}
🌞🌞🌞
{% endif %}
</div>
</div>
{% endfor %}
</div>
</body>
</html>