Skip to content

Conversation

@akasunil
Copy link
Member

What?

Add border block support to the File block.

Part of #43247

Why?

File block is missing border support.

How?

Adds the border block support in block.json

Testing Instructions

  • Go to Global Styles setting ( under appearance > editor > styles > edit styles > blocks )
  • Make sure that File block's border is configurable via Global Styles
  • Verify that Global Styles are applied correctly in the editor and frontend
  • Edit template/page, Add File block and Apply the border styles
  • Verify that block styles take precedence over global styles
  • Verify that block borders display correctly in both the editor and frontend

Watch attached video for more information.

Screenshots or screencast

file-block-border-support.webm

@akasunil akasunil added [Type] Enhancement A suggestion for improvement. [Block] File Affects the File Block labels Aug 14, 2024
@akasunil akasunil requested a review from ajitbohra as a code owner August 14, 2024 14:43
@github-actions
Copy link

github-actions bot commented Aug 14, 2024

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: akasunil <[email protected]>
Co-authored-by: aaronrobertshaw <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@akasunil akasunil self-assigned this Aug 15, 2024
Copy link
Contributor

@aaronrobertshaw aaronrobertshaw left a comment

Choose a reason for hiding this comment

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

Thanks for the continued efforts on border support adoption @akasunil 👍

✅ Global styles apply correctly
✅ Block instance styles override global styles
✅ Styles apply consistently between editor and frontend
✅ Box sizing allows parent to enforce width
✅ Default display of border controls matches spacing controls

LGTM 🚢

Screen.Recording.2024-08-19.at.4.20.30.PM.mp4

@akasunil akasunil merged commit 1db6ca0 into trunk Aug 19, 2024
@akasunil akasunil deleted the add/file-border-support branch August 19, 2024 13:42
@github-actions github-actions bot added this to the Gutenberg 19.1 milestone Aug 19, 2024
@artemiomorales artemiomorales added the [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi label Aug 23, 2024
bph pushed a commit to bph/gutenberg that referenced this pull request Aug 31, 2024
Co-authored-by: akasunil <[email protected]>
Co-authored-by: aaronrobertshaw <[email protected]>
@fabiankaegy fabiankaegy mentioned this pull request Oct 1, 2024
97 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Block] File Affects the File Block [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi [Type] Enhancement A suggestion for improvement.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants