Description
At the moment, there are multiple instances where buttons of varying sizes are used across the UI. For example, in the screenshot below, the buttons appear with inconsistent heights: some render at 40px, while others render at 36px. There are also cases where buttons such as “Generate Meta Description” do not occupy the full available width, unlike other similar buttons.
Proposal:
Button sizes have already been standardized upstream in the component implementation, with 40px intended as the default size and 32px reserved for smaller exceptions such as toolbar buttons. The 36px size has effectively been retired as part of this direction. (Ref: WordPress/gutenberg#46734)
This behavior is currently enabled through the __next40pxDefaultSize prop (Ref: WordPress/gutenberg#46741), which is expected to become the default in the future. While many areas of the codebase already opt into this prop, several usages are still missing it, resulting in minor but noticeable visual inconsistencies.
To better align existing usages with the upstream component standard and maintain UI consistency, this could be enforced through an ESLint rule (Ref). Ensuring that default button implementations consistently opt in to __next40pxDefaultSize would make button sizing more predictable and keep the UI visually consistent.
Step-by-step reproduction instructions
- Create a new post and open it in the editor.
- In the editor sidebar, compare the button sizes used in different sections.
- Verify that buttons such as “Generate meta description” and “Apply Editorial Updates” render with inconsistent heights.
Screenshots, screen recording, code snippet
No response
Environment info
No response
Please confirm that you have searched existing issues in the repo.
Please confirm that you have tested with all plugins deactivated except the AI plugin.
Please confirm which theme type you used for testing.
Description
At the moment, there are multiple instances where buttons of varying sizes are used across the UI. For example, in the screenshot below, the buttons appear with inconsistent heights: some render at 40px, while others render at 36px. There are also cases where buttons such as “Generate Meta Description” do not occupy the full available width, unlike other similar buttons.
Proposal:
Button sizes have already been standardized upstream in the component implementation, with 40px intended as the default size and 32px reserved for smaller exceptions such as toolbar buttons. The 36px size has effectively been retired as part of this direction. (Ref: WordPress/gutenberg#46734)
This behavior is currently enabled through the
__next40pxDefaultSizeprop (Ref: WordPress/gutenberg#46741), which is expected to become the default in the future. While many areas of the codebase already opt into this prop, several usages are still missing it, resulting in minor but noticeable visual inconsistencies.To better align existing usages with the upstream component standard and maintain UI consistency, this could be enforced through an ESLint rule (Ref). Ensuring that default button implementations consistently opt in to
__next40pxDefaultSizewould make button sizing more predictable and keep the UI visually consistent.Step-by-step reproduction instructions
Screenshots, screen recording, code snippet
No response
Environment info
No response
Please confirm that you have searched existing issues in the repo.
Please confirm that you have tested with all plugins deactivated except the AI plugin.
Please confirm which theme type you used for testing.