Skip to content
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

Tabs: unify vertical tabs styles #65387

Merged
merged 61 commits into from
Oct 7, 2024
Merged

Tabs: unify vertical tabs styles #65387

Changes from 1 commit
Commits
Show all changes
61 commits
Select commit Hold shift + click to select a range
1fe9f0b
Remove inserter pattern overrides
DaniGuardiola Sep 17, 2024
aa7e9d9
Merge branch 'trunk' of https://github.com/WordPress/gutenberg into i…
DaniGuardiola Sep 19, 2024
a3e54c5
Make font weights 400 (inactive) and 500 (active)
DaniGuardiola Sep 19, 2024
0b436e8
Apply styles only when vertical.
DaniGuardiola Sep 20, 2024
299d23c
Make vertical indicator theme accent color at 4% opacity.
DaniGuardiola Sep 20, 2024
30cda58
Make height 48px.
DaniGuardiola Sep 24, 2024
4749518
Add radius.
DaniGuardiola Sep 24, 2024
4ba287f
Also use hover styles in focus-visible.
DaniGuardiola Sep 24, 2024
7847ed6
Fix indicator not visible in inserter > patterns/media.
DaniGuardiola Sep 27, 2024
c9e8020
Adjust padding.
DaniGuardiola Sep 27, 2024
0499718
Tweak focus ring.
DaniGuardiola Sep 27, 2024
77ce702
Wrap long labels.
DaniGuardiola Sep 27, 2024
23f5438
Add chevron and fix a few minor details.
DaniGuardiola Sep 29, 2024
5ffc33d
Merge branch 'trunk' of https://github.com/WordPress/gutenberg into i…
DaniGuardiola Sep 30, 2024
fa2da0a
Fix merge issues.
DaniGuardiola Sep 30, 2024
af857d3
Fix focus indicator (gets cropped with the new overflow auto setting)
DaniGuardiola Sep 30, 2024
a8a3f3f
Merge branch 'trunk' of https://github.com/WordPress/gutenberg into i…
DaniGuardiola Sep 30, 2024
9867089
Fix unwanted chevron.
DaniGuardiola Oct 1, 2024
bd0a96c
Merge branch 'trunk' of https://github.com/WordPress/gutenberg into i…
DaniGuardiola Oct 2, 2024
56989af
Fix unwanted nested scrollbar in inserter > patterns/media vertical t…
DaniGuardiola Oct 2, 2024
517950e
Switch to transform for performance.
DaniGuardiola Oct 2, 2024
a708e6b
Adjust border-radius based on scaling factor.
DaniGuardiola Oct 2, 2024
4aa21c8
Apply feedback.
DaniGuardiola Oct 2, 2024
dcbd6f5
Add changelog entry.
DaniGuardiola Oct 3, 2024
0a65888
Merge branch 'trunk' of https://github.com/WordPress/gutenberg into i…
DaniGuardiola Oct 3, 2024
f0902e8
Switch to `padding-inline`.
DaniGuardiola Oct 3, 2024
e12afb5
Merge branch 'trunk' of https://github.com/WordPress/gutenberg into i…
DaniGuardiola Oct 3, 2024
535463c
Remove unnecessary styles.
DaniGuardiola Oct 4, 2024
3c43be8
Fix horizontal tabs height.
DaniGuardiola Oct 4, 2024
2d4bc91
Remove more unnecessary styles (padding).
DaniGuardiola Oct 4, 2024
7f1e764
Make horizontal padding specific to inline.
DaniGuardiola Oct 4, 2024
34cece9
Make flex/whitespace styles more explicit.
DaniGuardiola Oct 4, 2024
3b82ba0
Make scroll margin specific to vertical tabs.
DaniGuardiola Oct 4, 2024
789545f
The "inline" in inline-flex is unnecessary and confusing, removed it.
DaniGuardiola Oct 4, 2024
094786c
Remove unnecessary position: relative
DaniGuardiola Oct 4, 2024
87ce756
Make resets more explicit
DaniGuardiola Oct 4, 2024
9808c75
Remove unnecessary text-align.
DaniGuardiola Oct 4, 2024
74851f8
Improve comment
DaniGuardiola Oct 4, 2024
cba3d80
Remove unnecessary margin-left
DaniGuardiola Oct 4, 2024
e6b902f
Clean up TabList styles.
DaniGuardiola Oct 4, 2024
41dc764
Adjust text-align.
DaniGuardiola Oct 4, 2024
cfc7928
Clean up selector
DaniGuardiola Oct 4, 2024
d345ebd
Fix focus indicator
DaniGuardiola Oct 4, 2024
9c28772
Clean up position: relative.
DaniGuardiola Oct 4, 2024
f831078
Fix typo.
DaniGuardiola Oct 4, 2024
b4f5c21
Add position: relative back.
DaniGuardiola Oct 4, 2024
a9b1578
Improve focus indicator when selectOnMove is enabled.
DaniGuardiola Oct 4, 2024
5736e59
Merge branch 'trunk' of https://github.com/WordPress/gutenberg into i…
DaniGuardiola Oct 4, 2024
f4dbf4f
Add fade in effect to chevron when selectOnMove is enabled.
DaniGuardiola Oct 4, 2024
94f788b
Use [data-focus-visible] consistently.
DaniGuardiola Oct 4, 2024
01f31da
Styles clean up.
DaniGuardiola Oct 4, 2024
4337d49
Add comment for clarity.
DaniGuardiola Oct 4, 2024
01cefc9
Move scroll-margin to the right place.
DaniGuardiola Oct 4, 2024
bb6b4e1
Use CSS variable for accuracy.
DaniGuardiola Oct 4, 2024
b6710f2
Fix overflow.
DaniGuardiola Oct 4, 2024
822715b
Skip failing test for Safari :(
DaniGuardiola Oct 4, 2024
ece5efc
Fix flashing issue.
DaniGuardiola Oct 4, 2024
07069c8
Transition chevron only on selected and not on hover or focus-visible.
DaniGuardiola Oct 4, 2024
b008f3a
Improve chevron opacity transition with suggested value.
DaniGuardiola Oct 7, 2024
ee8783f
fix changelog
DaniGuardiola Oct 7, 2024
3d9bde2
Merge branch 'trunk' of https://github.com/WordPress/gutenberg into i…
DaniGuardiola Oct 7, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 1 addition & 5 deletions packages/components/src/tabs/styles.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -251,11 +251,7 @@ export const TabChevron = styled( Icon )`
// indicator that's being animated at the same time.
@media not ( prefers-reduced-motion ) {
[data-select-on-move='true']
[role='tab']:is(
[aria-selected='true'],
[data-focus-visible],
:hover
)
[role='tab']:is( [aria-selected='true'], )
& {
transition: opacity 0.3s ease-in;
stokesman marked this conversation as resolved.
Show resolved Hide resolved
Copy link
Contributor Author

Choose a reason for hiding this comment

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

@t-hamano oof, I accidentally replaced the wrong transition, this is where it should have been replaced.

}
Expand Down
Loading