fixes, theming, branding

This commit is contained in:
mikicvi
2025-09-26 22:16:34 +01:00
parent 22c462c61c
commit 220f999f19
24 changed files with 787 additions and 260 deletions
@@ -473,11 +473,11 @@ export function EnhancedBookingCalendar() {
: ''
} ${
isTodayDate && !isSelectedDate
? 'ring-2 ring-blue-400 ring-opacity-50 bg-blue-50 dark:bg-blue-950 border-blue-200 dark:border-blue-800 hover:bg-blue-100 dark:hover:bg-blue-900 text-foreground'
? 'ring-2 ring-primary/20 bg-accent border-primary/20 hover:bg-accent/80 text-foreground'
: ''
} ${
isSelectedDate && isTodayDate
? 'bg-gradient-to-r from-blue-600 to-blue-700 hover:from-blue-700 hover:to-blue-800 dark:from-blue-700 dark:to-blue-800 dark:hover:from-blue-800 dark:hover:to-blue-900 text-white'
? 'bg-gradient-to-r from-primary to-primary/80 hover:from-primary/90 hover:to-primary/70 text-primary-foreground'
: ''
}`}
>
@@ -501,8 +501,8 @@ export function EnhancedBookingCalendar() {
<div
className={`text-center p-4 rounded-lg ${
isToday(selectedDate)
? 'bg-gradient-to-r from-blue-500 to-indigo-600 text-white dark:from-blue-600 dark:to-indigo-700'
: 'bg-blue-50 dark:bg-blue-950'
? 'bg-gradient-to-r from-primary to-primary/80 text-primary-foreground'
: 'bg-accent/50'
}`}
>
<h3
@@ -520,7 +520,7 @@ export function EnhancedBookingCalendar() {
{isToday(selectedDate) && (
<div className='flex items-center justify-center gap-2 mt-2'>
<div className='w-2 h-2 bg-orange-300 dark:bg-orange-400 rounded-full animate-pulse' />
<span className='text-sm font-medium text-blue-100 dark:text-blue-200'>Today</span>
<span className='text-sm font-medium text-primary-foreground/90'>Today</span>
<div className='w-2 h-2 bg-orange-300 dark:bg-orange-400 rounded-full animate-pulse' />
</div>
)}
+7 -15
View File
@@ -61,16 +61,8 @@ export function UserBookingManagement() {
const response = await fetch('/api/bookings');
if (response.ok) {
const data = await response.json();
// Filter to show only future and today's bookings
const now = new Date();
const today = now.toISOString().split('T')[0];
const relevantBookings = data.bookings.filter((booking: Booking) => {
if (booking.status !== 'active') return false;
return booking.date >= today;
});
setBookings(relevantBookings);
// API already filters to show only active future bookings (today onwards)
setBookings(data.bookings || []);
}
} catch (error) {
console.error('Error fetching bookings:', error);
@@ -282,7 +274,7 @@ export function UserBookingManagement() {
<CardHeader className='pb-3 flex flex-row items-center justify-between'>
<CardTitle className='text-base flex items-center gap-2'>
<Calendar className='h-4 w-4' />
Your Bookings
Your Upcoming Bookings
</CardTitle>
<Button size='sm' variant='outline' onClick={fetchBookings}>
<RefreshCw className='h-4 w-4' />
@@ -390,16 +382,16 @@ export function UserBookingManagement() {
</DialogHeader>
<div className='space-y-4'>
{selectedBooking && (
<div className='bg-blue-50 p-4 rounded-lg space-y-2 dark:bg-blue-950'>
<div className='flex items-center gap-2 text-sm'>
<div className='bg-accent/50 p-4 rounded-lg space-y-2'>
<div className='flex items-center gap-2 text-sm text-foreground'>
<Calendar className='h-4 w-4' />
{formatDate(selectedBooking.date)}
</div>
<div className='flex items-center gap-2 text-sm'>
<div className='flex items-center gap-2 text-sm text-foreground'>
<Clock className='h-4 w-4' />
{selectedBooking.startTime} - {selectedBooking.endTime}
</div>
<div className='flex items-center gap-2 text-sm'>
<div className='flex items-center gap-2 text-sm text-foreground'>
<MapPin className='h-4 w-4' />
{selectedBooking.court.name}
</div>