Skip to content

PostCommentsForm: Fix submit button width regression #69651

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
Merged
merged 4 commits into from
Mar 24, 2025
Merged

PostCommentsForm: Fix submit button width regression #69651

merged 4 commits into from
Mar 24, 2025

Conversation

im3dabasia
Copy link
Contributor

@im3dabasia im3dabasia commented Mar 21, 2025 •
edited
Loading

What?

Closes #69637

Fixes the regression where post comment submit button stretch to full width.

Why?

In WordPress 6.8, a change to button styling (width: 100%) caused an unintended side effect on post-comments-formsubmit button, making them stretch to full width.

How?

Adds a targeted CSS rule to specifically override the width for submit button in post-comments-form

Testing Instructions

  1. Add a new post
  2. Add comments form block
  3. Observe the button to submit the comment (it will be full width)
  4. Apply this patch
  5. Verify the submit button now (does not have full width) the regression has been handled.

Screenshots or screencast

Before

image

WordPress 6.7.2

image

Current PR

image

After this change, we would have the button's width like how it was in WordPress 6.7.2 as shown in the above 2 screenshots. I tested this at 1440px width in Chrome developer tools.

@im3dabasia im3dabasia force-pushed the fix/post-comment-form-button-regression branch from 273bc2d to 74dc284 Compare March 21, 2025 11:47
@im3dabasia im3dabasia marked this pull request as ready for review March 21, 2025 11:51
@github-actions GitHub Actions
Copy link

github-actions bot commented Mar 21, 2025 •
edited
Loading

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: im3dabasia <im3dabasia1@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: Rishit30G <rishit30g@git.wordpress.org>
Co-authored-by: jessedyck <jessedyck@git.wordpress.org>

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

@t-hamano t-hamano added [Type] Regression Related to a regression in the latest release Backport to WP 6.8 Beta/RC Pull request that needs to be backported to the WordPress major release that's currently in beta [Block] Comments Form Affects the Comments Form Block labels Mar 21, 2025
@github-project-automation github-project-automation bot moved this to 🔎 Needs Review in WordPress 6.8 Editor Tasks Mar 21, 2025
@t-hamano t-hamano moved this from 🔎 Needs Review to 🏗️ In Progress in WordPress 6.8 Editor Tasks Mar 21, 2025
t-hamano
t-hamano reviewed Mar 21, 2025
View reviewed changes
Copy link
Contributor

@t-hamano t-hamano 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 PR! I think this style is needed for both the editor and the frontend.

@t-hamano t-hamano moved this from 🏗️ In Progress to 🔎 Needs Review in WordPress 6.8 Editor Tasks Mar 21, 2025
@im3dabasia
Copy link
Contributor Author

@t-hamano Thank you for the feedback. I have updated the SCSS for both the frontend and editor.

When you have a moment, Please check.

t-hamano
t-hamano reviewed Mar 23, 2025
View reviewed changes
Copy link
Contributor

@t-hamano t-hamano 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 update!

We don't need to update editor.scss because style.scss is applied to both the editor and the frontend.

Additionally, it may be a good idea to add a comment that this style is meant to override the 100% width derived from the Button block.

@im3dabasia im3dabasia requested a review from t-hamano March 23, 2025 14:06
@im3dabasia
Copy link
Contributor Author

Hi @t-hamano ,

I updated the PR with the feedbacks you gave.
When you get a chance please have a look at it once again.

t-hamano
t-hamano approved these changes Mar 24, 2025
View reviewed changes
Copy link
Contributor

@t-hamano t-hamano left a comment

Choose a reason for hiding this comment

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

LGTM 👍

@Mamaduka Mamaduka merged commit 221c956 into WordPress:trunk Mar 24, 2025
61 checks passed
@github-project-automation github-project-automation bot moved this from 🔎 Needs Review to ✅ Done in WordPress 6.8 Editor Tasks Mar 24, 2025
@github-actions github-actions bot added this to the Gutenberg 20.6 milestone Mar 24, 2025
@github-actions github-actions bot removed the Backport to WP 6.8 Beta/RC Pull request that needs to be backported to the WordPress major release that's currently in beta label Mar 24, 2025
gutenbergplugin pushed a commit that referenced this pull request Mar 24, 2025
@im3dabasia @t-hamano
@jessedyck @gutenbergplugin
PostCommentsForm: Fix submit button width regression (#69651)
1704d68 
Co-authored-by: im3dabasia <im3dabasia1@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: Rishit30G <rishit30g@git.wordpress.org>
Co-authored-by: jessedyck <jessedyck@git.wordpress.org>
@github-actions github-actions bot added the Backported to WP Core Pull request that has been successfully merged into WP Core label Mar 24, 2025
@github-actions GitHub Actions
Copy link

I just cherry-picked this PR to the wp/6.8 branch to get it included in the next release: 1704d68

Sourav61 pushed a commit to Sourav61/gutenberg that referenced this pull request Mar 24, 2025
@im3dabasia @t-hamano
@jessedyck @Sourav61
PostCommentsForm: Fix submit button width regression (WordPress#69651)
6a841b0 
Co-authored-by: im3dabasia <im3dabasia1@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: Rishit30G <rishit30g@git.wordpress.org>
Co-authored-by: jessedyck <jessedyck@git.wordpress.org>
@Mamaduka Mamaduka mentioned this pull request Mar 25, 2025
Closed
@t-hamano t-hamano mentioned this pull request May 5, 2025
Merged
chriszarate pushed a commit to chriszarate/gutenberg that referenced this pull request Jul 1, 2025
@im3dabasia @t-hamano
@jessedyck @chriszarate
PostCommentsForm: Fix submit button width regression (WordPress#69651)
0eef1c0 
Co-authored-by: im3dabasia <im3dabasia1@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: Rishit30G <rishit30g@git.wordpress.org>
Co-authored-by: jessedyck <jessedyck@git.wordpress.org>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@t-hamano t-hamano t-hamano approved these changes

@ajitbohra ajitbohra Awaiting requested review from ajitbohra ajitbohra is a code owner

@fabiankaegy fabiankaegy Awaiting requested review from fabiankaegy fabiankaegy is a code owner

Assignees
No one assigned
Labels
Backported to WP Core Pull request that has been successfully merged into WP Core [Block] Comments Form Affects the Comments Form Block [Type] Regression Related to a regression in the latest release
Projects
WordPress 6.8 Editor Tasks
Status: ✅ Done
Milestone
Gutenberg 20.6
Development

Successfully merging this pull request may close these issues.

Comment form button expands to full width
3 participants
@im3dabasia @t-hamano @Mamaduka