@@ -80,6 +99,7 @@ export default function VacayCalendar() {
companyHolidaysEnabled={companyHolidaysEnabled}
entryMap={entryMap}
onCellClick={handleCellClick}
+ onCellHover={handleCellHover}
companyMode={companyMode}
blockWeekends={blockWeekends}
weekendDays={weekendDays}
@@ -89,13 +109,39 @@ export default function VacayCalendar() {
))}
+ {/* Custom half-day tooltip — who is off on this date and how much. Rendered
+ fixed at the root (not inside a month card) so backdrop-filter stacking
+ contexts can't clip or occlude it. */}
+ {tip && tipEntries && tipEntries.length > 0 && (
+
setCompanyMode(false)}
+ onClick={() => setMode('vacation')}
className="flex items-center gap-1 sm:gap-1.5 px-2 sm:px-3 py-1.5 rounded-full text-[11px] sm:text-xs font-semibold transition-[background-color,color] duration-150 ease-[cubic-bezier(0.23,1,0.32,1)]"
- style={!companyMode
+ style={mode === 'vacation'
? { background: 'var(--vg-ink)', color: 'var(--vg-bg)' }
: { background: 'transparent', color: 'var(--vg-ink2)' }}>
@@ -104,7 +150,7 @@ export default function VacayCalendar() {
{companyHolidaysEnabled && (
setCompanyMode(true)}
+ onClick={() => setMode('company')}
className="flex items-center gap-1 sm:gap-1.5 px-2 sm:px-3 py-1.5 rounded-full text-[11px] sm:text-xs font-semibold transition-[background-color,color] duration-150 ease-[cubic-bezier(0.23,1,0.32,1)]"
style={companyMode
? { background: '#d97706', color: '#fff' }
@@ -113,6 +159,26 @@ export default function VacayCalendar() {
{t('vacay.modeCompany')}
)}
+
+ {/* Divider — the half-day switch is a modifier, not a mode. */}
+
+
+ setHalfDay(v => !v)}
+ title={t('vacay.modeHalfHint')}
+ aria-pressed={halfDay}
+ className="flex items-center gap-1.5 pl-2 pr-2.5 sm:pl-2.5 sm:pr-3 py-1.5 rounded-full text-[11px] sm:text-xs font-semibold transition-[background-color,color] duration-150 ease-[cubic-bezier(0.23,1,0.32,1)]"
+ style={halfDay
+ ? { background: 'var(--vg-ink)', color: 'var(--vg-bg)' }
+ : { background: 'transparent', color: 'var(--vg-ink3)' }}>
+ ½
+ {t('vacay.modeHalf')}
+
diff --git a/client/src/components/Vacay/VacayMonthCard.tsx b/client/src/components/Vacay/VacayMonthCard.tsx
index e37a9d769..78c6ddcaf 100644
--- a/client/src/components/Vacay/VacayMonthCard.tsx
+++ b/client/src/components/Vacay/VacayMonthCard.tsx
@@ -12,6 +12,7 @@ interface VacayMonthCardProps {
companyHolidaysEnabled?: boolean
entryMap: Record