44 lines
1.7 KiB
TypeScript
44 lines
1.7 KiB
TypeScript
import { type Puzzle } from '@/lib/puzzles';
|
|
|
|
import AppLink from './AppLink';
|
|
|
|
export default function CardTable({ puzzles }: { puzzles: Puzzle[] }) {
|
|
return (
|
|
<div className="relative h-96 w-full overflow-scroll">
|
|
<table className="min-w-full table-auto rounded-lg border-2 border-highlight-primary bg-primary-700 text-left text-sm text-muted shadow-md">
|
|
<thead className="z-1 sticky -top-1 bg-primary-600 text-xs uppercase text-white ">
|
|
<tr>
|
|
<th className="px-6 py-3">Exercice</th>
|
|
<th className="px-6 py-3">Tentative</th>
|
|
<th className="px-6 py-3">Score</th>
|
|
<th className="px-6 py-3">Dernier essai</th>
|
|
<th className="px-6 py-3">
|
|
<span className="sr-only">Reprendre</span>
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody className="overflow-y-scroll">
|
|
{puzzles.length &&
|
|
puzzles.map((puzzle) => (
|
|
<tr key={puzzle.id} className="bg-primary-700 hover:bg-primary-800 ">
|
|
<th scope="row" className="whitespace-nowrap px-6 py-4 font-medium text-white">
|
|
{puzzle.name}
|
|
</th>
|
|
<td className="px-6 py-4">30</td>
|
|
<td className="px-6 py-4">300</td>
|
|
<td className="px-6 py-4">10/10/2010</td>
|
|
<td className="px-6 py-4 text-right">
|
|
<AppLink
|
|
href={`dashboard/puzzles/${puzzle.id}`}
|
|
className="font-medium text-brand hover:underline"
|
|
>
|
|
Reprendre
|
|
</AppLink>
|
|
</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
);
|
|
}
|