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.

Sign up for GitHub

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

Jump to bottom

VideoPress Block: New Icon for Edit Button #20916

Merged
merged 3 commits into from
Sep 2, 2021
Merged

VideoPress Block: New Icon for Edit Button #20916

merged 3 commits into from
Sep 2, 2021

Conversation

roundhill
Copy link
Contributor

This PR updates the icon for the edit button in the toolbar for the VideoPress block.

Before
Screen Shot 2021-09-01 at 9 30 29 AM

After
Screen Shot 2021-09-01 at 9 34 34 AM

I made the icon a bit smaller so that it fits in with the other icons on the toolbar that are still "dashicons".

Changes proposed in this Pull Request:

Jetpack product discussion

pxWta-Zz-p2

Does this pull request change what data or activity we track or use?

No

Testing instructions:

  • Add or edit a VideoPress block, you should see the new icon and clicking it should take the block back to the upload/select video view.
  • Hopefully the icon looks nice 😉

@matticbot
Copy link
Contributor

Caution: This PR has changes that must be merged to WordPress.com
Hello roundhill! These changes need to be synced to WordPress.com - If you 're an a11n, please commandeer and confirm D66196-code works as expected before merging this PR. Once this PR is merged, please commit the changes to WP.com. Thank you!
This revision will be updated with each commit to this PR

@github-actions github-actions bot added the [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ label Sep 1, 2021
@github-actions
Copy link
Contributor

github-actions bot commented Sep 1, 2021 •
edited
Loading

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

  • ✅ Include a description of your PR changes.
  • ✅ All commits were linted before commit.
  • ✅ Add a "[Status]" label (In Progress, Needs Team Review, ...).
  • ✅ Add testing instructions.
  • ✅ Specify whether this PR includes any changes to data or privacy.
  • ✅ Add changelog entries to affected projects

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

The e2e test report can be found here. Please note that it can take a few minutes after the e2e tests checks are complete for the report to be available.

Once your PR is ready for review, check one last time that all required checks (other than "Required review") appearing at the bottom of this PR are passing or skipped.
Then, add the "[Status] Needs Team review" label and ask someone from your team review the code.
Once you’ve done so, switch to the "[Status] Needs Review" label; someone from Jetpack Crew will then review this PR and merge it to be included in the next Jetpack release.

Jetpack plugin:

  • Next scheduled release: September 7, 2021.
  • Scheduled code freeze: August 30, 2021.

jgcaruso
jgcaruso previously approved these changes Sep 1, 2021
View reviewed changes
Copy link
Contributor

@jgcaruso jgcaruso left a comment

Choose a reason for hiding this comment

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

Icon is updated to the new design, and button still works as expected.

@pablohoneyhoney
Copy link

I made the icon a bit smaller so that it fits in with the other icons on the toolbar that are still "dashicons".

This is definitely not best. We designed this new edit icon to work accordingly with the other icons of the toolbar which aren't or shouldn't be Dashicons (which are and will be deprecated). All of these icons are new and should be leveraged as available in the icon library, they all have a 24px footprint and work as intended in this design library.

Screen Shot 2021-09-01 at 2 38 34 PM

Pinging @jasmussen in case I'm missing something.

@jasmussen
Copy link
Member

Yep, definitely keep the 24x24 as they were intended to be displayed, especially since Dashicons has long since been retired. I do appreciate the effort to replace the remaining instances of Dashicon usage!

@mtias
Copy link
Member

mtias commented Sep 1, 2021

Yes, there are no dashicons in that toolbar. You can reference wordpress/icons directly for the pencil.

@roundhill
Copy link
Contributor Author

roundhill commented Sep 1, 2021 •
edited
Loading

Thanks all, updated! I just thought it looked a little large compared to the other icons, but #notadesigner. Looks like this now:

Screen Shot 2021-09-01 at 1 06 48 PM

jgcaruso
jgcaruso approved these changes Sep 1, 2021
View reviewed changes
Copy link
Contributor

@jgcaruso jgcaruso left a comment

Choose a reason for hiding this comment

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

Diff is much cleaner and icon size matches that of other blocks now.

@jasmussen
Copy link
Member

In responding to the ping above by Pablo last night, I should've perhaps shared some wider context for the new iconography. Dashicons were put into maintenance mode with WordPress 5.5. In its place is a new icon set that has been designed to be lighter with thinner strokes, bigger to be more legible, and to match the design language that's evolving from the block editor and outwards. The set already includes a great deal of icons, but if there's any icon you need currently missing from the set, I'd be super happy to help make it happen.

@jeherve jeherve added [Status] Ready to Merge Go ahead, you can push that green button! and removed [Status] Needs Team Review labels Sep 2, 2021
@jeherve jeherve added this to the jetpack/10.2 milestone Sep 2, 2021
@roundhill roundhill merged commit 0336294 into master Sep 2, 2021
@roundhill roundhill deleted the update/videopress-block-edit-icon branch September 2, 2021 14:53
@github-actions
Copy link
Contributor

github-actions bot commented Sep 2, 2021

Great news! One last step: head over to your WordPress.com diff, D66196-code, and commit it.
Once you've done so, come back to this PR and add a comment with your changeset ID.

Thank you!

@github-actions github-actions bot removed the [Status] Ready to Merge Go ahead, you can push that green button! label Sep 2, 2021
@roundhill
Copy link
Contributor Author

Deployed to wp.com via r231166-wpcom

davidlonjon added a commit that referenced this pull request Sep 3, 2021
@davidlonjon
Merge branch 'master' into try/boost-javascript-tests-workflow
9f575aa 
* master:
  Backport Connection Package Changelog from Release (#20942)
  Tiled gallery: fix transform again (#20928)
  Jetpack Sync: Checksums: Better handling of WooCommerce tables (#20937)
  VideoPress Block: New Icon for Edit Button (#20916)
  Backup: fix dashboard styling (#20900)
  Connection: remove invalid user token before reconnect (#20919)
  Widget Visibility build tools: adjust command in readme (#20935)
  storybook: Use webpack 5 everywhere (#20891)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@jgcaruso jgcaruso jgcaruso approved these changes

@jeherve jeherve jeherve approved these changes

@pablohoneyhoney pablohoneyhoney Awaiting requested review from pablohoneyhoney

Assignees

@roundhill roundhill

Labels
[Block] VideoPress [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ Touches WP.com Files
Projects
None yet
Milestone
jetpack/10.2
Development

Successfully merging this pull request may close these issues.
7 participants
@roundhill @matticbot @pablohoneyhoney @jasmussen @mtias @jeherve @jgcaruso