fix(card): card was not responsive

[MGREMY]

PR Checklist

Please check if your PR fulfills the following requirements:

• Docs have been added/updated (for bug fixes/features)

PR Type

What kind of change does this PR introduce?

• Bugfix
• Feature
• Code style update (formatting, local variables)
• Refactoring (no functional changes, no API changes)
• Build related changes
• CI-related changes
• Documentation content changes
• Other... Please describe:

Issue Number

Issue Number: #143

Does this PR introduce a breaking change?

• Yes
• No

Other information

Summary by CodeRabbit

• Style
  • Updated card sizing to use max-width constraints instead of fixed width utilities, improving responsive behavior.
  • Adjusted horizontal card image layout to use left-rounded corners and max-width styling for better visual balance and consistency.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
flowbite-angular	Ready	Preview	Comment	Dec 3, 2025 8:24pm
flowbite-angular-storybook	Ready	Preview	Comment	Dec 3, 2025 8:24pm

[coderabbitai]

Caution

Review failed

The pull request is closed.

Walkthrough

Card theme size utilities were changed from fixed width classes to max-width classes, and the Storybook card example image styling was switched from top-rounded/horizontal sizing to left-rounded/max-width constraints for a vertical layout.

Changes

Cohort / File(s)	Summary
Storybook card story example apps/storybook/src/card.component.stories.ts	Changed CardOrientationStory image element classes from a top-rounded, fixed-height horizontal layout (rounded-t-lg h-96) to a left-rounded image with max-width constraints (rounded-l-lg max-w-24 md:max-w-48) for vertical orientation.
Card component themes libs/flowbite-angular/card/src/card-content/theme.ts, libs/flowbite-angular/card/src/card/theme.ts	Replaced width utility class strings (w-xs, w-sm, w-md, w-lg, w-xl) with corresponding max-width utilities (max-w-xs, max-w-sm, max-w-md, max-w-lg, max-w-xl) in size mappings. No signature or type changes.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

• Check theme mappings for consistency and rendering across responsive breakpoints.
• Verify Storybook visual reflects intended vertical/left-image layout and that class names match the CSS framework version.

Possibly related PRs

• fix(card): card was not responsive #144 — Applies the same edits: Storybook image class change and replacement of w-* with max-w-* in card theme mappings.

Poem

🐰 I swapped the widths for room to grow,
Left-rounded photos in tidy row,
Max-width whispers, layouts sing,
Cards stand taller, light on spring,
A happy hop for CSS flow 🎨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Title check	✅ Passed	The title clearly describes the main change: fixing card responsiveness by switching from fixed width to max-width utility classes.
Description check	✅ Passed	The PR description includes all required sections (checklist, PR type, issue number, breaking changes) with appropriate selections and linked issue #143.

---

📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7ec0624 and c5d121d.

📒 Files selected for processing (3)

• apps/storybook/src/card.component.stories.ts (1 hunks)
• libs/flowbite-angular/card/src/card-content/theme.ts (1 hunks)
• libs/flowbite-angular/card/src/card/theme.ts (1 hunks)

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}