davidshore / chas_radix-dashboard

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Dashboard med Radix UI Themes

Mål

Målet är att återskapa kontrollpanelen som finns på denna sida med hjälp av Radix UI themes.

Komponenten för diagrammet finns inte med i Radix UI. Använd istället Ovewview.jsx som finns i detta projekt.

Komponenten för kalendern behöver inte vara med.

Steg att följa

  1. Skapa ett nytt React-projekt med vite.

  2. Installera radix ui themes

  3. Besök länken och analysera dashboardens layout och funktioner. Försök hitta lämpliga komponenter i Radix UI

  4. Använd React och Radix UI-komponenter för att återskapa dashboarden. Fokus bör ligga på att matcha layouten så nära som möjligt (det behöver inte vara perfekt). Installera gärna tailwind eller kör på vanlig css. Glöm inte att använda className i React.

  5. Implementera Radix UI-teman för att anpassa utseendet på komponenterna och skapa en enhetlig design.

Komponenter och Funktioner att Inkludera

  • Meny
  • Popover
  • Cards
  • Table
  • Tabs
  • Diagram Använd Ovewview.jsx och installera recharts:
npm install recharts

Inlämning

Ladda upp projektet till GitHub och dela länken i canvas.

About


Languages

Language:JavaScript 100.0%