Skip to content

[Mobile] Add Cover block overlay color settings#22207

Merged
mkevins merged 6 commits intomasterfrom
rnmobile/feature/cover-block-color-settings
May 13, 2020
Merged

[Mobile] Add Cover block overlay color settings#22207
mkevins merged 6 commits intomasterfrom
rnmobile/feature/cover-block-color-settings

Conversation

@mkevins
Copy link
Copy Markdown
Contributor

@mkevins mkevins commented May 8, 2020 •
edited
Loading

Related PR

gutenberg-mobile: wordpress-mobile/gutenberg-mobile#2242

Description

This PR adds overlay color and gradient settings to the mobile Cover block. This resolves wordpress-mobile/gutenberg-mobile#1735, and partially resolves wordpress-mobile/gutenberg-mobile#1737.

To test

  1. In a new post, add a Cover block
  2. Select an image from the media library
  3. Tap the up-arrow on the floating toolbar (to make sure the Cover block is selected, not the inner paragraph block)
  4. Tap the settings gear
  5. Tap "Overlay color"
  6. Change the color in the following ways:
    1. Pick a pre-selected color from the palette
    2. Choose a custom color (scroll all the way to the right)
    3. Choose a pre-selected gradient (tap the gradient option on the bottom)

Expected

Colors / gradients should update the block as they are selected.

Screencast

Types of changes

New feature (non-breaking change which adds functionality)

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • I've updated all React Native files affected by any refactorings/renamings in this PR.

@mkevins mkevins added Mobile App - i.e. Android or iOS Native mobile impl of the block editor. (Note: used in scripts, ping mobile folks to change) [Block] Cover Affects the Cover Block - used to display content laid over a background image labels May 8, 2020
@mkevins mkevins mentioned this pull request May 8, 2020
Merged
2 tasks
@mkevins mkevins requested a review from geriux May 8, 2020 07:28
@github-actions
Copy link
Copy Markdown

github-actions bot commented May 8, 2020 •
edited
Loading

Size Change: +2.51 kB (0%)

Total Size: 827 kB

Filename Size Change
build/block-directory/index.js 6.6 kB -15 B (0%)
build/block-directory/style-rtl.css 764 B +4 B (0%)
build/block-directory/style.css 764 B +3 B (0%)
build/block-editor/index.js 104 kB +1.42 kB (1%)
build/block-editor/style-rtl.css 10.6 kB +257 B (2%)
build/block-editor/style.css 10.6 kB +253 B (2%)
build/block-library/index.js 115 kB +6 B (0%)
build/blocks/index.js 48.1 kB -1 B
build/components/index.js 181 kB +591 B (0%)
build/compose/index.js 6.66 kB -1 B
build/data/index.js 8.43 kB -13 B (0%)
build/edit-navigation/index.js 4.42 kB +9 B (0%)
build/edit-post/index.js 28 kB +2 B (0%)
build/edit-site/index.js 12.1 kB -1 B
build/edit-widgets/index.js 8.37 kB +3 B (0%)
build/element/index.js 4.65 kB -2 B (0%)
build/format-library/index.js 7.63 kB -1 B
build/plugins/index.js 2.56 kB -1 B
build/rich-text/index.js 14.8 kB -1 B
build/viewport/index.js 1.84 kB +1 B
ℹ️ View Unchanged
Filename Size Change
build/a11y/index.js 1.02 kB 0 B
build/annotations/index.js 3.62 kB 0 B
build/api-fetch/index.js 4.08 kB 0 B
build/autop/index.js 2.82 kB 0 B
build/blob/index.js 620 B 0 B
build/block-library/editor-rtl.css 7.12 kB 0 B
build/block-library/editor.css 7.12 kB 0 B
build/block-library/style-rtl.css 7.38 kB 0 B
build/block-library/style.css 7.38 kB 0 B
build/block-library/theme-rtl.css 683 B 0 B
build/block-library/theme.css 685 B 0 B
build/block-serialization-default-parser/index.js 1.88 kB 0 B
build/block-serialization-spec-parser/index.js 3.1 kB 0 B
build/components/style-rtl.css 17 kB 0 B
build/components/style.css 16.9 kB 0 B
build/core-data/index.js 11.4 kB 0 B
build/data-controls/index.js 1.29 kB 0 B
build/date/index.js 5.47 kB 0 B
build/deprecated/index.js 772 B 0 B
build/dom-ready/index.js 568 B 0 B
build/dom/index.js 3.1 kB 0 B
build/edit-navigation/style-rtl.css 618 B 0 B
build/edit-navigation/style.css 617 B 0 B
build/edit-post/style-rtl.css 12.2 kB 0 B
build/edit-post/style.css 12.2 kB 0 B
build/edit-site/style-rtl.css 5.22 kB 0 B
build/edit-site/style.css 5.22 kB 0 B
build/edit-widgets/style-rtl.css 4.69 kB 0 B
build/edit-widgets/style.css 4.69 kB 0 B
build/editor/editor-styles-rtl.css 425 B 0 B
build/editor/editor-styles.css 428 B 0 B
build/editor/index.js 44.3 kB 0 B
build/editor/style-rtl.css 5.07 kB 0 B
build/editor/style.css 5.08 kB 0 B
build/escape-html/index.js 734 B 0 B
build/format-library/style-rtl.css 502 B 0 B
build/format-library/style.css 502 B 0 B
build/hooks/index.js 2.14 kB 0 B
build/html-entities/index.js 622 B 0 B
build/i18n/index.js 3.56 kB 0 B
build/is-shallow-equal/index.js 710 B 0 B
build/keyboard-shortcuts/index.js 2.51 kB 0 B
build/keycodes/index.js 1.94 kB 0 B
build/list-reusable-blocks/index.js 3.12 kB 0 B
build/list-reusable-blocks/style-rtl.css 226 B 0 B
build/list-reusable-blocks/style.css 226 B 0 B
build/media-utils/index.js 5.29 kB 0 B
build/notices/index.js 1.79 kB 0 B
build/nux/index.js 3.4 kB 0 B
build/nux/style-rtl.css 616 B 0 B
build/nux/style.css 613 B 0 B
build/primitives/index.js 1.5 kB 0 B
build/priority-queue/index.js 789 B 0 B
build/redux-routine/index.js 2.85 kB 0 B
build/server-side-render/index.js 2.68 kB 0 B
build/shortcode/index.js 1.7 kB 0 B
build/token-list/index.js 1.28 kB 0 B
build/url/index.js 4.02 kB 0 B
build/warning/index.js 1.14 kB 0 B
build/wordcount/index.js 1.18 kB 0 B

compressed-size-action

geriux
geriux reviewed May 11, 2020
View reviewed changes
@geriux
Copy link
Copy Markdown
Member

geriux commented May 11, 2020

Tested it and its looking great! 🤩 just left one comment #22207 (comment)

geriux
geriux approved these changes May 12, 2020
View reviewed changes
Copy link
Copy Markdown
Member

@geriux geriux left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Nice work! 🎨

@mkevins mkevins merged commit 3e62dba into master May 13, 2020
@mkevins mkevins deleted the rnmobile/feature/cover-block-color-settings branch May 13, 2020 00:51
@mkevins
Copy link
Copy Markdown
Contributor Author

mkevins commented May 13, 2020

Thanks for testing Gerardo!

@github-actions github-actions bot added this to the Gutenberg 8.2 milestone May 13, 2020
@mchowning mchowning mentioned this pull request May 26, 2020
Merged
5 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

1 more reviewer

@geriux geriux geriux approved these changes

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

[Block] Cover Affects the Cover Block - used to display content laid over a background image Mobile App - i.e. Android or iOS Native mobile impl of the block editor. (Note: used in scripts, ping mobile folks to change)

Projects

None yet

Milestone

Gutenberg 8.2

Development

Successfully merging this pull request may close these issues.

Cover block: Overlay gradient settings Cover block: Overlay color settings

2 participants

@mkevins @geriux