Mirrored_Repos/AppFlowy
1
0
Fork 0
mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2024-08-30 18:12:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: use dependency injection to adapt the theme on mobile. (#3957)

Browse Source
This commit is contained in:
Lucas.Xu
2023-11-20 10:35:13 +08:00
committed by GitHub
parent 8179419f8b
commit 6f83f41c2d
14 changed files with 599 additions and 551 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_configuration.dart
View File

@ -9,6 +9,22 @@ import 'package:flowy_infra/theme_extension.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
List<MobileToolbarItem> getMobileToolbarItems() {
return [
customTextDecorationMobileToolbarItem,
buildTextAndBackgroundColorMobileToolbarItem(),
mobileAddBlockToolbarItem,
mobileConvertBlockToolbarItem,
linkMobileToolbarItem,
imageMobileToolbarItem,
mobileAlignToolbarItem,
mobileIndentToolbarItem,
mobileOutdentToolbarItem,
undoMobileToolbarItem,
redoMobileToolbarItem,
];
}
Map<String, BlockComponentBuilder> getEditorBuilderMap({
required BuildContext context,
required EditorState editorState,

20
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart
View File

@ -266,22 +266,16 @@ class _AppFlowyEditorPageState extends State<AppFlowyEditorPage> {
_setInitialSelection(editorScrollController);
if (PlatformExtension.isMobile) {
final theme = Theme.of(context);
return MobileToolbarV2(
toolbarHeight: 48.0,
backgroundColor: theme.colorScheme.background,
foregroundColor: theme.colorScheme.onSurface,
iconColor: theme.iconTheme.color ?? theme.colorScheme.onSurface,
tabBarSelectedBackgroundColor: theme.colorScheme.background,
tabBarSelectedForegroundColor: theme.colorScheme.onSurface,
editorState: editorState,
toolbarItems: [
customTextDecorationMobileToolbarItem,
buildTextAndBackgroundColorMobileToolbarItem(),
mobileAddBlockToolbarItem,
mobileConvertBlockToolbarItem,
linkMobileToolbarItem,
imageMobileToolbarItem,
mobileAlignToolbarItem,
mobileIndentToolbarItem,
mobileOutdentToolbarItem,
undoMobileToolbarItem,
redoMobileToolbarItem,
],
toolbarItems: getMobileToolbarItems(),
child: Column(
children: [
Expanded(

10
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/header/document_header_node_widget.dart
View File

@ -581,14 +581,20 @@ class DeleteCoverButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
final fillColor = PlatformExtension.isDesktopOrWeb
? Theme.of(context).colorScheme.surface.withOpacity(0.5)
: Theme.of(context).colorScheme.onSurfaceVariant;
final svgColor = PlatformExtension.isDesktopOrWeb
? Theme.of(context).colorScheme.tertiary
: Theme.of(context).colorScheme.onPrimary;
return FlowyIconButton(
hoverColor: Theme.of(context).colorScheme.surface,
fillColor: Theme.of(context).colorScheme.surface.withOpacity(0.5),
fillColor: fillColor,
iconPadding: const EdgeInsets.all(5),
width: 28,
icon: FlowySvg(
FlowySvgs.delete_s,
color: Theme.of(context).colorScheme.tertiary,
color: svgColor,
),
onPressed: onTap,
);

7
frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/mobile_toolbar_item/mobile_text_decoration_item.dart
View File

@ -1,10 +1,12 @@
import 'package:appflowy/generated/flowy_svgs.g.dart';
import 'package:appflowy_editor/appflowy_editor.dart';
import 'package:flowy_infra_ui/flowy_infra_ui.dart';
import 'package:flutter/material.dart';
final customTextDecorationMobileToolbarItem = MobileToolbarItem.withMenu(
itemIconBuilder: (_, __, ___) => const AFMobileIcon(
afMobileIcons: AFMobileIcons.textDecoration,
itemIconBuilder: (_, __, ___) => const FlowySvg(
FlowySvgs.text_s,
size: Size.square(24),
),
itemMenuBuilder: (_, editorState, __) {
final selection = editorState.selection;
@ -82,6 +84,7 @@ class _TextDecorationMenuState extends State<_TextDecorationMenu> {
return MobileToolbarItemMenuBtn(
icon: AFMobileIcon(
afMobileIcons: currentDecoration.icon,
color: MobileToolbarTheme.of(context).iconColor,
),
label: FlowyText(currentDecoration.label),
isSelected: isSelected,