aljaz/opencode
1
0
Fork 0
mirror of https://github.com/aljazceru/opencode.git synced 2025-12-21 09:44:21 +01:00
Code Issues Packages Projects Releases Wiki Activity

wip: desktop work

Browse Source
This commit is contained in:
Adam
2025-10-24 11:23:32 -05:00
parent fe8f6d7a3e
commit 86447b5764
10 changed files with 477 additions and 173 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
packages/ui/src/demo.tsx
View File

@@ -1,6 +1,7 @@
import type { Component } from "solid-js"
import { createSignal } from "solid-js"
import {
Accordion,
Button,
Select,
Tabs,
@@ -214,6 +215,41 @@ const Demo: Component = () => {
</Collapsible.Content>
</Collapsible>
</section>
<h3>Accordion</h3>
<section>
<Accordion collapsible>
<Accordion.Item value="item-1">
<Accordion.Header>
<Accordion.Trigger>What is Kobalte?</Accordion.Trigger>
</Accordion.Header>
<Accordion.Content>
<div style={{ padding: "16px" }}>
<p>Kobalte is a UI toolkit for building accessible web apps and design systems with SolidJS.</p>
</div>
</Accordion.Content>
</Accordion.Item>
<Accordion.Item value="item-2">
<Accordion.Header>
<Accordion.Trigger>Is it accessible?</Accordion.Trigger>
</Accordion.Header>
<Accordion.Content>
<div style={{ padding: "16px" }}>
<p>Yes. It adheres to the WAI-ARIA design patterns.</p>
</div>
</Accordion.Content>
</Accordion.Item>
<Accordion.Item value="item-3">
<Accordion.Header>
<Accordion.Trigger>Can it be animated?</Accordion.Trigger>
</Accordion.Header>
<Accordion.Content>
<div style={{ padding: "16px" }}>
<p>Yes! You can animate the content height using CSS animations.</p>
</div>
</Accordion.Content>
</Accordion.Item>
</Accordion>
</section>
</div>
)