owenrees/echecsfrance
1
0
Fork 0
mirror of https://github.com/TheRealOwenRees/echecsfrance.git synced 2026-07-23 04:26:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

table overflow fixed

Browse Source
This commit is contained in:
Owen Rees
2023-06-10 12:44:42 +02:00
parent fbefd7eaa0
commit a732508429
6 changed files with 31 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/TournamentTable.tsx
+9 -8
View File
@@ -16,11 +16,12 @@ export default function TournamentTable({
setFilteredTournamentData(tournamentFilter);
}, [tournamentFilter]);
console.log(filteredTournamentData.length);
const stickyHeader = "sticky top-0 p-3 bg-gray-600";
return (
<section
id="tournament-table"
className="w-full grid h-[calc(100vh-176px)] md:h-[calc(100vh-82px)] lg:h-[calc(100vh-132px)] lg:col-start-2 lg:col-end-3"
>
<section className="w-full grid auto-rows-max h-[calc(100vh-176px)] md:h-[calc(100vh-82px)] lg:h-[calc(100vh-132px)] lg:col-start-2 lg:col-end-3">
<SearchBar
tournamentFilter={tournamentFilter}
setTournamentFilter={setTournamentFilter}
@@ -28,10 +29,10 @@ export default function TournamentTable({
<table className="relative table-fixed w-full text-center text-xs">
<thead className="bg-gray-600 text-white">
<tr>
<th className="sticky top-0 p-3 bg-gray-600">Date</th>
<th className="sticky top-0 p-3 bg-gray-600">Ville</th>
<th className="sticky top-0 p-3 bg-gray-600">Tournois</th>
<th className="sticky top-0 p-3 bg-gray-600">Cadence</th>
<th className={stickyHeader}>Date</th>
<th className={stickyHeader}>Ville</th>
<th className={stickyHeader}>Tournois</th>
<th className={stickyHeader}>Cadence</th>
</tr>
</thead>
<tbody>{filteredTournamentData}</tbody>