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

feat: editor theme improvement (#2307)

Browse Source 
* chore: make editor style adapt to theme data and add toolbar color

* chore: link to local path

* chore: add pop up menu style

* chore: link to editor main branch

* chore: reset editor path

* chore: upgrade appflowy_editor

---------

Co-authored-by: Lucas.Xu <lucas.xu@appflowy.io>
This commit is contained in:
Yijing Huang
2023-04-21 06:26:55 -05:00
committed by GitHub
parent 40e266f5ce
commit d804e3ed6d
10 changed files with 110 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
frontend/appflowy_flutter/lib/plugins/document/editor_styles.dart
View File

@ -1,32 +1,63 @@
import 'package:appflowy/plugins/document/presentation/more/cubit/document_appearance_cubit.dart';
import 'package:appflowy_editor/appflowy_editor.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:provider/provider.dart';
EditorStyle customEditorTheme(BuildContext context) {
final documentStyle = context.watch<DocumentAppearanceCubit>().state;
var editorStyle = Theme.of(context).brightness == Brightness.dark
? EditorStyle.dark
: EditorStyle.light;
editorStyle = editorStyle.copyWith(
padding: const EdgeInsets.symmetric(horizontal: 100, vertical: 0),
textStyle: editorStyle.textStyle?.copyWith(
final theme = Theme.of(context);
var editorStyle = EditorStyle(
// Editor styles
padding: const EdgeInsets.symmetric(horizontal: 100),
backgroundColor: theme.colorScheme.surface,
cursorColor: theme.colorScheme.primary,
// Text styles
textPadding: const EdgeInsets.symmetric(vertical: 8.0),
textStyle: TextStyle(
fontFamily: 'poppins',
fontSize: documentStyle.fontSize,
color: theme.colorScheme.onBackground,
),
placeholderTextStyle: editorStyle.placeholderTextStyle?.copyWith(
fontFamily: 'poppins',
fontSize: documentStyle.fontSize,
),
bold: editorStyle.bold?.copyWith(
fontWeight: FontWeight.w600,
selectionColor: theme.colorScheme.tertiary.withOpacity(0.2),
// Selection menu
selectionMenuBackgroundColor: theme.cardColor,
selectionMenuItemTextColor: theme.iconTheme.color,
selectionMenuItemIconColor: theme.colorScheme.onBackground,
selectionMenuItemSelectedIconColor: theme.colorScheme.onSurface,
selectionMenuItemSelectedTextColor: theme.colorScheme.onSurface,
selectionMenuItemSelectedColor: theme.hoverColor,
// Toolbar and its item's style
toolbarColor: theme.colorScheme.onTertiary,
toolbarElevation: 0,
lineHeight: 1.5,
placeholderTextStyle:
TextStyle(fontSize: documentStyle.fontSize, color: theme.hintColor),
bold: const TextStyle(
fontFamily: 'poppins-Bold',
fontWeight: FontWeight.w600,
),
backgroundColor: Theme.of(context).colorScheme.surface,
selectionMenuBackgroundColor: Theme.of(context).cardColor,
selectionMenuItemSelectedIconColor: Theme.of(context).colorScheme.onSurface,
selectionMenuItemSelectedTextColor: Theme.of(context).colorScheme.onSurface,
italic: const TextStyle(fontStyle: FontStyle.italic),
underline: const TextStyle(decoration: TextDecoration.underline),
strikethrough: const TextStyle(decoration: TextDecoration.lineThrough),
href: TextStyle(
color: theme.colorScheme.primary,
decoration: TextDecoration.underline,
),
highlightColorHex: '0x6000BCF0',
code: GoogleFonts.robotoMono(
textStyle: TextStyle(
fontSize: documentStyle.fontSize,
fontWeight: FontWeight.normal,
color: Colors.red,
backgroundColor: theme.colorScheme.inverseSurface,
),
),
popupMenuFGColor: theme.iconTheme.color,
popupMenuHoverColor: theme.colorScheme.tertiaryContainer,
);
return editorStyle;
}

2
frontend/appflowy_flutter/lib/plugins/document/presentation/plugins/cover/cover_node_widget.dart
View File

@ -5,7 +5,7 @@ import 'package:appflowy/plugins/document/presentation/plugins/cover/change_cove
import 'package:appflowy/plugins/document/presentation/plugins/cover/emoji_popover.dart';
import 'package:appflowy/plugins/document/presentation/plugins/cover/icon_widget.dart';
import 'package:appflowy/workspace/presentation/widgets/emoji_picker/emoji_picker.dart';
import 'package:appflowy_editor/appflowy_editor.dart';
import 'package:appflowy_editor/appflowy_editor.dart' hide FlowySvg;
import 'package:appflowy_popover/appflowy_popover.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flowy_infra/image.dart';

1
frontend/appflowy_flutter/lib/plugins/document/presentation/plugins/cover/emoji_popover.dart
View File

@ -4,7 +4,6 @@ import 'package:appflowy/workspace/presentation/widgets/emoji_picker/src/default
import 'package:appflowy/workspace/presentation/widgets/emoji_picker/src/emoji_view_state.dart';
import 'package:appflowy_editor/appflowy_editor.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flowy_infra/image.dart';
import 'package:flowy_infra_ui/style_widget/button.dart';
import 'package:flowy_infra_ui/style_widget/text.dart';
import 'package:flutter/material.dart';