Apply row coloring consistently across the web and PDF views

Adjust cell styling to ensure row background colors are applied uniformly to both individual and merged rows, matching the PDF rendering behavior in the web interface.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 77cfe984-2c65-4152-bb7a-0df28274fe66
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 07cf3bc9-c682-4f05-aa30-52606bcce583
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/c3c252e4-c83d-40ca-9fff-99a3ea60701e/77cfe984-2c65-4152-bb7a-0df28274fe66/nFy3UZm
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
riyadhafraa
2026-05-04 11:05:57 +00:00
parent 204f2ec5b0
commit 086a037bf4
2 changed files with 9 additions and 7 deletions
Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 24 KiB

@@ -3621,8 +3621,10 @@ function MeetingRow({
isCurrent && !(highlight || isCancelled)
? hexToRgba(highlightColor, 0.13)
: null;
const tintedCellStyle = (col: ColumnSetting): CSSProperties =>
tintBg ? { ...cellStyle(col), backgroundColor: tintBg } : cellStyle(col);
const tintedCellStyle = (col: ColumnSetting, applyRowBg = false): CSSProperties => {
const bg = tintBg || (applyRowBg && rowBg) || undefined;
return bg ? { ...cellStyle(col), backgroundColor: bg } : cellStyle(col);
};
// Per-row bulk-select checkbox, lifted out of `renderCell` so the
// merged-cell branch can re-use the same JSX. Anchored to the
@@ -3752,7 +3754,7 @@ function MeetingRow({
<td
key="meeting"
className="border border-gray-300 px-3 py-3 align-middle text-[#0B1E3F] relative group"
style={tintedCellStyle(col)}
style={tintedCellStyle(col, true)}
>
<EditableCell
value={title}
@@ -3779,7 +3781,7 @@ function MeetingRow({
<td
key="attendees"
className="border border-gray-300 px-3 py-3 align-middle relative group"
style={tintedCellStyle(col)}
style={tintedCellStyle(col, isMerged)}
>
<AttendeesCell
meeting={meeting}
@@ -3800,7 +3802,7 @@ function MeetingRow({
<td
key="time"
className="border border-gray-300 px-3 py-3 align-middle text-center relative group"
style={tintedCellStyle(col)}
style={tintedCellStyle(col, isMerged)}
>
<TimeRangeCell
meeting={meeting}
@@ -3844,7 +3846,7 @@ function MeetingRow({
style={{
width: totalWidth,
overflow: "hidden",
...(tintBg ? { backgroundColor: tintBg } : null),
...(tintBg ? { backgroundColor: tintBg } : rowBg ? { backgroundColor: rowBg } : null),
}}
data-testid={`em-merge-cell-${meeting.id}`}
>
@@ -3891,7 +3893,7 @@ function MeetingRow({
// Combine row background with highlight tint. When the row is the current
// meeting we apply a soft tint (color at low opacity) plus a coloured ring
// via box-shadow (rings on <tr> don't render across cells; box-shadow does).
const baseBg = rowBg || "white";
const baseBg = (isMerged && rowBg) || "white";
// The "selected for bulk delete" ring stacks ON TOP of the existing
// current-meeting ring when both apply. Inset shadows compose from
// left to right (top of stack first), so we list the selection ring