fix: mobile ui issues (#4074)

* fix: edit field ui issues

* fix: set desktop font weight to w500

frontend/appflowy_flutter/lib/mobile/presentation/database/card/card_detail/mobile_card_detail_screen.dart

@@ -216,10 +216,7 @@ class RowDetailFab extends StatelessWidget {
         final previousDisabled = rowIndex == 0;
         final nextDisabled = rowIndex == rowCount - 1;
 
-        return Positioned(
-          bottom: 0,
-          right: 0,
-          child: IntrinsicWidth(
+        return IntrinsicWidth(
           child: Container(
             height: 48,
             decoration: BoxDecoration(
@@ -289,7 +286,6 @@ class RowDetailFab extends StatelessWidget {
               ],
             ),
           ),
-          ),
         );
       },
     );

frontend/appflowy_flutter/lib/mobile/presentation/database/card/card_detail/widgets/_field_options.dart

@@ -36,11 +36,12 @@ class FieldOptions extends StatelessWidget {
         const _FieldHeader(),
         const VSpace(12.0),
         Expanded(
-          child: GridView.count(
+          child: SingleChildScrollView(
             controller: scrollController,
+            child: _GridView(
               crossAxisCount: 3,
-            childAspectRatio: 0.9,
-            mainAxisSpacing: 12.0,
+              mainAxisSpacing: 28,
+              itemWidth: 82,
               children: _supportedFieldTypes
                   .map(
                     (e) => _Field(
@@ -51,6 +52,7 @@ class FieldOptions extends StatelessWidget {
                   .toList(),
             ),
           ),
+        ),
       ],
     );
   }
@@ -95,22 +97,56 @@ class _Field extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final width = MediaQuery.of(context).size.width;
     return GestureDetector(
       onTap: onTap,
       child: Column(
+        mainAxisSize: MainAxisSize.min,
         children: [
           FlowySvg(
             type.svgData,
             blendMode: null,
-            size: Size.square(width / 4.0),
+            size: const Size.square(82),
           ),
           const VSpace(6.0),
           FlowyText(
             type.i18n,
+            fontSize: 15.0,
           ),
         ],
       ),
     );
   }
 }
+
+class _GridView extends StatelessWidget {
+  const _GridView({
+    required this.children,
+    required this.crossAxisCount,
+    required this.mainAxisSpacing,
+    required this.itemWidth,
+  });
+
+  final List<Widget> children;
+  final int crossAxisCount;
+  final double mainAxisSpacing;
+  final double itemWidth;
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: [
+        for (var i = 0; i < children.length; i += crossAxisCount)
+          Padding(
+            padding: EdgeInsets.only(bottom: mainAxisSpacing),
+            child: Row(
+              mainAxisAlignment: MainAxisAlignment.spaceAround,
+              children: [
+                for (var j = 0; j < crossAxisCount; j++)
+                  i + j < children.length ? children[i + j] : HSpace(itemWidth),
+              ],
+            ),
+          ),
+      ],
+    );
+  }
+}

frontend/appflowy_flutter/lib/mobile/presentation/home/recent_folder/mobile_home_recent_views.dart

@@ -24,12 +24,11 @@ class _MobileRecentFolderState extends State<MobileRecentFolder> {
         ),
       child: BlocBuilder<RecentViewsBloc, RecentViewsState>(
         builder: (context, state) {
-          final recentViews = state
-              .views
+          final ids = <String>{};
+          List<ViewPB> recentViews = state.views.reversed.toList();
+          recentViews.retainWhere((element) => ids.add(element.id));
           // only keep the first 10 items.
-              .reversed
-              .take(10)
-              .toList();
+          recentViews = recentViews.take(10).toList();
 
           if (recentViews.isEmpty) {
             return const SizedBox.shrink();

frontend/appflowy_flutter/lib/mobile/presentation/home/recent_folder/mobile_recent_view.dart

@@ -101,7 +101,7 @@ class _MobileRecentViewState extends State<MobileRecentView> {
                     // https://github.com/flutter/flutter/issues/31134
                     child: Stack(
                       children: [
-                        FlowyText(
+                        FlowyText.medium(
                           view.name,
                           maxLines: 2,
                           overflow: TextOverflow.ellipsis,

frontend/appflowy_flutter/lib/workspace/application/settings/appearance/base_appearance.dart

@@ -1,3 +1,4 @@
+import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:flowy_infra/size.dart';
 import 'package:flowy_infra/theme.dart';
 import 'package:flutter/material.dart';
@@ -23,7 +24,8 @@ abstract class BaseAppearance {
     double? lineHeight,
   }) {
     fontSize = fontSize ?? FontSizes.s12;
-    fontWeight = fontWeight ?? FontWeight.w400;
+    fontWeight = fontWeight ??
+        (PlatformExtension.isDesktopOrWeb ? FontWeight.w500 : FontWeight.w400);
     letterSpacing = fontSize * (letterSpacing ?? 0.005);
 
     final textStyle = TextStyle(