From 8724848fce7ef7082e084dd763a0f08753a73110 Mon Sep 17 00:00:00 2001
From: Thomas <9749173+uhthomas@users.noreply.github.com>
Date: Fri, 27 Mar 2026 14:10:19 +0000
Subject: [PATCH] chore(mobile): reduce spacing on video controls (#27313)

The spacing was required for the old slider, but the new one has its own
spacing and makes it redundant. There is too much now, and we've
received feedback that it should be less sparse. The default track
height of 16px is an improvement over the old track height, but it is
very thick. A middleground of 12px might be better.
---
 .../widgets/asset_viewer/bottom_bar.widget.dart | 17 +++++++----------
 mobile/lib/theme/theme_data.dart                |  1 +
 .../widgets/asset_viewer/video_controls.dart    | 10 +++++-----
 3 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/mobile/lib/presentation/widgets/asset_viewer/bottom_bar.widget.dart b/mobile/lib/presentation/widgets/asset_viewer/bottom_bar.widget.dart
index cc171f4490..b51960bb05 100644
--- a/mobile/lib/presentation/widgets/asset_viewer/bottom_bar.widget.dart
+++ b/mobile/lib/presentation/widgets/asset_viewer/bottom_bar.widget.dart
@@ -71,16 +71,13 @@ class ViewerBottomBar extends ConsumerWidget {
                 ),
                 child: SafeArea(
                   top: false,
-                  child: Padding(
-                    padding: const EdgeInsets.only(top: 16),
-                    child: Column(
-                      mainAxisSize: MainAxisSize.min,
-                      children: [
-                        if (asset.isVideo) VideoControls(videoPlayerName: asset.heroTag),
-                        if (!isReadonlyModeEnabled)
-                          Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: actions),
-                      ],
-                    ),
+                  child: Column(
+                    mainAxisSize: MainAxisSize.min,
+                    children: [
+                      if (asset.isVideo) VideoControls(videoPlayerName: asset.heroTag),
+                      if (!isReadonlyModeEnabled)
+                        Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: actions),
+                    ],
                   ),
                 ),
               ),
diff --git a/mobile/lib/theme/theme_data.dart b/mobile/lib/theme/theme_data.dart
index 69b8596490..7200d58dca 100644
--- a/mobile/lib/theme/theme_data.dart
+++ b/mobile/lib/theme/theme_data.dart
@@ -62,6 +62,7 @@ ThemeData getThemeData({required ColorScheme colorScheme, required Locale locale
     ),
     chipTheme: const ChipThemeData(side: BorderSide.none),
     sliderTheme: const SliderThemeData(
+      trackHeight: 12,
       // ignore: deprecated_member_use
       year2023: false,
     ),
diff --git a/mobile/lib/widgets/asset_viewer/video_controls.dart b/mobile/lib/widgets/asset_viewer/video_controls.dart
index 85707c82ea..ff782113c7 100644
--- a/mobile/lib/widgets/asset_viewer/video_controls.dart
+++ b/mobile/lib/widgets/asset_viewer/video_controls.dart
@@ -66,9 +66,9 @@ class VideoControls extends HookConsumerWidget {
     final isLoaded = duration != Duration.zero;
 
     return Padding(
-      padding: const EdgeInsets.all(24),
+      padding: const EdgeInsets.only(left: 16, right: 16, bottom: 12),
       child: Column(
-        spacing: 16,
+        spacing: 4,
         children: [
           Row(
             children: [
@@ -77,8 +77,8 @@ class VideoControls extends HookConsumerWidget {
                 padding: const EdgeInsets.all(12),
                 constraints: const BoxConstraints(),
                 icon: isFinished
-                    ? const Icon(Icons.replay, color: Colors.white, size: 32, shadows: _controlShadows)
-                    : AnimatedPlayPause(color: Colors.white, size: 32, playing: isPlaying, shadows: _controlShadows),
+                    ? const Icon(Icons.replay, color: Colors.white, shadows: _controlShadows)
+                    : AnimatedPlayPause(color: Colors.white, playing: isPlaying, shadows: _controlShadows),
                 onPressed: () => _toggle(ref, isCasting),
               ),
               const Spacer(),
@@ -91,7 +91,7 @@ class VideoControls extends HookConsumerWidget {
                   shadows: _controlShadows,
                 ),
               ),
-              const SizedBox(width: 16),
+              const SizedBox(width: 12),
             ],
           ),
           Slider(