Skip to content

Conversation

@ldez
Copy link
Contributor

@ldez ldez commented Aug 30, 2025

The PR creates new shortcodes to create extended cards.
The extended cards are cards, but users can customize the placement of the title, the image, add buttons, etc.
It allows users to create any shortcode they want to extend the cards.

Each commit is a small step, so you can follow the changes.

Technically, with my approach, the shortcodes are just "interfaces" for partials: they are just here to link the user configuration to the partials.
This design is more flexible and closer to a component design.

The existing card shortcodes and partials are untouched and work as before.


The doc is missing because we need to agree together about the approach before writing it.

For now, I just created a draft page to showcase the new extended cards:

I used the prefix experimental/, but this must be changed.
I have some proposals for the prefix: extended/, custom/, advanced/, hx/.

Maybe the CSS is a bit messy, but the render is right (maybe some padding needs to be adjusted)
Note: I mainly copied existing CSS classes from partials into the CSS file.

Fixes #797

@netlify
Copy link

netlify bot commented Aug 30, 2025

Deploy Preview for hugo-hextra ready!

Name Link
🔨 Latest commit 224942c
🔍 Latest deploy log https://app.netlify.com/projects/hugo-hextra/deploys/68ec313c0be3260008b33e3c
😎 Deploy Preview https://deploy-preview-809--hugo-hextra.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@imfing
Copy link
Owner

imfing commented Aug 31, 2025

Hi, thanks for this. On first glance it looks good! I’ll take a closer look at the implementation details later, and organize the CSS part.

Technically, with my approach, the shortcodes are just "interfaces" for partials: they are just here to link the user configuration to the partials.

I agree, this is the ideal approach. In fact, we can refactor the previous card to be composed with these partials.

This design is more flexible and closer to a component design.

Exactly. This feels like a solid example. Nicely done!

@ldez ldez force-pushed the feat/extended-cards branch from 8790ec5 to 518cbc0 Compare August 31, 2025 10:22
@imfing imfing added this to the v0.12.0 milestone Sep 6, 2025
@ldez ldez force-pushed the feat/extended-cards branch 2 times, most recently from 2c08040 to 5501e07 Compare September 10, 2025 22:55
@ldez ldez force-pushed the feat/extended-cards branch from 5501e07 to 2832179 Compare September 15, 2025 23:59
Copy link
Owner

@imfing imfing left a comment

Choose a reason for hiding this comment

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

Thanks! Just a small suggestion to the button styling, the PR implementation looks good overall.

I can imagine some users might mix other shortcodes or Markdown into the new extended card component, so in the future it might be worth adding some note to the docs clarifying how different cases are handled.

@ldez
Copy link
Contributor Author

ldez commented Oct 12, 2025

As explained inside the PR description:

The doc is missing because we need to agree together about the approach before writing it.

Also, could you provide feedback about the prefix?

@imfing
Copy link
Owner

imfing commented Oct 13, 2025

As explained inside the PR description:

The doc is missing because we need to agree together about the approach before writing it.

Also, could you provide feedback about the prefix?

ah apologies missed that, I'm leaning towards extended, what do you think?🤔

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.

proposal: cards with buttons

2 participants