-
Notifications
You must be signed in to change notification settings - Fork 4.3k
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.
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
Fix site editor back button visual regressions #66166
Conversation
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. |
Size Change: +26 B (0%) Total Size: 1.77 MB
ℹ️ View Unchanged
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM 👍 Thanks for the fix @jameskoster 🚀
Happy to work on that here or in a follow-up, what do y'all think?
A follow-up makes sense to me 👍
@@ -14,7 +14,7 @@ | |||
outline: 3px solid transparent; | |||
} | |||
|
|||
&:hover, | |||
&:hover:not(:disabled,[aria-disabled=true]), | |||
&:focus-visible, | |||
&:focus, | |||
&:not([aria-disabled="true"]):active, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Should we add :disabled
here too, to align with the selector introduced above?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Also, looking forward to color theming which will hopefully make such overrides unneded
Co-authored-by: Marin Atanasov <8436925+tyxla@users.noreply.github.com>
Thanks for this PR! I just realized I recorded a featurette where this issue is visible, and now I can't unsee it 🙈 |
Flaky tests detected in 612797c. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/11363862046
|
Co-authored-by: jameskoster <jameskoster@git.wordpress.org> Co-authored-by: tyxla <tyxla@git.wordpress.org> Co-authored-by: ciampo <mciampini@git.wordpress.org> Co-authored-by: jasmussen <joen@git.wordpress.org>
I just cherry-picked this PR to the wp/6.7 branch to get it included in the next release: b43d31f |
I'm seeing a build error for this on
|
It seems the |
@jameskoster can you confirm whether this is supposed to be a part of |
I would plead to this being in 6.7, it's an important visual artifact regression. |
We could backport #65418 so the variable is available. Failing that I suppose we'll need a new PR replacing the variable with a hardcoded value 😓 |
Could we submit a new PR to the Backporting #65418 would also solve the problem, but I'm a bit hesitant because so many scss variables have changed. |
Yes, I won't be able to get to it until tomorrow though. |
I looked through all the modified lines to make sure that all the previously available variables are unchanged. We can safely backport #65418 if we're okay with the new variables being part of core. EDIT: I opened #66184 so we don't have to worry about the added variables. |
Co-authored-by: jameskoster <jameskoster@git.wordpress.org> Co-authored-by: tyxla <tyxla@git.wordpress.org> Co-authored-by: ciampo <mciampini@git.wordpress.org> Co-authored-by: jasmussen <joen@git.wordpress.org>
What?
Somewhere in the 6.7 dev cycle a couple of visual regressions were introduced to the back button in the site editor sidebar:
40px
sizing, which breaks alignment with the titleThis PR addresses both issues.
Why?
Visual polish.
How?
compact
(32px
) size variantline-height
on the sidebar title tofont-line-height-x-large
(32px
) to ensure alignmentTesting Instructions
Before
After