zoriya/v10
1
0
Fork 0
mirror of https://github.com/zoriya/v10.git synced 2026-08-16 02:45:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(site): tailwind demo variants for remaining component references

Browse Source 
Covers airplay-button, buffering-indicator, captions-button, controls,
playback-rate-button, poster, and popover.

Refs #840

https://claude.ai/code/session_01LUcwUd8E4Ekakp7NTFb6c5
This commit is contained in:
Claude
2026-06-11 22:57:09 +00:00
parent 18ad240660
commit c4af9832e8
35 changed files with 589 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/src/content/docs/reference/captions-button.mdx
+20
View File
@@ -14,12 +14,17 @@ import Demo from "@/components/docs/demos/Demo.astro";
import BasicUsageDemoReact from "@/components/docs/demos/captions-button/react/css/BasicUsage";
import basicUsageReactTsx from "@/components/docs/demos/captions-button/react/css/BasicUsage.tsx?raw";
import basicUsageReactCss from "@/components/docs/demos/captions-button/react/css/BasicUsage.css?raw";
import BasicUsageDemoReactTailwind from "@/components/docs/demos/captions-button/react/tailwind/BasicUsage";
import basicUsageReactTailwindTsx from "@/components/docs/demos/captions-button/react/tailwind/BasicUsage.tsx?raw";
{/* HTML demos */}
import BasicUsageDemoHtml from "@/components/docs/demos/captions-button/html/css/BasicUsage.astro";
import basicUsageHtml from "@/components/docs/demos/captions-button/html/css/BasicUsage.html?raw";
import basicUsageHtmlCss from "@/components/docs/demos/captions-button/html/css/BasicUsage.css?raw";
import basicUsageHtmlTs from "@/components/docs/demos/captions-button/html/css/BasicUsage.ts?raw";
import BasicUsageDemoHtmlTailwind from "@/components/docs/demos/captions-button/html/tailwind/BasicUsage.astro";
import basicUsageTailwindHtml from "@/components/docs/demos/captions-button/html/tailwind/BasicUsage.html?raw";
import basicUsageTailwindHtmlTs from "@/components/docs/demos/captions-button/html/tailwind/BasicUsage.ts?raw";
## Anatomy
@@ -75,6 +80,13 @@ Renders a `<button>` with an automatic `aria-label`: "Disable captions" when act
<BasicUsageDemoReact client:idle />
</Demo>
</StyleCase>
<StyleCase styles={["tailwind"]}>
<Demo files={[
{ title: "App.tsx", code: basicUsageReactTailwindTsx, lang: "tsx" },
]}>
<BasicUsageDemoReactTailwind client:idle />
</Demo>
</StyleCase>
</FrameworkCase>
<FrameworkCase frameworks={["html"]}>
@@ -87,6 +99,14 @@ Renders a `<button>` with an automatic `aria-label`: "Disable captions" when act
<BasicUsageDemoHtml />
</Demo>
</StyleCase>
<StyleCase styles={["tailwind"]}>
<Demo files={[
{ title: "index.html", code: basicUsageTailwindHtml, lang: "html" },
{ title: "index.ts", code: basicUsageTailwindHtmlTs, lang: "ts" },
]}>
<BasicUsageDemoHtmlTailwind />
</Demo>
</StyleCase>
</FrameworkCase>
<ComponentReference component="CaptionsButton" />