Highlighted Card
Props
| Name | Type | Default | Description |
|---|
maxWidth | string | - | Set card max-width |
actions | object[] | - | Set information card links |
Usage
<InformationalCard
maxWidth='21.333rem'
actions={[
{
label: 'View Wightlink 2020 customer consultation press release',
component: ({ children }) => <Link href='/tickets' passHref>{children}</Link>
}
]}
>
<Heading fontSize='delta'>Wightlink launches its 2020 customer consultation programme</Heading>
<InlineIcon
icon='faCalendar'
>
<Text>February, 20th 2020</Text>
</InlineIcon>
<Text>Wightlink’s managers will be out and about meeting customers and listening to their views again in 2020.</Text>
</InformationalCard>
<InformationalCard
maxWidth='32.944rem'
actions={[
{
href: 'https://sidigital.co',
icon: 'faThumbsUp',
label: 'Category'
},
{
label: 'Link',
component: ({ children }) => <Link href='/tickets' passHref>{children}</Link>,
icon: 'faThumbsDown'
}
]}
>
<InlineIcon
icon='faSmoking'
iconSize='delta'
>
<Heading fontSize='delta'>Smoking on our ferries</Heading>
</InlineIcon>
<Text>Smoking, including e-cigarettes, is not allowed anywhere on our ferries or while in your vehicle waiting to depart the ship. At our ports, smoking is only allowed in our dedicated smoking areas.</Text>
</InformationalCard>