fix: restrict today highlight to date header only

Remove today background/border from data row cells so the yellow
highlight only appears on the day label, not the entire column.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-04-04 20:18:19 -04:00
parent a87f97ef53
commit 43feb4cef0

View File

@@ -30,11 +30,9 @@ function parseDate(iso: string) {
function DayCell({
dayData,
isToday,
isWeekend,
}: {
dayData: DayData | undefined;
isToday: boolean;
isWeekend: boolean;
}) {
const base: React.CSSProperties = {
@@ -44,14 +42,7 @@ function DayCell({
borderBottom: "1px solid var(--color-border)",
borderLeft: "1px solid var(--color-border)",
height: 56,
background: isToday
? "var(--color-today-bg)"
: isWeekend
? "var(--color-weekend-header)"
: "transparent",
borderLeftColor: isToday ? "var(--color-today-border)" : undefined,
borderRightColor: isToday ? "var(--color-today-border)" : undefined,
borderRight: isToday ? "1px solid var(--color-today-border)" : undefined,
background: isWeekend ? "var(--color-weekend-header)" : "transparent",
transition: "background 120ms ease",
};
@@ -172,14 +163,12 @@ function ParkRow({
weekDates,
parsedDates,
parkData,
today,
}: {
park: Park;
parkIdx: number;
weekDates: string[];
parsedDates: ReturnType<typeof parseDate>[];
parkData: Record<string, DayData>;
today: string;
}) {
const rowBg = parkIdx % 2 === 0 ? "var(--color-bg)" : "var(--color-surface)";
return (
@@ -214,7 +203,6 @@ function ParkRow({
<DayCell
key={date}
dayData={parkData[date]}
isToday={date === today}
isWeekend={parsedDates[i].isWeekend}
/>
))}
@@ -336,7 +324,6 @@ export function WeekCalendar({ parks, weekDates, data, grouped }: WeekCalendarPr
weekDates={weekDates}
parsedDates={parsedDates}
parkData={data[park.id] ?? {}}
today={today}
/>
))}
</Fragment>