mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2024-08-30 18:12:39 +00:00
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
This commit is contained in:
parent
ff3ff9f888
commit
4d71b42a3d
@ -354,10 +354,11 @@ class MobileRowDetailPageContentState
|
||||
if (state.primaryField != null) {
|
||||
final cellStyle = GridTextCellStyle(
|
||||
placeholder: LocaleKeys.grid_row_titlePlaceholder.tr(),
|
||||
textStyle: Theme.of(context)
|
||||
.textTheme
|
||||
.bodyMedium
|
||||
?.copyWith(fontSize: 22),
|
||||
textStyle:
|
||||
Theme.of(context).textTheme.bodyMedium?.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),
|
||||
const VSpace(12),
|
||||
],
|
||||
MobileRowDetailCreateFieldButton(
|
||||
viewId: viewId,
|
||||
fieldController: fieldController,
|
||||
|
@ -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],
|
||||
|
@ -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(),
|
||||
),
|
||||
],
|
||||
|
@ -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),
|
||||
|
@ -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,9 +71,14 @@ class _MobileGridRowState extends State<MobileGridRow> {
|
||||
children: [
|
||||
SizedBox(width: GridSize.leadingHeaderPadding),
|
||||
Expanded(
|
||||
child: RowContent(
|
||||
builder: _cellBuilder,
|
||||
onExpand: () => widget.openDetailPage(context),
|
||||
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;
|
||||
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;
|
||||
return [];
|
||||
},
|
||||
child: child,
|
||||
);
|
||||
|
@ -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),
|
||||
],
|
||||
|
@ -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,
|
||||
),
|
||||
|
@ -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(
|
||||
|
Loading…
Reference in New Issue
Block a user