Die Sichtung merkt sich jetzt, WO der Vogel im Foto sitzt (vier Zahlen); die Anzeige schneidet daraus bei jedem Aufruf. Eine geaenderte Regel wirkt damit sofort auf den ganzen Bestand. Altbestand faellt auf das alte Bild zurueck.
43 lines
1.8 KiB
HTML
43 lines
1.8 KiB
HTML
{% load static i18n dex_extras %}{% get_current_language as LANG %}<!doctype html>
|
|
<html lang="{{ LANG }}">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Vogelalbum</title>
|
|
<link rel="stylesheet" href="{% static_v 'css/vogelalbum.css' %}">
|
|
<style>
|
|
/* Im iframe gibt es keine Navigation und keinen Seitenrand. */
|
|
body { background: transparent; }
|
|
.wrap { padding: 0; max-width: none; }
|
|
.widget { display: flex; gap: 14px; align-items: center;
|
|
background: var(--card); border: 1px solid var(--line);
|
|
border-radius: var(--radius); padding: 14px; }
|
|
.widget img { width: 96px; height: 74px; object-fit: cover;
|
|
border-radius: 10px; background: #0b120e; flex-shrink: 0; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="wrap">
|
|
<div class="widget">
|
|
{% if latest %}
|
|
{% if latest.kachel_url %}<img src="{{ latest.kachel_url }}" alt="{{ latest.effective_species.name }}">{% endif %}
|
|
<div style="min-width:0">
|
|
<div class="sub">{% trans "Zuletzt gesehen" %}</div>
|
|
<div style="font-weight:700; font-size:18px; margin:2px 0 4px">{{ latest.effective_species.name }}</div>
|
|
<div class="sub">{{ latest.started_at|zeitpunkt }} · {% widthratio latest.confidence 1 100 %}% {% trans "sicher" %}</div>
|
|
</div>
|
|
{% else %}
|
|
<div>
|
|
<div class="sub">Vogelalbum</div>
|
|
<div style="font-weight:700; font-size:18px">{% trans "Noch kein Gast" %}</div>
|
|
</div>
|
|
{% endif %}
|
|
<div style="margin-left:auto; text-align:right; flex-shrink:0">
|
|
<div style="font-weight:800; font-size:22px">{{ progress.species_seen }}<span class="sub" style="font-size:15px">/{{ progress.species_total }}</span></div>
|
|
<div class="sub">{% trans "Arten" %}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|