Skip to content

fix: prevent details card width reduction on unlimited time-off policies only#1686

Merged
jeffredodd merged 2 commits intomainfrom
fix/details-card-min-width
May 6, 2026
Merged

fix: prevent details card width reduction on unlimited time-off policies only#1686
jeffredodd merged 2 commits intomainfrom
fix/details-card-min-width

Conversation

@jeffredodd
Copy link
Copy Markdown
Contributor

Summary

  • Unlimited time-off policies render only the Details card on the detail screen (no Settings card). Without a min-width, the card shrunk to fit its sparse content and rendered as a tiny box (screenshot 2 in plan).
  • Adds min-width: toRem(320) to .descriptionCard so the card holds shape regardless of content density. max-width: toRem(480) is preserved.

This is PR 4 in the time-off bug-fix slate captured in ~/.claude/plans/ok-i-want-to-partitioned-balloon.md.

Test plan

  • npm run test -- --run src/components/UNSTABLE_TimeOff/TimeOffPolicyDetail/ — 36/36 passing (no behavior change)
  • Storybook TimeOffPolicyDetailPresentation with accrualMethod: 'unlimited' — confirm Details card fills at least ~320px and renders cleanly
  • Storybook with limited policy (vacation/sick) — confirm cards are unchanged at their normal width

🤖 Generated with Claude Code

@jeffredodd jeffredodd changed the title fix: prevent details card collapse on unlimited time-off policies fix: prevent details card width reduction on unlimited time-off policies only May 6, 2026
@jeffredodd jeffredodd marked this pull request as ready for review May 6, 2026 01:52
@jeffredodd jeffredodd requested a review from dmortal as a code owner May 6, 2026 01:52
Copilot AI review requested due to automatic review settings May 6, 2026 01:52
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adjusts the TimeOff policy details view styling so the “Details” card doesn’t shrink to a tiny width when rendered with sparse content (notably for unlimited policies).

Changes:

  • Add min-width: toRem(320) to the TimeOffPolicyDetail .descriptionCard wrapper while keeping max-width: toRem(480).

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines 1 to 4
.descriptionCard {
min-width: toRem(320);
max-width: toRem(480);
}
@jeffredodd jeffredodd force-pushed the fix/details-card-min-width branch from 0436a8e to 3b682ec Compare May 6, 2026 02:35
jeffredodd added a commit that referenced this pull request May 6, 2026
Apply min-width: 320px only on the Details card when accrualMethod is
'unlimited', leaving limited-policy Details and Settings cards
unaffected. Addresses Copilot review feedback on PR #1686.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
jeffredodd and others added 2 commits May 6, 2026 08:58
Unlimited policies render only the Details card (no Settings card), so
with just `max-width` set the card shrinks to fit its sparse content
("Accrual type: Unlimited") and looks cramped. Add a min-width so the
card holds its shape regardless of content density.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Apply min-width: 320px only on the Details card when accrualMethod is
'unlimited', leaving limited-policy Details and Settings cards
unaffected. Addresses Copilot review feedback on PR #1686.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@jeffredodd jeffredodd enabled auto-merge (squash) May 6, 2026 15:58
@jeffredodd jeffredodd force-pushed the fix/details-card-min-width branch from 0bff508 to b8ace3c Compare May 6, 2026 15:58
@jeffredodd jeffredodd merged commit c1c1cb6 into main May 6, 2026
19 checks passed
@jeffredodd jeffredodd deleted the fix/details-card-min-width branch May 6, 2026 16:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants