Skip to content

Conversation

@devin-ai-integration
Copy link
Contributor

Add image props documentation for Card component

Summary

Added documentation for the Card component's image functionality, which was recently added to the platform. The documentation includes:

  • New "Adding images to cards" section with guidance on image usage
  • Two interactive examples showing cards with images (left and top positions)
  • Complete documentation of all 4 image-related props: src, imagePosition, imageWidth, and imageHeight
  • Guidance that imageWidth/imageHeight are optional since images auto-resize by default

Review & Testing Checklist for Human

  • Visual verification: View the docs page at /docs/writing-content/components/cards and verify the card image examples render correctly
  • Test image URLs: Confirm the Unsplash image URLs display appropriate images and load properly
  • Test all positions: Try creating cards with all 4 imagePosition values (top, left, right, bottom) to verify they work as documented - I only showed top and left in examples
  • Verify auto-resize behavior: Confirm that images auto-resize appropriately without explicit width/height, and that the optional override props work when specified

Notes

- Add section on adding images to cards with examples
- Document src, imagePosition, imageWidth, and imageHeight props
- Include examples showing left and top image positions
- Note that imageWidth/imageHeight are optional as images auto-resize

Co-Authored-By: Catherine Deskur <catherine@buildwithfern.com>
@devin-ai-integration
Copy link
Contributor Author

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment and CI monitoring

@github-actions
Copy link
Contributor

@github-actions
Copy link
Contributor

@chdeskur chdeskur merged commit f5e4197 into main Oct 24, 2025
2 checks passed
@chdeskur chdeskur deleted the devin/1761270736-add-card-image-documentation branch October 24, 2025 02:31
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