Table
Tables display sets of data organized in rows and columns for easy scanning.
Basic Table
| Project | Technology | Status | Version |
|---|---|---|---|
| Brand Site | Astro | Active | 0.41.2 |
| Portal | Angular | Active | 3.12.0 |
| Corporate | TanStack Start | Development | 0.5.1 |
| API Gateway | .NET 9 | Active | 2.8.4 |
| Data Pipeline | Wolverine | Maintenance | 1.3.7 |
Dense Table
| Project | Technology | Version |
|---|---|---|
| Brand Site | Astro | 0.41.2 |
| Portal | Angular | 3.12.0 |
| Corporate | TanStack Start | 0.5.1 |
| API Gateway | .NET 9 | 2.8.4 |
| Data Pipeline | Wolverine | 1.3.7 |
Striped (Hover)
| Project | Technology | Status |
|---|---|---|
| Brand Site | Astro | Active |
| Portal | Angular | Active |
| Corporate | TanStack Start | Development |
| API Gateway | .NET 9 | Active |
| Data Pipeline | Wolverine | Maintenance |
Usage
import Table from '@mui/material/Table';
import TableBody from '@mui/material/TableBody';
import TableCell from '@mui/material/TableCell';
import TableHead from '@mui/material/TableHead';
import TableRow from '@mui/material/TableRow';
<Table>
<TableHead>
<TableRow>
<TableCell>Name</TableCell>
<TableCell>Status</TableCell>
</TableRow>
</TableHead>
<TableBody>
<TableRow>
<TableCell>Project A</TableCell>
<TableCell>Active</TableCell>
</TableRow>
</TableBody>
</Table>