Feature Card 
Adds a full size featured card to your page, you may add children components for content, accepts a featured image or youtube video id. By default the featured image is on the left and card content on the right. This card can also be flipped with the reverse prop.
Installation
yarn add @berlitz/feature-card
Props
| Argument | Type | Required | Default | Example |
|---|---|---|---|---|
| children | node | ✅ | ||
| column | bool | Display image on top of content. | false | |
| image | string | |||
| imageAltText | string | |||
| imageMobile | string | |||
| imageLink | string | https://www.berlitz.com | ||
| imageTarget | string | _blank | _self | ||
| imageOnly | bool | false | ||
| reverse | bool | false | ||
| youtubeVideoId | string |
Usage
import FeatureCard from '@berlitz/feature-card'
const MyApp = () => (
<App>
<FeatureCard
image="https://picsum.photos/900/500"
imageMobile="https://picsum.photos/600/400"
>
<H3>The Power of Understanding</H3>
<StyledP size="md">{content}</StyledP>
<Button fullWidth={['xs']}>Explore our languages</Button>
</FeatureCard>
</App>
)
When to use this component
Landing Pages, Home Page, anywhere you want to display a large feature card for infomation with a beautiful featured image/video