Content

ProjectCard

A project at a glance: the brand, the title and format, a production meter, and the publish date with its status.

Preview

Live, in this page’s themeOpen on its own

Props

Prop	Type	Description
`brand`Required	`string`
`brandTone`	`AvatarProps['tone']`
`title`Required	`React.ReactNode`
`format`	`React.ReactNode`
`formatIcon`	`IconName`
`phase`Required	`React.ReactNode`
`step`Required	`number`
`steps`	`number`
`late`	`boolean`
`due`Required	`React.ReactNode`
`amount`	`React.ReactNode`	The fee, e.g. "$3,500", at the right of the footer.
`stepLabel`	`string`	Overrides "Step 3 of 6", e.g. "3 of 8 steps".
`status`	`Status`
`href`	`string`
`className`	`string`

Guidelines

A project at a glance: the brand, the title and format, a production meter, and the publish date with its status.

Provide: brand, brandTone, title, format and formatIcon, phase (current step name), step and steps (default 6: brief, script, shoot, edit, review, publish), late, due, amount (the fee), stepLabel ("3 of 8 steps" when the meter counts finished production steps; step may be 0), status, and href.

The whole card links to the project. Put no other buttons on it.
When a step runs late, set late and say so in phase ("Edit, 2 days late").