Variant 02

+ Date Block

Essentials with the date-block embed — a Sky (Primary Brand) tile carrying the date and the attendance-mode label. The date leaves the time slot; three density sizes; LM + DM.

Bucket: ListingsGroup: 5050Variant: + Date BlockModes: LM + DM

Details

Container · 6C (two-up, media-led group)

TierVariant

FamilyEvents

BucketCards

Group5050 (6C)

Variant+ Date Block (default · variable height)

SizesSmall · Medium · Large (density)

Canonical nameEvents / Cards / 5050 / + Date Block

IDevent-card-5050-date-block

Component Anatomy

#	Slot	Holds	Colour	Presence	Notes
1	Date Block	Date Attendance	Primary Brand Text 1 Icon	Required	The embed, left of the copy: a Sky (Primary Brand) tile carrying the date, with an Icon & Label beneath carrying the attendance mode. Label surface is Neutral 1; icon & text are Text 1. The date is a centralised day + month (e.g. 10 FEB), or month + year for a past or multi-year event. See Date Block.
2	Top Slot	Time	Text 1	Required	Time only — the date moves into the Date Block, so this slot drops it (e.g. `09:00 – 13:00 CET`). No leading icon; the attendance icon sits in the Date Block label.
3	Trailing Icon	—	Accent	Optional	Top-right affordance — the More menu (M / L) or a forward Arrow (S). See Icons.
4	Primary	Event Title	Text 1	Required	The primary line. Source `Event Title` or `Listing Title` per card.
5	Secondary	Event Subtitle	Text 1	Optional	Venue or subtitle.
6	Supporting	Location Taxonomy	Text 2	Optional	Place / category lines. Muted.
7	Listing Description	Listing Description	Text 1	Optional	Supporting copy; follows the supporting slots.
8	Button	Call to Action	Accent	Optional	CTA label (e.g. "FIND OUT MORE"). See Buttons.
9	Footnote	Footnote	Text 2	Optional	Foot-anchored fine print. Muted.
10	Card Background		White / Black		Card fill — White (LM) / Black (DM). Bottom layer.

Notes

+ Date Block is the date-presentation build of Essentials — full Essentials support, same data and slot rules. The only structural change is that the date and attendance move out of the Top Slot and into the Date Block.
The Sky tile is the Primary Brand token (constant across modes); the date numerals are Text 1 (dark LM / white DM); the label surface, icon and text are token-derived (Neutral 1 surface · Text 1 icon/text).
Visibility of the optional slots is a per-card setting, not a separate variant. Absent slots close up.

Spacing

Position	Applies to	Above	Below
Top	Top Slot, to the top edge	12 sm	8 xs
Between	Every other slot	8 xs	8 xs
Bottom	Terminal text slot: Title, Subtitle or Listing Description	8 xs	S 16 md · M / L 24 xl
Bottom	Button (CTA block)	20 lg	20 lg
Bottom	Footnote	20 lg	16 md

Notes

The copy column follows the Essentials spacing model. Spacing scale: xs 8 · sm 12 · md 16 · lg 20 · xl 24.
Interior gaps are constant across all three sizes; only the bottom edge under a terminal text slot steps with size, from md 16 at Small to xl 24 at Medium and Large.
The Date Block is a fixed-width embed in the left column; its height tracks the card (variable height).

Typography

The Date Block carries its own fixed type; the copy slots step with density. Click a slot to reveal the role and a live specimen.

Date Block · fixed

10Date numeral · Display / lg
Poppins 700 · 72 / 80

FEBDate month · Headline / sm
Poppins 600 · 20 / 28

FEB

LBLFormat label · Label / Section
Inter 600 · 12 / 16

IN PERSON

Top Slot · Time · Callout

SCallout / base
Inter 500 · 14 / 20

09:00 – 13:00 CET

M·LCallout / lg
Inter 500 · 15 / 22

09:00 – 13:00 CET

Primary · Title · Headline → 700 at Large

SHeadline / sm
Poppins 600 · 20 / 28

The Live Content Engine

MHeadline / base
Poppins 600 · 24 / 32

The Live Content Engine

LHeadline / md
Poppins 700 · 28 / 36

The Live Content Engine

Secondary · Subtitle · Subhead

SSubhead / sm
Inter 500 · 14 / 20

Hotel Amigo, Brussels

M·LSubhead / base
Inter 500 · 16 / 24

Hotel Amigo, Brussels

Supporting · Location / Taxonomy · Utility

S·M·LUtility / base
Inter 500 · 12 / 16

London · Online & in person

Listing Description · Body · optional

SBody / sm
Inter 400 · 13 / 20

Join Wavecast for a practical strategy session on building better content systems.

M·LBody / base
Inter 400 · 15 / 22

Join Wavecast for a practical strategy session on building better content systems.

Footnote · Meta · optional

S·M·LMeta / base
Inter 400 · 12 / 16

This event is delivered by Wavecast

Examples

No examples published. + Date Block follows the Essentials slot model and type ramp — see Essentials for the full data-state behaviour.

Events · Cards · 5050 · + Date Block
The date-presentation 5050 build — date + attendance move into the Date Block. Details, anatomy and type read from the live Sketch master (WDS Design System v3.0).