💄 Move the connection indicator

lib/widgets/connection_indicator.dart

@@ -4,6 +4,7 @@ import 'package:gap/gap.dart';
 import 'package:material_symbols_icons/symbols.dart';
 import 'package:provider/provider.dart';
 import 'package:styled_widget/styled_widget.dart';
+import 'package:surface/providers/config.dart';
 import 'package:surface/providers/userinfo.dart';
 import 'package:surface/providers/websocket.dart';
 
@@ -13,6 +14,9 @@ class ConnectionIndicator extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final ws = context.watch<WebSocketProvider>();
+    final cfg = context.watch<ConfigProvider>();
+
+    final marginLeft = cfg.drawerIsCollapsed ? 0.0 : cfg.drawerIsExpanded ? 304.0 : 80.0;
 
     return ListenableBuilder(
       listenable: ws,
@@ -22,6 +26,7 @@ class ConnectionIndicator extends StatelessWidget {
 
         return IgnorePointer(
           ignoring: !show,
+          child: Center(
             child: GestureDetector(
               child: Material(
                 elevation: 2,
@@ -29,13 +34,16 @@ class ConnectionIndicator extends StatelessWidget {
                 color: Theme.of(context).colorScheme.secondaryContainer,
                 child: ua.isAuthorized
                     ? Row(
+                        mainAxisSize: MainAxisSize.min,
                         mainAxisAlignment: MainAxisAlignment.center,
                         crossAxisAlignment: CrossAxisAlignment.center,
                         children: [
                           if (ws.isBusy)
                             Text('serverConnecting').tr().textColor(Theme.of(context).colorScheme.onSecondaryContainer)
                           else if (!ws.isConnected)
-                          Text('serverDisconnected').tr().textColor(Theme.of(context).colorScheme.onSecondaryContainer)
+                            Text('serverDisconnected')
+                                .tr()
+                                .textColor(Theme.of(context).colorScheme.onSecondaryContainer)
                           else
                             Text('serverConnected').tr().textColor(Theme.of(context).colorScheme.onSecondaryContainer),
                           const Gap(8),
@@ -61,6 +69,7 @@ class ConnectionIndicator extends StatelessWidget {
                 }
               },
             ),
+          ).padding(left: marginLeft),
         );
       },
     );

lib/widgets/context_menu.dart

@@ -28,7 +28,7 @@ class ContextMenuArea extends StatelessWidget {
           // Leave padding for side navigation
           mousePosition = cfg.drawerIsExpanded
               ? mousePosition.copyWith(dx: mousePosition.dx - 304 * 2)
-              : mousePosition.copyWith(dx: mousePosition.dx - 72 * 2);
+              : mousePosition.copyWith(dx: mousePosition.dx - 80 * 2);
         }
       },
       child: GestureDetector(

lib/widgets/navigation/app_rail_navigation.dart

@@ -31,7 +31,9 @@ class _AppRailNavigationState extends State<AppRailNavigation> {
       builder: (context, _) {
         final destinations = nav.destinations.where((ele) => ele.isPinned).toList();
 
-        return NavigationRail(
+        return SizedBox(
+          width: 80,
+          child: NavigationRail(
             selectedIndex:
                 nav.currentIndex != null && nav.currentIndex! < nav.pinnedDestinationCount ? nav.currentIndex : null,
             destinations: [
@@ -59,6 +61,7 @@ class _AppRailNavigationState extends State<AppRailNavigation> {
               nav.setIndex(idx);
               GoRouter.of(context).goNamed(destinations[idx].screen);
             },
+          ),
         );
       },
     );

lib/widgets/navigation/app_scaffold.dart

@@ -140,6 +140,7 @@ class AppRootScaffold extends StatelessWidget {
     );
 
     final safeTop = MediaQuery.of(context).padding.top;
+    final safeBottom = MediaQuery.of(context).padding.bottom;
 
     return Scaffold(
       key: globalRootScaffoldKey,
@@ -191,7 +192,10 @@ class AppRootScaffold extends StatelessWidget {
             ],
           ),
           Positioned(top: safeTop > 0 ? safeTop : 16, right: 8, child: NotifyIndicator()),
-          Positioned(top: safeTop > 0 ? safeTop : 16, left: 8, child: ConnectionIndicator()),
+          if (ResponsiveBreakpoints.of(context).smallerOrEqualTo(MOBILE))
+            Positioned(bottom: safeBottom > 0 ? safeBottom : 16, left: 0, right: 0, child: ConnectionIndicator())
+          else
+            Positioned(top: safeTop > 0 ? safeTop : 16, left: 0, right: 0, child: ConnectionIndicator()),
         ],
       ),
       drawer: !isExpandedDrawer ? AppNavigationDrawer() : null,

lib/widgets/notify_indicator.dart

@@ -84,6 +84,7 @@ class _NotifyIndicatorState extends State<NotifyIndicator> with SingleTickerProv
             ignoring: !show,
             child: GestureDetector(
               child: Animate(
+                autoPlay: false,
                 controller: _animationController,
                 effects: [
                   SlideEffect(