blob: 09f1200b3da616b3538b100823bbea132addd3b7 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Radar — Canberra</title>
<style>
html, body { margin: 0; background: #000; min-height: 100vh; }
body { display: flex; flex-direction: column; min-height: 100vh; }
nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 0.6em;
padding: 0.6em; font-family: sans-serif; }
nav a { color: #aaa; text-decoration: none; font-size: 0.95em;
padding: 0.35em 0.9em; border: 1px solid #333; border-radius: 0.3em; }
nav a:hover { color: #fff; border-color: #777; }
nav a.current { color: #fff; border-color: #888; background: #1a1a1a; }
main { flex: 1; display: flex; justify-content: center; align-items: center;
min-height: 0; }
img { width: 100%; max-width: 512px; max-height: 100%; height: auto;
display: block; }
</style>
</head>
<body>
<nav>
<a href="/sydney/">Sydney</a>
<a href="/brisbane/">Brisbane</a>
<a class="current" href="/canberra/">Canberra</a>
<a href="/cairns/">Cairns</a>
<a href="https://pestrel.com/">Synoptic</a>
</nav>
<main><img src="/idr403-loop.apng" alt="Canberra radar loop"></main>
</body>
</html>
|
