Skip to content

Conversation

karthick-murugan
Copy link
Contributor

@karthick-murugan karthick-murugan commented Oct 25, 2024

What?

Add border block support to the Spacer block.

Part of #43247

Why?

Spacer 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 Spacer block's border is configurable via Global Styles
  • Verify that Global Styles are applied correctly in the editor and frontend
  • Edit template/page, Add Spacer 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

Testing Instructions for Keyboard

None

Screenshots or screencast

In Backend:
spacer_backend

In Frontend:
spacer_frontend

Copy link

github-actions bot commented Oct 25, 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: karthick-murugan <karthickmurugan@git.wordpress.org>
Co-authored-by: aaronrobertshaw <aaronrobertshaw@git.wordpress.org>
Co-authored-by: hanneslsm <hanneslsm@git.wordpress.org>
Co-authored-by: benniledl <benniledl@git.wordpress.org>

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

@github-actions github-actions bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Oct 25, 2024
Copy link

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @karthick-murugan! In case you missed it, we'd love to have you join us in our Slack community.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

@skorasaurus skorasaurus added the [Block] Spacer Affects the Spacer Block label Oct 25, 2024
@akasunil akasunil added the [Type] Enhancement A suggestion for improvement. label Oct 29, 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 proposing this PR @karthick-murugan 👍

I'm not sure adding visual styles to the Spacer block is the direction we want to go. My understanding is this block is meant purely for layout and spacing purposes.

The same concern is raised over on the PR proposing to add color support to the Spacer block (#66433).

I've added the Needs Design Feedback label in order to get a design perspective on this.

@hanneslsm
Copy link

hanneslsm commented Feb 19, 2025

I would love to see this featured merged, as stated in #43247 (comment) already.
I just ran into the issue that I needed this feature again.

My current situation: Building a timeline / step-by-step guide with a dotted border in between the groups.
I can do it by creating a grid or column block and adding a spacer (the spacer is needed otherwise the blocks won't render on the front). However, I also have to wrap it into another group just to apply the border. It'd be easier to maintain when applying the border to the spacer.

CleanShot 2025-02-19 at 10 29 32@2x

@benniledl
Copy link
Contributor

This change will end up confusing more users than it helps.

Just because one person has a specific need doesn’t mean it makes sense to implement it in core. WordPress features have to be broadly useful, not just accommodate edge cases for a single user. If we added a setting for every small feature request, we’d end up with tens of thousands of options, making WordPress unusable.

If you need this behavior, the best approach is to use custom CSS. That way, you get exactly what you need without adding unnecessary complexity for everyone else.

@hanneslsm
Copy link

This change will end up confusing more users than it helps.

Why do you think so? I also added some arguments about the background for the spacer block to the other discussion but they apply also for the border. Having many groups and divs that do not represent the correct size on the front end is rather confusing and contradicts the idea of a full site WYSIWYG editor.

Just because one person has a specific need doesn’t mean it makes sense to implement it in core. WordPress features have to be broadly useful, not just accommodate edge cases for a single user.

I agree with sentiment in general and there is a lively discussion ongoing in the WordPress community, like https://kraut.press/2024/wordpress-isnt-wordpress-anymore/

If we added a setting for every small feature request, we’d end up with tens of thousands of options, making WordPress unusable.

Here I disagree with you. The block editor has currently a bad user experience because often it's missing options where users would expect them to be. Also, this would rather be a design issue that could be solved (and is for example already partly with the block locking api). If you logic too many options = unusable fully applies than we wouldn't have competitors like Webflow or software like Figma or even Photoshop.
Also, it's not like as if we're talking about many new feature requests in this issue / PR. It's about applying exiting features to an existing block. The corresponding tracking issue outlines clearly that nearly every block already has the features applied to - I don't see a reason why only here, on the spacer block, everything should behave differently. Also look at the code of this PR and you would see that there is no bloat.

If you need this behavior, the best approach is to use custom CSS. That way, you get exactly what you need without adding unnecessary complexity for everyone else.

Again, I don't see any complexity in adding existing appearance tools to the existing (and currently for the spacing block nearly empty) Inspector.
I use plenty of custom CSS for all my themes. It's not an issue for me but I have guided many clients through the editor already who would all expect every block to have the same appearance tools. I think it's ridiculous that one need to write custom CSS in order to create spacing with a border.

@karthick-murugan
Copy link
Contributor Author

@t-hamano - Can I close this PR based on the comments of this PR #66433 (comment) ?

@aaronrobertshaw
Copy link
Contributor

Can I close this PR based on the comments of this PR #66433 (comment) ?

Yeah, let's close it for now. All the same issues in #66433 apply here too.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Spacer Affects the Spacer Block First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository Needs Design Feedback Needs general design feedback. [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants