Lower the specificity of border & padding styles for the outline block style in the button block #35968
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
so it can be overriden by the theme via theme.json, that uses a single class selector.
|
Size Change: +45 B (0%) Total Size: 1.07 MB
ℹ️ View Unchanged
|
oandregal
added
[Block] Buttons
|
I didn't have time today to test this deeply, but at a glance the code seems like it would do the trick? High level, it seems appropriate to lower the styles output by the button by default, so that they are easy to override. We can consider them soft defaults. |
oandregal
changed the title
|
using emptytheme this is what I see with the theme.json settings you suggest:
From what I see, the border rules are being applied to the non outlined button too but since there is no "border-style" rule, none are actually effective. |
|
Hey there, tested with 2022 and it looks like it does solve the issue — the styles.blocks.button padding and border values are respected for the outline style variations:
This is sort of solved if you supply "solid" to
But yeah, the heights differing between the style variations is maybe a different issue to address. |
|
More testing: TT1 Blocks, w/o any border/padding adjustments in theme.json: TT1 Blocks, w border and padding adjustments: |
Right, but we'd need to have the button's background color applied to the border color (for the filled style) to make the buttons display at the same height like this:
|
richtabor
approved these changes
Oct 27, 2021
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
See #35438
This PR lowers the specificity of the border & padding styles for outline block styles so it can be overridden by the theme via theme.json.
How to test
theme.jsonand add this to thestyles.blockssection:The expected result is that both buttons have the same padding and the outline style has a red border. Note that, by doing this the two buttons will end up with different heights given that the outlined one has padding + border-width: this is a different issue that needs to be looked at separately.