Update hard-coded border-radius instances #64693
Merged
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
jameskoster
requested review from
ellatrix,
dcalhoun and
ajitbohra
as code owners
jameskoster
added
[Type] Enhancement
|
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 If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
jameskoster
commented
Aug 21, 2024
| @@ -102,7 +102,6 @@ | |||
|
|
|||
| .block-editor-global-styles-background-panel__image-tools-panel-item { | |||
| border: $border-width solid $gray-300; | |||
| border-radius: 2px; | |||
There was a problem hiding this comment.
The radius here is already added to the parent element.
| @@ -553,7 +553,6 @@ svg { | |||
| background-color: #1e1e1e; | |||
| color: #fff; | |||
| margin: $grid-unit-10 0 0 24px; | |||
| border-radius: 2px; | |||
There was a problem hiding this comment.
Radius here is inherited from the Button component.
| @@ -100,25 +100,6 @@ $components-custom-gradient-picker__padding: $grid-unit-20; // 48px container, 1 | |||
| height: 20px; | |||
| } | |||
|
|
|||
| .components-custom-gradient-picker .components-custom-gradient-picker__toolbar { | |||
There was a problem hiding this comment.
This class doesn't seem to be used at all.
| @@ -43,7 +43,7 @@ $resize-handler-container-size: $resize-handler-size + ($grid-unit-05 * 2); // M | |||
| // This is the "visible" resize handle for side handles - the line | |||
| .components-resizable-box__side-handle::before { | |||
| display: block; | |||
| border-radius: 2px; | |||
| border-radius: $radius-full; | |||
There was a problem hiding this comment.
Ensures the handle is fully rounded regardless of any future width/height changes.
Comment on lines
-263
to
-264
| .edit-site-layout.is-full-canvas { | ||
| .edit-site-layout__view-mode-toggle.components-button { |
There was a problem hiding this comment.
So far as I can tell, .edit-site-layout__view-mode-toggle will never render inside .edit-site-layout.is-full-canvas.
Comment on lines
-14
to
-18
| border-radius: 2px; | ||
|
|
||
| .page-patterns-preview-field__button { | ||
| border-radius: 2px; | ||
| } |
There was a problem hiding this comment.
I don't see any reason for the preview thumbnail to have a different radius based on layout selection.
|
Size Change: +218 B (+0.01%) Total Size: 1.77 MB
ℹ️ View Unchanged
|
jasmussen
approved these changes
Aug 22, 2024
ciampo
reviewed
Aug 22, 2024
| @@ -89,7 +89,6 @@ | |||
| } | |||
|
|
|||
| &:focus-visible { | |||
| border-radius: 2px; | |||
There was a problem hiding this comment.
Keeping or removing the radius is totally a design decision, but I think that whatever we decide should likely be applied to Tabs too (which is still private, but will ultimately replace TabPanel)
|
|
jameskoster
commented
Aug 22, 2024
| @@ -102,7 +102,6 @@ | |||
| &.is-error { | |||
| .components-form-token-field__token-text { | |||
| color: $alert-red; | |||
| border-radius: 4px 0 0 4px; | |||
There was a problem hiding this comment.
I think this is safe to remove. The radius here is never visible:
There was a problem hiding this comment.
Agreed — also, I don't see why there should be a different radius (4px) compared to the default (2px)
ciampo
reviewed
Aug 22, 2024
|
Thank you for the great work on style consistency 👍 In 9a71ac5 I've pushed another missed instance of |
|
Thanks @tyxla :) |
|
@jameskoster are we good to merge? Just asking while there are no conflicts 😂 |
|
Yes I think so 🚀 |
bph
pushed a commit
to bph/gutenberg
that referenced
this pull request
Aug 31, 2024
Co-authored-by: jameskoster <jameskoster@git.wordpress.org> Co-authored-by: tyxla <tyxla@git.wordpress.org> Co-authored-by: jasmussen <joen@git.wordpress.org> Co-authored-by: ciampo <mciampini@git.wordpress.org>
jameskoster
added
the
Design System
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.
What?
Update any instances of hard-coded border radii to utilise the new radius scale (#63703).
Why?
Code cleanliness, ease of maintenance.
Screenshots
There are only two visual change here;
$radius-x-smallis applied to tokens inFormTokenField