fix: mobile UI (#4121)

* fix: use default splash color

* chore: improve card border UI

frontend/appflowy_flutter/lib/mobile/presentation/database/board/mobile_board_content.dart

@@ -8,6 +8,7 @@ import 'package:appflowy/plugins/database_view/grid/presentation/widgets/header/
 import 'package:appflowy/plugins/database_view/widgets/card/card.dart';
 import 'package:appflowy/plugins/database_view/widgets/card/card_cell_builder.dart';
 import 'package:appflowy/plugins/database_view/widgets/card/cells/card_cell.dart';
+import 'package:appflowy/workspace/application/settings/appearance/appearance_cubit.dart';
 import 'package:appflowy_board/appflowy_board.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flowy_infra_ui/flowy_infra_ui.dart';
@@ -201,22 +202,29 @@ class _MobileBoardContentState extends State<MobileBoardContent> {
   }
 
   BoxDecoration _makeBoxDecoration(BuildContext context) {
+    final themeMode = context.read<AppearanceSettingsCubit>().state.themeMode;
     return BoxDecoration(
-      color: Theme.of(context).colorScheme.surface,
+      color: Theme.of(context).colorScheme.background,
       borderRadius: const BorderRadius.all(Radius.circular(8)),
-      border: Border.fromBorderSide(
-        BorderSide(
-          color: Theme.of(context).colorScheme.outline.withOpacity(0.5),
-        ),
-      ),
-      boxShadow: [
-        // card shadow
-        BoxShadow(
-          color: Theme.of(context).colorScheme.outline.withOpacity(0.5),
-          blurRadius: 4,
-          offset: const Offset(0, 2),
-        ),
-      ],
+      border: themeMode == ThemeMode.light
+          ? Border.fromBorderSide(
+              BorderSide(
+                color: Theme.of(context).colorScheme.outline.withOpacity(0.5),
+              ),
+            )
+          : null,
+      boxShadow:
+          // The shadow is only visible in light mode.
+          themeMode == ThemeMode.light
+              ? [
+                  BoxShadow(
+                    color:
+                        Theme.of(context).colorScheme.outline.withOpacity(0.5),
+                    blurRadius: 4,
+                    offset: const Offset(0, 2),
+                  ),
+                ]
+              : null,
     );
   }
 }

frontend/appflowy_flutter/lib/plugins/database_view/widgets/card/card.dart

@@ -121,11 +121,7 @@ class _RowCardState<T> extends State<RowCard<T>> {
         },
         builder: (context, state) {
           if (PlatformExtension.isMobile) {
-            return RowCardContainer(
-              buildAccessoryWhen: () => state.isEditing == false,
-              accessories: const [],
-              openAccessory: (p0) {},
-              openCard: (context) => widget.openCard(context),
+            return GestureDetector(
               child: MobileCardContent<T>(
                 cellBuilder: widget.cellBuilder,
                 styleConfiguration: widget.styleConfiguration,
@@ -133,6 +129,7 @@ class _RowCardState<T> extends State<RowCard<T>> {
                 renderHook: widget.renderHook,
                 cardData: widget.cardData,
               ),
+              onTap: () => widget.openCard(context),
             );
           }
 

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

@@ -159,10 +159,6 @@ class MobileAppearance extends BaseAppearance {
           padding: MaterialStateProperty.all(
             const EdgeInsets.symmetric(horizontal: 8, vertical: 12),
           ),
-          // splash color
-          overlayColor: MaterialStateProperty.all(
-            Colors.grey[100],
-          ),
         ),
       ),
       textButtonTheme: TextButtonThemeData(