ttemplate.html - scoreboard - Interactive scoreboard for CTF-like games
(HTM) git clone git://git.z3bra.org/scoreboard.git
(DIR) Log
(DIR) Files
(DIR) Refs
---
ttemplate.html (1559B)
---
1 <!DOCTYPE HTML>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <meta name="author" content="wgs">
6 <meta name="viewport" content="width=device-width">
7 <link rel="icon" type="image/ico" href="/favicon.ico" />
8 <title>Scores</title>
9 <style>
10 body {
11 color: #eee;
12 background-color: #1d1d1d;
13 background-image: radial-gradient(rgba(255,255,255,0.2) 1px, transparent 0);
14 background-size: 8px 8px;
15 height: 100vh;
16 margin: 0;
17 }
18 main {
19 width: 80vw;
20 max-width: 540px;
21 height: 100%;
22 margin: 0 auto;
23 display: flex;
24 flex-direction: column;
25 align-items: center;
26 }
27 h1 {
28 font-size: 4rem;
29 }
30 table {
31 border-radius: 12px;
32 background-color: #1d1d1d;
33 padding: 1ch;
34 max-width: 100%;
35 margin: auto;
36 text-align:center;
37 font-size: 1.2rem;
38 font-family: monospace;
39 }
40 th { padding: 1ch 1ch; }
41 td { padding: 0ch 1ch; }
42 tr.unset { color: #888; }
43 tr > td:last-of-type { text-align:right; }
44 p.copyright { text-align: center; }
45 p.copyright > a { color: #db4; }
46 </style>
47 </head>
48 <body>
49 <main>
50 <h1>Scores</h1>
51 <table>
52 <thead><tr><th>RANK</th><th>NAME</th><th>FLAGS</th><th>SCORE</th></tr></thead>
53 <tbody>
54 {{range .Players}} <tr><td>{{.Rank}}<td>{{.Name}}</td><td><abbr title="{{.Badge}}">{{.Flag}}</abbr></td><td>{{.Score}}</td></tr>
55 {{end}}
56 {{range .Placeholders}} <tr class='unset'><td>{{.Rank}}<td>{{.Name}}</td><td>{{.Flag}}</td><td>{{.Score}}</td></tr>
57 {{end}}
58 </tbody>
59 </table>
60 <div style="flex-grow:2"></div>
61 <p class='copyright'>Copyright (C) <a href="https://z3bra.org">wgs</a>, 2024-2025</p>
62 </main>
63 </body>
64 </html>