feat: add zustand playground (#3209)

* feat: add zustand playground

* use another playground

* fix styles

---------

Co-authored-by: daishi <daishi@axlight.com>
This commit is contained in:
Triumph-light 2025-11-30 07:35:40 +08:00 committed by GitHub
parent f99902226a
commit ddfc158f87
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 25 additions and 14 deletions

View File

@ -6,18 +6,17 @@ export default function Details() {
<a href="https://github.com/pmndrs/zustand">Github</a>
</nav>
<div className="bottom">
<a
href="https://github.com/pmndrs/zustand/tree/main/examples/demo"
className="bottom-right"
>
{'<Source />'}
</a>
<a
href="https://www.instagram.com/tina.henschel/"
className="bottom-left"
>
<a href="https://www.instagram.com/tina.henschel/">
Illustrations @ Tina Henschel
</a>
<div className="bottom-links">
<a href="https://github.com/pmndrs/zustand/tree/main/examples/demo">
{'<Source />'}
</a>
<a href="https://stackblitz.com/github/pmndrs/zustand/tree/main/examples/starter?file=src%2Findex.tsx">
{'<Playground />'}
</a>
</div>
</div>
<span className="header-left">Zustand</span>
</>

View File

@ -158,14 +158,26 @@ a {
flex: 0 0 auto;
}
a.bottom-left {
.bottom {
position: fixed;
bottom: 40px;
left: 40px;
right: 40px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 12px;
}
a.bottom-right {
bottom: 40px;
right: 40px;
.bottom a {
position: static;
}
.bottom-links {
display: flex;
gap: 16px;
align-items: center;
}
.snippet-container {