diff --git a/packages/sandbox/.gitignore b/packages/sandbox/.gitignore index e71bfe66..71bcfc6c 100644 --- a/packages/sandbox/.gitignore +++ b/packages/sandbox/.gitignore @@ -1,3 +1 @@ src/* -!src/index.html -!src/main.tsx diff --git a/packages/sandbox/templates/index.html b/packages/sandbox/templates/index.html new file mode 100644 index 00000000..a2779a90 --- /dev/null +++ b/packages/sandbox/templates/index.html @@ -0,0 +1,15 @@ + + + + + + Sandbox + + + + + +
+ + + diff --git a/packages/sandbox/templates/main.tsx b/packages/sandbox/templates/main.tsx new file mode 100644 index 00000000..53004947 --- /dev/null +++ b/packages/sandbox/templates/main.tsx @@ -0,0 +1,4 @@ +import { createRoot } from 'react-dom/client'; +import { App } from './shell/app'; + +createRoot(document.getElementById('root')!).render(); diff --git a/packages/sandbox/templates/shell/navbar.tsx b/packages/sandbox/templates/shell/navbar.tsx index 9b4d9ee7..bb5ccc7e 100644 --- a/packages/sandbox/templates/shell/navbar.tsx +++ b/packages/sandbox/templates/shell/navbar.tsx @@ -53,10 +53,12 @@ export function Navbar({ sources, }: NavbarProps) { return ( -
- Video.js v10 +
+ + Video.js v10 + -
+
onChange(e.target.value)} disabled={disabled} - className="h-8 appearance-none rounded-md border-none bg-clip-border ring ring-zinc-800/10 bg-white pl-3 pr-8 text-[13px] font-medium text-zinc-950 shadow-xs shadow-black/20 transition-colors hover:bg-zinc-50 focus:outline-2 focus:outline-zinc-950 focus:outline-offset-2 disabled:pointer-events-none disabled:opacity-50" + className="h-8 appearance-none rounded-md border-none bg-clip-border ring ring-zinc-800/10 dark:ring-white/10 bg-white dark:bg-zinc-900 pl-3 pr-8 text-[13px] font-medium text-zinc-950 dark:text-zinc-50 shadow-xs shadow-black/20 transition-colors hover:bg-zinc-50 dark:hover:bg-zinc-900 focus:outline-2 focus:outline-zinc-950 dark:focus:outline-zinc-50 focus:outline-offset-2 disabled:pointer-events-none disabled:opacity-50" > {options.map((opt) => (