polish: more breathing room inside month calendar day pills
All checks were successful
Build and Deploy / Build & Push (push) Successful in 1m4s
All checks were successful
Build and Deploy / Build & Push (push) Successful in 1m4s
Increased pill vertical padding (3px→5px) and internal line gaps (1-2px→2-3px) so the stacked hours/timezone text feels less cramped. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -167,7 +167,7 @@ export function ParkMonthCalendar({ parkId, year, month, monthData, today, timez
|
||||
borderLeft: isToday ? "2px solid var(--color-today-border)" : "none",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
gap: 8,
|
||||
gap: 6,
|
||||
}}>
|
||||
{/* Date number */}
|
||||
<span style={{
|
||||
@@ -203,16 +203,16 @@ export function ParkMonthCalendar({ parkId, year, month, monthData, today, timez
|
||||
background: "var(--color-ph-bg)",
|
||||
border: "1px solid var(--color-ph-border)",
|
||||
borderRadius: 5,
|
||||
padding: "3px 6px",
|
||||
padding: "5px 6px",
|
||||
textAlign: "center",
|
||||
}}>
|
||||
<div style={{ fontSize: "0.6rem", fontWeight: 700, color: "var(--color-ph-label)", textTransform: "uppercase", letterSpacing: "0.05em" }}>
|
||||
Passholder
|
||||
</div>
|
||||
<div style={{ fontSize: "0.65rem", color: "var(--color-ph-hours)", marginTop: 2 }}>
|
||||
<div style={{ fontSize: "0.65rem", color: "var(--color-ph-hours)", marginTop: 3 }}>
|
||||
{dayData.hoursLabel}
|
||||
</div>
|
||||
<div style={{ fontSize: "0.58rem", color: "var(--color-ph-label)", opacity: 0.75, marginTop: 1, letterSpacing: "0.04em" }}>
|
||||
<div style={{ fontSize: "0.58rem", color: "var(--color-ph-label)", opacity: 0.75, marginTop: 2, letterSpacing: "0.04em" }}>
|
||||
{tzAbbr}
|
||||
</div>
|
||||
</div>
|
||||
@@ -221,13 +221,13 @@ export function ParkMonthCalendar({ parkId, year, month, monthData, today, timez
|
||||
background: "var(--color-open-bg)",
|
||||
border: "1px solid var(--color-open-border)",
|
||||
borderRadius: 5,
|
||||
padding: "3px 6px",
|
||||
padding: "5px 6px",
|
||||
textAlign: "center",
|
||||
}}>
|
||||
<div style={{ fontSize: "0.65rem", color: "var(--color-open-hours)" }}>
|
||||
{dayData.hoursLabel}
|
||||
</div>
|
||||
<div style={{ fontSize: "0.58rem", color: "var(--color-open-hours)", opacity: 0.6, marginTop: 1, letterSpacing: "0.04em" }}>
|
||||
<div style={{ fontSize: "0.58rem", color: "var(--color-open-hours)", opacity: 0.6, marginTop: 3, letterSpacing: "0.04em" }}>
|
||||
{tzAbbr}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user