Playtime records from pt_events; sticky top bar, page scroll locked under the drawer

Records: the most bomb plants, defuses, knife, Zeus and headshot kills for
the last 7 days, 30 days or all time, and each player's counts, when
PlaytimeHistory 0.2.0's pt_events is there. The public site's top bar now
sticks the whole way down, Playtime comes after Server, and only the
player drawer scrolls while it's open.
This commit is contained in:
Astra 2026-10-04 21:37:42 +01:00
parent 6d0fc6e463
commit 7004945d49
9 changed files with 296 additions and 27 deletions

View file

@ -27,7 +27,13 @@
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
/* min-height, not height: a body exactly one screen tall would carry the sticky top bar away
once the page scrolls past it. */
html { height: 100%; }
body { margin: 0; min-height: 100%; }
/* While a player's drawer is open only the drawer scrolls (see common.js). */
html.drawer-open { overflow: hidden; }
html.drawer-open body { overflow: hidden; }
body {
background: var(--bg);
@ -710,6 +716,7 @@ td.num, th.num { text-align: right; white-space: nowrap; }
}
.drawer {
overscroll-behavior: contain;
position: fixed;
top: 0;
right: 0;
@ -1159,6 +1166,14 @@ tr:nth-child(2) .pt-place { color: #c9ced8; }
tr:nth-child(3) .pt-place { color: #d08a52; }
.pt-who .rank { margin-left: 6px; }
.pt-records { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; padding: 18px; }
.pt-record { display: grid; align-content: start; gap: 10px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg); }
.pt-record ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; font-size: 14px; counter-reset: rec; }
.pt-record li { display: flex; gap: 8px; align-items: baseline; cursor: pointer; counter-increment: rec; }
.pt-record li::before { content: counter(rec); width: 1.2em; color: var(--faint); font: 700 14px/1 var(--display); }
.pt-record li span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-record li:hover span { text-decoration: underline; }
.pt-record p { margin: 0; font-size: 14px; }
.pt-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.pt-stats div { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg); }
.pt-stats b { font: 600 22px/1 var(--display); }