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

Global Styles: Add Style Book to Global Styles #45960

Merged
merged 20 commits into from
Dec 5, 2022
Merged

Global Styles: Add Style Book to Global Styles #45960

Changes from 1 commit
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
a26d321
Add Style Book
noisysocks Nov 29, 2022
4bb1790
Disable toolbar butons when Style Book is open
noisysocks Nov 29, 2022
2db814c
Disable Style Book when in Code Editor mode
noisysocks Nov 30, 2022
7b3e1c1
Make cursor a hand when hovering an example
noisysocks Nov 30, 2022
071f55c
Remove top and bottom margin from block inside preview
noisysocks Nov 30, 2022
7f22f7e
Add border beneath tab bar, make tab bar scroll on mobile
noisysocks Nov 30, 2022
b619e31
Improve performance
noisysocks Nov 30, 2022
e17b70b
Improve a11y
noisysocks Nov 30, 2022
1c05a83
Add E2E tests
noisysocks Nov 30, 2022
016e2d2
Make example titles uppercase
noisysocks Dec 2, 2022
27d39b5
Hide toolbar when Style Book is open
noisysocks Dec 2, 2022
d389335
Make tabs always have white background
noisysocks Dec 2, 2022
a42064c
Update tests
noisysocks Dec 2, 2022
cf6d6f2
Add a little note of encouragement for future developers
noisysocks Dec 2, 2022
3239fb0
Add border radius to Story Book
noisysocks Dec 4, 2022
c6d94f9
Fix vertical alignment of close button
noisysocks Dec 5, 2022
18c601c
Reduce font size and increase font weight of example labels
noisysocks Dec 5, 2022
ae3f5af
Remove hover outline
noisysocks Dec 5, 2022
47305ff
Use theme color for text instead of white or black
noisysocks Dec 5, 2022
b882088
Use math.div()
noisysocks Dec 5, 2022
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
Prev Previous commit
Next Next commit
Add border beneath tab bar, make tab bar scroll on mobile
  • Loading branch information
@noisysocks
noisysocks committed Dec 4, 2022
commit 7f22f7e0527f07ca8b9dd10759141451a21bedf1
24 changes: 16 additions & 8 deletions packages/edit-site/src/components/style-book/style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,14 +22,22 @@
top: $grid-unit-10;
}

.edit-site-style-book__tab-panel .components-tab-panel__tab-content {
bottom: 0;
left: 0;
overflow: auto;
padding: $grid-unit-40;
position: absolute;
right: 0;
top: $grid-unit-60; // Height of tabs.
.edit-site-style-book__tab-panel {
.components-tab-panel__tabs {
margin-right: $button-size + $grid-unit-10;
overflow: auto;
}

.components-tab-panel__tab-content {
border-top: 1px solid $gray-400;
bottom: 0;
left: 0;
overflow: auto;
padding: $grid-unit-40;
position: absolute;
right: 0;
top: $grid-unit-60; // Height of tabs.
}
}

.edit-site-style-book__examples {
Expand Down