open-nomad/website/components/homepage-hero/index.jsx
2020-02-22 15:41:06 -08:00

34 lines
1 KiB
JavaScript

import Button from '@hashicorp/react-button'
export default function HomepageHero({ title, description, links }) {
return (
<div className="g-homepage-hero">
<div className="g-grid-container">
<h1 data-testid="heading" className="g-type-display-1">
{title}
</h1>
<div className="content-and-links">
<p data-testid="content" className="g-type-body-large">
{description}
</p>
<div data-testid="links" className="links">
{links.map((link, index) => {
const brand = index === 0 ? 'nomad' : 'neutral'
const variant = index === 0 ? 'primary' : 'secondary'
return (
<Button
key={link.text}
title={link.text}
linkType={link.type}
url={link.url}
theme={{ variant, brand }}
/>
)
})}
</div>
</div>
</div>
</div>
)
}