open-consul/website/components/cloud-offerings-list/index.jsx
Zachary Shilton 3d1f483a23
Upgrade global styles (#10692)
* website: upgrade global-styles packages

* website: move community page to CSS modules

* website: replace g-container with g-grid-container

* website: hide alert-banner on mobile

* website: backfill missing global type styles

* website: fix code font-size in download custom content

* website: bump to latest patched dependencies
2021-08-20 12:20:01 -04:00

29 lines
972 B
JavaScript

import Button from '@hashicorp/react-button'
export default function CloudOfferingsList({ offerings }) {
return (
<ul className="g-cloud-offerings-list">
{offerings.map((offering) => (
<li key={offering.title}>
<a
href={offering.link.url}
rel={offering.link.type === 'outbound' ? 'noopener' : undefined}
target={offering.link.type === 'outbound' ? '_blank' : undefined}
>
<img src={offering.image} alt={offering.title} />
<span className="g-type-label-strong">{offering.eyebrow}</span>
<h4 className="g-type-display-4">{offering.title}</h4>
<p>{offering.description}</p>
<Button
title={offering.link.text}
linkType={offering.link.type}
theme={{ variant: 'tertiary', brand: 'consul' }}
url={offering.link.url}
/>
</a>
</li>
))}
</ul>
)
}