josh/SixFlagsSuperCalendar
1
0
Fork 0
Code Issues 6 Pull Requests Actions Packages Projects Releases Wiki Activity

polish: clamp park column width, prevent park name line wrap
All checks were successful
Build and Deploy / Build & Push (push) Successful in 59s
Details

Browse Source 
Column uses clamp(220px, 22%, 280px) — scales on small screens, caps at
280px on large ones. Park name gets whiteSpace:nowrap so it stays one line.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Josh Wright
2026-04-05 14:45:28 -04:00
parent 56c7b90262
commit b26382f427
1 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/WeekCalendar.tsx
View File

@@ -229,7 +229,7 @@ function ParkRow({
}}> }}>
<div style={{ minWidth: 0, flex: 1 }}> <div style={{ minWidth: 0, flex: 1 }}>
<div style={{ display: "flex", alignItems: "center", gap: 6 }}> <div style={{ display: "flex", alignItems: "center", gap: 6 }}>
<span style={{ fontWeight: 500, fontSize: "0.85rem", lineHeight: 1.2, color: "var(--color-text)" }}> <span style={{ fontWeight: 500, fontSize: "0.85rem", lineHeight: 1.2, color: "var(--color-text)", whiteSpace: "nowrap" }}>
{park.name} {park.name}
</span> </span>
{rideCounts?.[park.id] !== undefined && ( {rideCounts?.[park.id] !== undefined && (
@@ -294,7 +294,7 @@ export function WeekCalendar({ parks, weekDates, data, grouped, rideCounts, coas
tableLayout: "fixed", tableLayout: "fixed",
}}> }}>
<colgroup> <colgroup>
<col style={{ width: "25%" }} /> <col style={{ width: "clamp(220px, 22%, 280px)" }} />
{weekDates.map((d) => ( {weekDates.map((d) => (
<col key={d} style={{ width: 130 }} /> <col key={d} style={{ width: 130 }} />
))} ))}