From 424330aad4f42aa8932877701c5b5a453a3aebc9 Mon Sep 17 00:00:00 2001
From: Brummel <mould@mycelium.de>
Date: Mon, 20 Apr 2026 15:12:19 +0200
Subject: [PATCH] Fix player seek bar alignment

Adjust the `justify-content` of the player to align items to the right,
and limit the `max-width` of the seek bar to prevent overflow and
improve layout on smaller screens.
---
 server/templates/case_recordings.html | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/server/templates/case_recordings.html b/server/templates/case_recordings.html
index d260c48..db8de6b 100644
--- a/server/templates/case_recordings.html
+++ b/server/templates/case_recordings.html
@@ -20,7 +20,7 @@ header form { margin: 0; }
 .pending { color: #888; font-style: italic; margin-top: 0.5em; }
 .failed { color: #b00; font-weight: bold; margin-top: 0.5em; }
 
-.player { display: inline-flex; align-items: center; gap: 0.5em; flex: 1; min-width: 20em; }
+.player { display: inline-flex; align-items: center; gap: 0.5em; flex: 1; justify-content: flex-end; }
 .player .play {
   position: relative;
   width: 2em; height: 2em;
@@ -55,7 +55,7 @@ header form { margin: 0; }
   background: #333;
   transform: translate(2px, -50%);
 }
-.player .seek { flex: 1; cursor: pointer; }
+.player .seek { flex: 1; max-width: 6em; cursor: pointer; }
 .player .time { font-family: monospace; font-size: 0.85em; color: #555; min-width: 5.5em; text-align: right; }
 
 .header-right { display: flex; align-items: center; gap: 0.8em; }
@@ -89,7 +89,6 @@ try {
 <h1>Aufnahmen</h1>
 {% if is_admin %}<div class="meta admin-only">{{ case_id }}</div>{% endif %}
 
-<h2>Aufnahmen ({{ recordings.len() }})</h2>
 {% for rec in recordings %}
 <div class="recording{% if rec.failed %} failed-row{% endif %}">
 <div class="recording-head">