chore: misc mobile UI improvements (#4072)

* chore: adjust colors

* chore: adjust card detail padding and text weight

* fix: recent view horizontal padding

* chore: entire row opens row detail page

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

@@ -354,10 +354,11 @@ class MobileRowDetailPageContentState
                     if (state.primaryField != null) {
                       final cellStyle = GridTextCellStyle(
                         placeholder: LocaleKeys.grid_row_titlePlaceholder.tr(),
-                        textStyle: Theme.of(context)
+                        textStyle:
-                            .textTheme
+                            Theme.of(context).textTheme.bodyMedium?.copyWith(
-                            .bodyMedium
+                                  fontSize: 22,
-                            ?.copyWith(fontSize: 22),
+                                  fontWeight: FontWeight.w500,
+                                ),
                         cellPadding: const EdgeInsets.symmetric(vertical: 8),
                         useRoundedBorder: false,
                       );
@@ -382,7 +383,7 @@ class MobileRowDetailPageContentState
               ),
               Expanded(
                 child: ListView(
-                  padding: const EdgeInsets.symmetric(vertical: 8),
+                  padding: const EdgeInsets.only(top: 8, bottom: 100),
                   children: [
                     Padding(
                       padding: const EdgeInsets.symmetric(horizontal: 18),
@@ -397,9 +398,10 @@ class MobileRowDetailPageContentState
                       child: Column(
                         crossAxisAlignment: CrossAxisAlignment.start,
                         children: [
-                          if (rowDetailState.numHiddenFields != 0)
+                          if (rowDetailState.numHiddenFields != 0) ...[
                             const ToggleHiddenFieldsVisibilityButton(),
                             const VSpace(12),
+                          ],
                           MobileRowDetailCreateFieldButton(
                             viewId: viewId,
                             fieldController: fieldController,

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

@@ -36,6 +36,7 @@ class MobileRowPropertyList extends StatelessWidget {
           shrinkWrap: true,
           physics: const NeverScrollableScrollPhysics(),
           itemCount: visibleCells.length,
+          padding: EdgeInsets.zero,
           itemBuilder: (context, index) => _PropertyCell(
             key: ValueKey('row_detail_${visibleCells[index].fieldId}'),
             cellContext: visibleCells[index],

frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page.dart

@@ -91,7 +91,7 @@ class MobileHomePage extends StatelessWidget {
           child: Scrollbar(
             child: SingleChildScrollView(
               child: Padding(
-                padding: const EdgeInsets.all(8.0),
+                padding: const EdgeInsets.symmetric(vertical: 8.0),
                 child: Column(
                   crossAxisAlignment: CrossAxisAlignment.start,
                   mainAxisSize: MainAxisSize.min,
@@ -101,7 +101,7 @@ class MobileHomePage extends StatelessWidget {
 
                     // Folders
                     Padding(
-                      padding: const EdgeInsets.symmetric(horizontal: 16),
+                      padding: const EdgeInsets.symmetric(horizontal: 24),
                       child: MobileFolders(
                         user: userProfile,
                         workspaceSetting: workspaceSetting,
@@ -110,7 +110,7 @@ class MobileHomePage extends StatelessWidget {
                     ),
                     const SizedBox(height: 8),
                     const Padding(
-                      padding: EdgeInsets.symmetric(horizontal: 16),
+                      padding: EdgeInsets.symmetric(horizontal: 24),
                       child: _TrashButton(),
                     ),
                   ],

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

@@ -66,7 +66,7 @@ class _RecentViews extends StatelessWidget {
       mainAxisSize: MainAxisSize.min,
       children: [
         Padding(
-          padding: const EdgeInsets.symmetric(horizontal: 16),
+          padding: const EdgeInsets.symmetric(horizontal: 24),
           child: FlowyText.semibold(
             LocaleKeys.sideBar_recent.tr(),
             fontSize: 20.0,
@@ -74,7 +74,7 @@ class _RecentViews extends StatelessWidget {
         ),
         SingleChildScrollView(
           scrollDirection: Axis.horizontal,
-          padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+          padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 8),
           child: IntrinsicHeight(
             child: SeparatedRow(
               separatorBuilder: () => const HSpace(8),

frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/widgets/row/mobile_row.dart

@@ -5,7 +5,6 @@ import 'package:appflowy/plugins/database_view/application/row/row_cache.dart';
 import 'package:appflowy/plugins/database_view/application/row/row_controller.dart';
 import 'package:appflowy/plugins/database_view/application/row/row_service.dart';
 import 'package:appflowy/plugins/database_view/grid/application/row/row_bloc.dart';
-import 'package:appflowy/plugins/database_view/widgets/row/accessory/cell_accessory.dart';
 import 'package:appflowy/plugins/database_view/widgets/row/cell_builder.dart';
 import 'package:appflowy/plugins/database_view/widgets/row/cells/mobile_cell_container.dart';
 import 'package:flowy_infra/theme_extension.dart';
@@ -72,11 +71,16 @@ class _MobileGridRowState extends State<MobileGridRow> {
             children: [
               SizedBox(width: GridSize.leadingHeaderPadding),
               Expanded(
+                child: InkWell(
+                  onTap: () => widget.openDetailPage(context),
+                  child: IgnorePointer(
                     child: RowContent(
                       builder: _cellBuilder,
                       onExpand: () => widget.openDetailPage(context),
                     ),
                   ),
+                ),
+              ),
             ],
           );
         },
@@ -152,25 +156,7 @@ class RowContent extends StatelessWidget {
           width: cellId.fieldInfo.fieldSettings?.width.toDouble() ?? 140,
           isPrimary: cellId.fieldInfo.field.isPrimary,
           accessoryBuilder: (buildContext) {
-            final builder = child.accessoryBuilder;
+            return [];
-            final List<GridCellAccessoryBuilder> accessories = [];
-            if (cellId.fieldInfo.field.isPrimary) {
-              accessories.add(
-                GridCellAccessoryBuilder(
-                  builder: (key) => PrimaryCellAccessory(
-                    key: key,
-                    onTapCallback: onExpand,
-                    isCellEditing: buildContext.isCellEditing,
-                  ),
-                ),
-              );
-            }
-
-            if (builder != null) {
-              accessories.addAll(builder(buildContext));
-            }
-
-            return accessories;
           },
           child: child,
         );

frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/date_cell/date_cell.dart

@@ -136,9 +136,12 @@ class _DateCellState extends GridCellState<GridDateCell> {
                       ),
                     ),
                     const HSpace(6),
-                    const RotatedBox(
+                    RotatedBox(
                       quarterTurns: 3,
-                      child: Icon(Icons.chevron_left),
+                      child: Icon(
+                        Icons.chevron_left,
+                        color: Theme.of(context).hintColor,
+                      ),
                     ),
                     const HSpace(2),
                   ],

frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/select_option_cell/select_option_cell.dart

@@ -232,9 +232,12 @@ class _SelectOptionWrapState extends State<SelectOptionWrap> {
             children: [
               Expanded(child: _buildMobileOptions(isInRowDetail: true)),
               const HSpace(6),
-              const RotatedBox(
+              RotatedBox(
                 quarterTurns: 3,
-                child: Icon(Icons.chevron_left),
+                child: Icon(
+                  Icons.chevron_left,
+                  color: Theme.of(context).hintColor,
+                ),
               ),
               const HSpace(2),
             ],
@@ -298,7 +301,7 @@ class _SelectOptionWrapState extends State<SelectOptionWrap> {
       return Container(
         alignment: Alignment.centerLeft,
         padding: const EdgeInsets.symmetric(vertical: 1),
-        child: FlowyText.medium(
+        child: FlowyText(
           widget.cellStyle.placeholder,
           color: Theme.of(context).hintColor,
         ),

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

@@ -6,7 +6,7 @@ import 'package:flowy_infra/theme_extension.dart';
 import 'package:flutter/material.dart';
 
 class MobileAppearance extends BaseAppearance {
-  static const _primaryColor = Color(0xFF2DA2F6); //primary 100
+  static const _primaryColor = Color(0xFF00BCF0); //primary 100
   static const _onBackgroundColor = Color(0xff2F3030); // text/title color
   static const _onSurfaceColor = Color(0xff676666); // text/body color
   static const _onSecondaryColor = Color(0xFFC5C7CB); // text/body2 color
@@ -79,7 +79,7 @@ class MobileAppearance extends BaseAppearance {
           );
 
     final hintColor = brightness == Brightness.light
-        ? const Color(0xff89909B)
+        ? const Color(0x991F2329)
         : _hintColorInDarkMode;
 
     return ThemeData(