fix: support 6-column grid layout in booking calendar
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -304,8 +304,10 @@ export function BookingCalendar({ siteId, onSlotClick }: BookingCalendarProps) {
|
||||
courts.length === 2 && "grid-cols-2",
|
||||
courts.length === 3 && "grid-cols-3",
|
||||
courts.length === 4 && "grid-cols-4",
|
||||
courts.length >= 5 && "grid-cols-5"
|
||||
courts.length === 5 && "grid-cols-5",
|
||||
courts.length >= 6 && "grid-cols-6"
|
||||
)}
|
||||
style={courts.length >= 5 ? { minWidth: `${courts.length * 150}px` } : undefined}
|
||||
>
|
||||
{courts.map((court) => (
|
||||
<div
|
||||
@@ -333,8 +335,10 @@ export function BookingCalendar({ siteId, onSlotClick }: BookingCalendarProps) {
|
||||
courts.length === 2 && "grid-cols-2",
|
||||
courts.length === 3 && "grid-cols-3",
|
||||
courts.length === 4 && "grid-cols-4",
|
||||
courts.length >= 5 && "grid-cols-5"
|
||||
courts.length === 5 && "grid-cols-5",
|
||||
courts.length >= 6 && "grid-cols-6"
|
||||
)}
|
||||
style={courts.length >= 5 ? { minWidth: `${courts.length * 150}px` } : undefined}
|
||||
>
|
||||
{courts.map((court) => {
|
||||
const courtAvail = availability.get(court.id);
|
||||
|
||||
Reference in New Issue
Block a user