Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feat: Text and background color in mobile toolbar #233

Merged

Conversation

hyj1204
Copy link
Contributor

@hyj1204 hyj1204 commented Jun 21, 2023

Add textAndBackgroundColorMobileToolbarItem to the toolbar on mobile.

  • It shows a menu to let users select the text or background color.
  • The first button(ClearColorButton) is to clear the color(set to null).
  • The color options menu can be scrollable if they are more than 8 options.
text.and.background.color.mov

Note:

  • All the color options can be customized in MobileToolbar. Just set a List of ColorOption in textColorOptions or backgroundColorOptions. If it is null, the default color options locate in lib/src/editor/toolbar/mobile/mobile_toolbar.dart .
  • The customized color options are used only on mobile for now. It will be applied on the desktop in a separate PR. Currently, the Desktop version is still using the color options in lib/src/editor/toolbar/utils/color_generators.dart
    [FR] Customized color options in color picker for Desktop  #234
  • The height of the Tarbar View for the color options is a fixed height( 3 lines of buttons with spacing) for now. It may need to be improved in the future to fit better with a dynamic number of options.
    [FR] UI Improvement for color picker in mobile #235

@hyj1204 hyj1204 requested a review from LucasXu0 June 21, 2023 15:42
@hyj1204 hyj1204 self-assigned this Jun 21, 2023
@hyj1204 hyj1204 linked an issue Jun 21, 2023 that may be closed by this pull request
@codecov
Copy link

codecov bot commented Jun 21, 2023

Codecov Report

Merging #233 (0fffeb8) into main (03bc577) will decrease coverage by 0.15%.
The diff coverage is 80.98%.

@@            Coverage Diff             @@
##             main     #233      +/-   ##
==========================================
- Coverage   63.80%   63.66%   -0.15%     
==========================================
  Files         232      239       +7     
  Lines        9950    10551     +601     
==========================================
+ Hits         6349     6717     +368     
- Misses       3601     3834     +233     
Impacted Files Coverage Δ
...editor/toolbar/desktop/items/color/color_menu.dart 0.00% <0.00%> (ø)
...itor/toolbar/desktop/items/color/color_picker.dart 80.74% <ø> (+0.49%) ⬆️
...mobile/toolbar_items/link_mobile_toolbar_item.dart 1.69% <0.00%> (-0.03%) ⬇️
lib/src/editor/toolbar/utils/color_generators.dart 0.00% <0.00%> (ø)
lib/src/infra/mobile/af_mobile_icon.dart 100.00% <ø> (ø)
...efault_text_operations/format_rich_text_style.dart 0.00% <ø> (ø)
lib/src/l10n/l10n.dart 45.60% <80.00%> (+2.30%) ⬆️
lib/src/editor/toolbar/mobile/mobile_toolbar.dart 96.38% <90.47%> (+0.38%) ⬆️
...rc/editor/toolbar/mobile/mobile_toolbar_style.dart 100.00% <100.00%> (ø)
..._items/color/background_color_options_widgets.dart 100.00% <100.00%> (ø)
... and 12 more

... and 39 files with indirect coverage changes

@hyj1204 hyj1204 marked this pull request as ready for review June 22, 2023 00:31
@hyj1204 hyj1204 mentioned this pull request Jun 22, 2023
@LucasXu0 LucasXu0 merged commit 09fd4c8 into AppFlowy-IO:main Jun 25, 2023
zoli added a commit to zoli/appflowy-editor that referenced this pull request Jun 25, 2023
* main:
  fix: error occurs when applying divider on Mobile (AppFlowy-IO#252)
  feat: text and background color in mobile toolbar (AppFlowy-IO#233)
  fix: extend attribute keys shouldn't be sliced (AppFlowy-IO#248)
  feat: support customizing text attribute key and rendering (AppFlowy-IO#244)
@hyj1204 hyj1204 deleted the feat/text_color_and_highlight_in_mobile branch June 29, 2023 02:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[FR] Mobile toolbar features
2 participants