Sitelet https://github.com/canonical/vanilla-framework/pull/5819
Skip to content

Update Content Card to accept stacked_image param and for content_type to accept lists - #5819

Merged
petesfrench merged 5 commits into
mainfrom
WD-37306
Jun 24, 2026
Merged

petesfrench merged 5 commits into
mainfrom
WD-37306

Conversation

@petesfrench

@petesfrench petesfrench commented Jun 23, 2026 •

Copy link
Copy Markdown
Contributor

Done

Updates the Content card pattern to full the needs outlined in this Figma design.

Content card

  • Added stacked_image parameter to force image to be above content on individual cards
  • The content_type footer field now accepts a list of strings, rendering each item as a separate read-only chip

Fixes https://warthogs.atlassian.net/browse/WD-37306

QA

Check if PR is ready for release

If this PR contains Vanilla SCSS or macro code changes, it should contain the following changes to make sure it's ready for the release:

  • PR should have one of the following labels to automatically categorise it in release notes:
    • Feature 🎁, Breaking Change 💣, Bug 🐛, Documentation 📝, Maintenance 🔨.
  • Vanilla version in package.json should be updated relative to the most recent release, following semver convention
    • if existing APIs (CSS classes & macro APIs) are not changed it can be a bugfix release (x.x.X)
    • if existing APIs (CSS classes & macro APIs) are changed/added/removed it should be a minor version (x.X.0)
    • see the wiki for more details
  • Any changes to component class names (new patterns, variants, removed or added features) or macros should be listed on the what's new page.

Screenshots

[if relevant, include a screenshot or screen capture]

@webteam-app

Copy link
Copy Markdown

@petesfrench petesfrench added the Feature 🎁 New feature or request label Jun 23, 2026

@muhammad-ali-pk muhammad-ali-pk left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Looks good! A few comments

Comment thread templates/docs/patterns/content-card/index.md
Comment thread scss/_patterns_content-card.scss Outdated
@muhammad-ali-pk

Copy link
Copy Markdown
Contributor

@petesfrench
Thanks for addressing comments.

Can you please add a combined.html file within templates/docs/examples/patterns/content-card/ folder and add this example in that file?

Thanks for adding the combined stacked image example. Sorry if my previous comment was ambiguous, but I meant adding a page with all examples combined. For example: https://github.com/canonical/vanilla-framework/blob/main/templates/docs/examples/patterns/tiered-list/combined.html

@muhammad-ali-pk muhammad-ali-pk left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

LGTM! Thank you

@petesfrench
petesfrench merged commit 2541d09 into main Jun 24, 2026
16 of 17 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants