Update example

Signed-off-by: Hans Kokx <hans.d.kokx@gmail.com>

example/lib/main.dart

@@ -81,17 +81,37 @@ class _HomeScreenState extends State<HomeScreen> {
   @override
   Widget build(BuildContext context) {
     final bool isSignedIn = Arcane.auth.isSignedIn.value;
-    return Center(
+    return GridView.extent(
-      child: SingleChildScrollView(
+      maxCrossAxisExtent: 300,
-        child: Column(
+      padding: const EdgeInsets.all(16),
-          mainAxisAlignment: MainAxisAlignment.center,
       children: [
         Card(
           child: Padding(
             padding: const EdgeInsets.all(8.0),
             child: Column(
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              crossAxisAlignment: CrossAxisAlignment.stretch,
               children: [
+                Text(
+                  "Theme",
+                  style: Theme.of(context).textTheme.headlineSmall,
+                ),
                 Column(
+                  children: [
+                    Switch(
+                      value: Arcane.theme.currentTheme == ThemeMode.dark,
+                      thumbIcon: WidgetStateProperty.resolveWith((states) {
+                        if (states.contains(WidgetState.selected)) {
+                          return const Icon(Icons.dark_mode);
+                        }
+                        return const Icon(Icons.light_mode);
+                      }),
+                      onChanged: (_) {
+                        Arcane.theme.switchTheme();
+                      },
+                    ),
+                    Row(
+                      mainAxisSize: MainAxisSize.min,
                       children: [
                         Checkbox(
                           value: Arcane.theme.isFollowingSystemTheme,
@@ -105,20 +125,10 @@ class _HomeScreenState extends State<HomeScreen> {
                             }
                           },
                         ),
-                        const Text("Use system theme"),
+                        const Text("Follow system"),
                       ],
                     ),
-                    Switch(
+                  ],
-                      value: Arcane.theme.currentTheme == ThemeMode.dark,
-                      thumbIcon: WidgetStateProperty.resolveWith((states) {
-                        if (states.contains(WidgetState.selected)) {
-                          return const Icon(Icons.dark_mode);
-                        }
-                        return const Icon(Icons.light_mode);
-                      }),
-                      onChanged: (_) {
-                        Arcane.theme.switchTheme();
-                      },
                 ),
                 Text(
                   "The current theme mode is ${context.themeMode.name} and\n"
@@ -129,24 +139,27 @@ class _HomeScreenState extends State<HomeScreen> {
             ),
           ),
         ),
+        Card(
+          child: Padding(
+            padding: const EdgeInsets.all(8.0),
+            child: Column(
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              crossAxisAlignment: CrossAxisAlignment.stretch,
+              children: [
                 Text(
-              "Authentication status: ${Arcane.auth.status.name}",
+                  "Authentication",
+                  style: Theme.of(context).textTheme.headlineSmall,
                 ),
-            if (isSignedIn)
                 ElevatedButton(
-                child: const Text("Sign out"),
+                  child: Text(isSignedIn ? "Sign out" : "Sign in"),
                   onPressed: () async {
+                    if (isSignedIn) {
                       await Arcane.auth.logOut(
                         onLoggedOut: () async {
                           setState(() {});
                         },
                       );
-                },
+                    } else {
-              ),
-            if (!isSignedIn)
-              ElevatedButton(
-                child: const Text("Sign in"),
-                onPressed: () async {
                       await Arcane.auth.login<Credentials>(
                         input: (
                           email: "email",
@@ -156,11 +169,17 @@ class _HomeScreenState extends State<HomeScreen> {
                           setState(() {});
                         },
                       );
+                    }
                   },
                 ),
+                Center(
+                  child: Text("Status: ${Arcane.auth.status.name}"),
+                ),
               ],
             ),
           ),
+        ),
+      ],
     );
   }
 }