The card component is a generic UI element we can use in many cases, but it is the most common in post (blog, news) listings.
In general, there isn’t much work with the card component because the requirements mostly depend on the context. Nonetheless, it would be best if you watched for the following:
- if you use an image, you must set a proper
- If you list them, using a list with
<li>is a good idea.
- If you have a publication date, use the
- default: the default view is a vertically stacked layout.
- --horizontal: using the
.post-card--horizontalmodifier, you can make the card horizontally stacked.
- It uses the
a11y-card-linkmixin to stretch the link above the whole card (this makes the links under it unuseable).
- There is an
aspect-ratiofor the thumbnail. For the
--horizontalvariation it is needed...