Merge branch 'playerbar-timestamp-move' into dev

DeepDrftPublic.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor

@@ -18,8 +18,6 @@ else
                                          IsLoading="IsLoading"
                                          IsStreaming="IsStreaming"
                                          LoadProgress="LoadProgress"
-                                         DisplayTime="DisplayTime"
-                                         Duration="Duration"
                                          TogglePlayPause="@TogglePlayPause"
                                          Stop="@Stop"
                                          Class="transport-zone"/>

DeepDrftPublic.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor.css

@@ -89,7 +89,7 @@
 @media (min-width: 600px) {
     ::deep .transport-zone { order: 1; }
     ::deep .seek-zone { order: 2; flex-grow: 1; flex-basis: 0; }
-    ::deep .volume-controls { order: 3; align-self: flex-start; }
+    ::deep .volume-controls { order: 3; }
 }
 
 /* Narrow (< 600px): transport + volume on top row, seek full-width below */

DeepDrftPublic.Client/Controls/AudioPlayerBar/PlayerSeekZone.razor

@@ -15,4 +15,5 @@
                    Immediate="true"
                    Disabled="@(!CanSeek)"/>
     </div>
+    <TimestampLabel CurrentTime="DisplayTime" Duration="@Duration"/>
 </MudStack>

DeepDrftPublic.Client/Controls/AudioPlayerBar/PlayerTransportZone.razor

@@ -1,19 +1,16 @@
 @namespace DeepDrftPublic.Client.Controls.AudioPlayerBar
 
-<MudStack Row="false" AlignItems="AlignItems.Center" Spacing="2" Class="@Class">
-    <MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1">
-        <PlayerControls IsPlaying="IsPlaying"
-                        IsLoaded="IsLoaded"
-                        TogglePlayPause="TogglePlayPause"
-                        Stop="Stop"/>
-        @if (IsLoading && !IsStreaming)
-        {
-            <MudProgressCircular Color="Color.Tertiary"
-                                 Size="Size.Small"
-                                 Max="1D"
-                                 Value="@LoadProgress"
-                                 Indeterminate="@(LoadProgress == 0)"/>
-        }
-    </MudStack>
-    <TimestampLabel CurrentTime="DisplayTime" Duration="Duration"/>
+<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1" Class="@Class">
+    <PlayerControls IsPlaying="IsPlaying"
+                    IsLoaded="IsLoaded"
+                    TogglePlayPause="TogglePlayPause"
+                    Stop="Stop"/>
+    @if (IsLoading && !IsStreaming)
+    {
+        <MudProgressCircular Color="Color.Tertiary"
+                             Size="Size.Small"
+                             Max="1D"
+                             Value="@LoadProgress"
+                             Indeterminate="@(LoadProgress == 0)"/>
+    }
 </MudStack>

DeepDrftPublic.Client/Controls/AudioPlayerBar/PlayerTransportZone.razor.cs

@@ -9,8 +9,6 @@ public partial class PlayerTransportZone : ComponentBase
     [Parameter] public bool IsLoading { get; set; }
     [Parameter] public bool IsStreaming { get; set; }
     [Parameter] public double LoadProgress { get; set; }
-    [Parameter] public double DisplayTime { get; set; }
-    [Parameter] public double? Duration { get; set; }
     [Parameter] public EventCallback TogglePlayPause { get; set; }
     [Parameter] public EventCallback Stop { get; set; }
     [Parameter] public string? Class { get; set; }

DeepDrftPublic.Client/Controls/AudioPlayerBar/PlayerTransportZone.razor.css

@@ -2,13 +2,3 @@
 .transport-zone {
     min-width: 180px;
 }
-
-/* Narrow (< 600px): lay the transport root horizontally (controls beside
-   timestamp) so it fits on one line next to VolumeControls. Scoped to the
-   root .transport-zone stack so the nested controls stack is untouched. */
-@media (max-width: 599.98px) {
-    .transport-zone {
-        flex-direction: row !important;
-        align-items: center;
-    }
-}