diff --git a/client/src/components/PDF/TripPDF.tsx b/client/src/components/PDF/TripPDF.tsx
index 91da01d..2ef5fdc 100644
--- a/client/src/components/PDF/TripPDF.tsx
+++ b/client/src/components/PDF/TripPDF.tsx
@@ -238,51 +238,39 @@ export async function downloadTripPDF({ trip, days, places, assignments, categor
`
}).join('')
- const accommodationsForDay = accommodations.accommodations?.filter(a =>
+ const accommodationsForDay = (accommodations.accommodations || []).filter(a =>
days.some(d => d.id >= a.start_day_id && d.id <= a.end_day_id && d.id === day?.id)
- ).sort((a, b) => a.start_day_id - b.start_day_id);
+ ).sort((a, b) => a.start_day_id - b.start_day_id)
- //Const icons for accommodation actions and details
- const ICON_ACC_CHECKIN = accommodationIconSvg('checkin');
- const ICON_ACC_CHECKOUT = accommodationIconSvg('checkout');
- const ICON_ACC_LOCATION = accommodationIconSvg('location');
- const ICON_ACC_NOTE = accommodationIconSvg('note');
- const ICON_ACC_CONFIRMATION = accommodationIconSvg('confirmation');
- const ICON_ACC_ACCOMMODATION = accommodationIconSvg('accommodation');
-
- const accommodationDetails = accommodationsForDay.map(item => {
-
- const isCheckIn = day.id === item.start_day_id;
- const isCheckOut = day.id === item.end_day_id;
- const accomoAction = isCheckIn ? tr('reservations.meta.checkIn')
- : isCheckOut ? tr('reservations.meta.checkOut')
- : tr('reservations.meta.linkAccommodation')
-
- const accomoEmoji = isCheckIn ? ICON_ACC_CHECKIN
- : isCheckOut ? ICON_ACC_CHECKOUT
- : ICON_ACC_ACCOMMODATION
-
- const accomoTime = isCheckIn ? item.check_in || 'N/A'
- : isCheckOut ? item.check_out || 'N/A'
- : ''
+ const accommodationDetails = accommodationsForDay.map(item => {
+ const isCheckIn = day.id === item.start_day_id
+ const isCheckOut = day.id === item.end_day_id
+ const actionLabel = isCheckIn ? tr('reservations.meta.checkIn')
+ : isCheckOut ? tr('reservations.meta.checkOut')
+ : tr('reservations.meta.linkAccommodation')
+ const actionIcon = isCheckIn ? accommodationIconSvg('checkin')
+ : isCheckOut ? accommodationIconSvg('checkout')
+ : accommodationIconSvg('accommodation')
+ const timeStr = isCheckIn ? (item.check_in || '')
+ : isCheckOut ? (item.check_out || '')
+ : ''
return `
-
-
${accomoEmoji} ${escHtml(accomoAction)}
- ${accomoTime ? `
${accomoEmoji} ${accomoTime}
` : ''}
+
+
${actionIcon} ${escHtml(actionLabel)}
+ ${timeStr ? `
${accommodationIconSvg('checkin')} ${escHtml(timeStr)}
` : ''}
+
${accommodationIconSvg('accommodation')} ${escHtml(item.place_name)}
+ ${item.place_address ? `
${accommodationIconSvg('location')} ${escHtml(item.place_address)}
` : ''}
+ ${item.notes ? `
${accommodationIconSvg('note')} ${escHtml(item.notes)}
` : ''}
+ ${isCheckIn && item.confirmation ? `
${accommodationIconSvg('confirmation')} ${escHtml(item.confirmation)}
` : ''}
+
`
+ }).join('')
-
${ICON_ACC_ACCOMMODATION} ${escHtml(item.place_name)}
- ${item.place_address ? `
${ICON_ACC_LOCATION} ${escHtml(item.place_address)}
` : ''}
- ${item.notes ? `
${ICON_ACC_NOTE} ${escHtml(item.notes)}
` : ''}
- ${isCheckIn && item.confirmation ? `
${ICON_ACC_CONFIRMATION} ${escHtml(item.confirmation)}
` : ''}
-
- `
- }).join('');
-
- const accommodationsHtml = accommodationDetails ?
- `
-
${accommodationDetails}
-
` : '';
+ const accommodationsHtml = accommodationsForDay.length > 0
+ ? `
+
${accommodationDetails}
+
`
+ : ''
return `
@@ -377,38 +365,20 @@ export async function downloadTripPDF({ trip, days, places, assignments, categor
.day-body { padding: 12px 28px 6px; }
/* accommodation info */
- .day-accommodations-overview { font-size: 12px; }
- .day-accommodations { display: flex; flex-direction: row; justify-content: space-between; }
+ .day-accommodations-overview { font-size: 12px; }
+ .day-accommodations { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; }
.day-accommodations.single { justify-content: center; }
-
- .day-accommodation {
- width: 50%;
- margin:10px;
- padding:10px;
- border:2px solid #e2e8f0;
- border-radius: 12px;
- justify-content: center;
- display: flex;
- flex-direction: column;
+ .day-accommodation {
+ flex: 1 1 45%; min-width: 200px; margin: 4px 0; padding: 10px;
+ border: 2px solid #e2e8f0; border-radius: 12px;
+ display: flex; flex-direction: column;
}
-
.day-accommodation-title {
- font-size: 18px;
- font-weight: 600;
- text-align: center;
- margin-bottom: 4px;
- align-self: center;
+ font-size: 16px; font-weight: 600; text-align: center;
+ margin-bottom: 4px; align-self: center;
}
+ .accommodation-center-icon { display: flex; align-items: center; gap: 4px; }
- .accommodation-center-icon {
- display: flex;
- align-items: center;
- }
-
- .accommodation-icon {
- margin-right: 4px;
- }
-
/* ── Place card ────────────────────────────────── */
.place-card {