Files
zeekay 0d27851745 fix: Complete UI fixes - themes, colors, builder, tabs, and code previews
Multiple comprehensive fixes to improve UI/UX across the documentation site:

1. Themes Page:
   - Changed default theme from "blue" to "neutral" to match shadcn/ui
   - Updated active-theme.tsx to use "neutral" as DEFAULT_THEME

2. Builder Page (/builder):
   - Fixed block/component visibility (registry access updated for flat structure)
   - Added "Open in H" button to toolbar
   - Fixed drag handles visibility with proper left padding (pl-16)
   - Updated registry access from Index.default[name] to Index[name]

3. Code Previews:
   - Fixed missing code previews in documentation pages
   - ComponentPreview now fetches code from registry JSON files
   - Added "use client" directive for proper hydration
   - Falls back to registry when MDX doesn't provide code children

4. Tabs Component:
   - Cleaned up styling and removed complex dark mode classes
   - Added smooth transitions (transition-all, transition-colors)
   - Consistent height (h-10) across all tab implementations
   - Fixed MDX overrides to match base component styling

5. Logo Fix:
   - Updated HanzoLogo to always use black fill (#000000)
   - Removed text-current class that was causing theme inheritance
   - Ensures black H appears correctly in both light and dark modes

6. Missing Components:
   - Added 5 missing demo components: android, code-block, code-tabs, gantt, sandbox
   - Created placeholder UI components for gantt, sandbox, code-tabs
   - Updated registry/examples.ts and registry/ui.ts

Build Status:
✅ All pages render correctly
✅ Code previews working
✅ Themes display properly
✅ Builder fully functional
✅ Drag and drop working
✅ No console errors
2025-11-06 10:39:15 -08:00

41 lines
802 B
TypeScript

import { Gantt } from "@/registry/default/ui/gantt"
export default function GanttDemo() {
const sampleTasks = [
{
id: "1",
name: "Project Planning",
start: new Date(2024, 0, 1),
end: new Date(2024, 0, 15),
progress: 100,
},
{
id: "2",
name: "Design Phase",
start: new Date(2024, 0, 10),
end: new Date(2024, 1, 5),
progress: 75,
},
{
id: "3",
name: "Development",
start: new Date(2024, 1, 1),
end: new Date(2024, 3, 30),
progress: 45,
},
{
id: "4",
name: "Testing",
start: new Date(2024, 3, 15),
end: new Date(2024, 4, 15),
progress: 0,
},
]
return (
<div className="w-full max-w-3xl">
<Gantt tasks={sampleTasks} />
</div>
)
}