🐛 Make system bar appear in call screen

lib/main.dart

@@ -19,6 +19,7 @@ import 'package:solian/providers/content/realm.dart';
 import 'package:solian/providers/friend.dart';
 import 'package:solian/providers/account_status.dart';
 import 'package:solian/router.dart';
+import 'package:solian/shells/system_shell.dart';
 import 'package:solian/theme.dart';
 import 'package:solian/translations.dart';
 
@@ -85,8 +86,10 @@ class SolianApp extends StatelessWidget {
       fallbackLocale: const Locale('en', 'US'),
       onInit: () => _initializeProviders(context),
       builder: (context, child) {
-        return ScaffoldMessenger(
+        return SystemShell(
-          child: child ?? const SizedBox(),
+          child: ScaffoldMessenger(
+            child: child ?? const SizedBox(),
+          ),
         );
       },
     );

lib/shells/root_shell.dart

@@ -1,7 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 import 'package:go_router/go_router.dart';
-import 'package:solian/platform.dart';
 import 'package:solian/router.dart';
 import 'package:solian/theme.dart';
 import 'package:solian/widgets/navigation/app_navigation.dart';
@@ -32,49 +31,33 @@ class RootShell extends StatelessWidget {
         AppNavigation.destinationPages.contains(routeName);
 
     return Scaffold(
-      body: Column(
+      body: SolianTheme.isLargeScreen(context)
-        children: [
+          ? Row(
-          if (PlatformInfo.isMacOS)
+              children: [
-            Container(
+                if (showNavigation) const AppNavigationRail(),
-              height: 28,
+                if (showNavigation)
-              color: Theme.of(context).colorScheme.surface,
+                  const VerticalDivider(thickness: 0.3, width: 1),
-            ),
+                Expanded(child: child),
-          if (PlatformInfo.isMacOS)
+              ],
-            const Divider(
+            )
-              thickness: 0.3,
+          : Stack(
-              height: 0.3,
+              children: [
-            ),
+                child,
-          Expanded(
+                Positioned(
-            child: SolianTheme.isLargeScreen(context)
+                  bottom: 0,
-                ? Row(
+                  left: 0,
-                    children: [
+                  right: 0,
-                      if (showNavigation) const AppNavigationRail(),
+                  child: const AppNavigationBottomBar()
-                      if (showNavigation)
+                      .animate(target: showBottom ? 0 : 1)
-                        const VerticalDivider(thickness: 0.3, width: 1),
+                      .slideY(
-                      Expanded(child: child),
+                        duration: 250.ms,
-                    ],
+                        begin: 0,
-                  )
+                        end: 1,
-                : Stack(
+                        curve: Curves.easeInToLinear,
-                    children: [
-                      child,
-                      Positioned(
-                        bottom: 0,
-                        left: 0,
-                        right: 0,
-                        child: const AppNavigationBottomBar()
-                            .animate(target: showBottom ? 0 : 1)
-                            .slideY(
-                              duration: 250.ms,
-                              begin: 0,
-                              end: 1,
-                              curve: Curves.easeInToLinear,
-                            ),
                       ),
-                    ],
+                ),
-                  ),
+              ],
-          ),
+            ),
-        ],
-      ),
     );
   }
 }

lib/shells/system_shell.dart

@@ -0,0 +1,29 @@
+import 'package:flutter/material.dart';
+import 'package:solian/platform.dart';
+
+class SystemShell extends StatelessWidget {
+  final Widget child;
+
+  const SystemShell({super.key, required this.child});
+
+  @override
+  Widget build(BuildContext context) {
+    if (PlatformInfo.isMacOS) {
+      return Column(
+        children: [
+          Container(
+            height: 28,
+            color: Theme.of(context).colorScheme.surface,
+          ),
+          const Divider(
+            thickness: 0.3,
+            height: 0.3,
+          ),
+          Expanded(child: child),
+        ],
+      );
+    }
+
+    return child;
+  }
+}