chore: update space view buttons design (#2126)

assets/l10n/intl_en.arb

@@ -4811,5 +4811,6 @@
   "inviteAndLaunch": "Invite and launch",
   "createOwnChat": "Create your own chat",
   "pleaseEnterInt": "Please enter a number",
-  "home": "Home"
+  "home": "Home",
+  "join": "Join"
 } 

lib/pangea/spaces/widgets/space_filter_buttons.dart

@@ -10,69 +10,44 @@ class SpaceFilterButtons extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final theme = Theme.of(context);
     return SliverList(
       delegate: SliverChildListDelegate(
         [
           const SizedBox(height: 16.0),
           Padding(
-            padding: const EdgeInsets.symmetric(
-              horizontal: 8.0,
-              vertical: 4.0,
+            padding: const EdgeInsets.all(4.0),
+            child: Center(
+              child: SizedBox(
+                width: 100.0,
+                child: FloatingActionButton.extended(
+                  onPressed: () =>
+                      SpaceCodeUtil.joinWithSpaceCodeDialog(context),
+                  icon: const Icon(Icons.join_right_outlined),
+                  label: Text(
+                    L10n.of(context).join,
+                    overflow: TextOverflow.fade,
                   ),
-            child: ElevatedButton(
-              style: ElevatedButton.styleFrom(
-                backgroundColor: theme.colorScheme.primary,
-                padding: const EdgeInsets.all(0),
                 ),
-              onPressed: () => SpaceCodeUtil.joinWithSpaceCodeDialog(context),
-              child: Row(
-                spacing: 16.0,
-                mainAxisAlignment: MainAxisAlignment.center,
-                children: [
-                  Icon(
-                    Icons.join_right_outlined,
-                    color: theme.colorScheme.onPrimary,
-                  ),
-                  Text(
-                    L10n.of(context).joinByCode,
-                    style: theme.textTheme.bodyMedium?.copyWith(
-                      color: theme.colorScheme.onPrimary,
-                    ),
-                  ),
-                ],
               ),
             ),
           ),
           Padding(
-            padding: const EdgeInsets.symmetric(
-              horizontal: 8.0,
-              vertical: 2.0,
-            ),
-            child: ElevatedButton(
-              style: ElevatedButton.styleFrom(
-                backgroundColor: theme.colorScheme.primary,
-                padding: const EdgeInsets.all(0),
-              ),
+            padding: const EdgeInsets.all(4.0),
+            child: Center(
+              child: SizedBox(
+                width: 100.0,
+                child: FloatingActionButton.extended(
                   onPressed: () => context.go('/rooms/newspace'),
-              child: Row(
-                spacing: 16.0,
-                mainAxisAlignment: MainAxisAlignment.center,
-                children: [
-                  Icon(
-                    Icons.add,
-                    color: theme.colorScheme.onPrimary,
-                  ),
-                  Text(
-                    L10n.of(context).createASpace,
-                    style: theme.textTheme.bodyMedium?.copyWith(
-                      color: theme.colorScheme.onPrimary,
+                  icon: const Icon(Icons.add),
+                  label: Text(
+                    L10n.of(context).space,
+                    overflow: TextOverflow.fade,
                   ),
                 ),
-                ],
               ),
             ),
           ),
+          const SizedBox(height: 16.0),
         ],
       ),
     );