datahub/site/components/Gallery.tsx

67 lines
1.9 KiB
TypeScript

import Container from './Container';
import GalleryItem from './GalleryItem';
const items = [
{
title: 'Open Data Northern Ireland',
href: 'https://www.opendatani.gov.uk/',
image: '/images/showcases/odni.png',
description: 'Government Open Data Portal',
},
{
title: 'Birmingham City Observatory',
href: 'https://www.cityobservatory.birmingham.gov.uk/',
image: '/images/showcases/birmingham.png',
description: 'Government Open Data Portal',
},
{
title: 'UAE Open Data',
href: 'https://opendata.fcsc.gov.ae/',
image: '/images/showcases/uae.png',
description: 'Government Open Data Portal',
},
{
title: 'Brazil Open Data',
href: 'https://dados.gov.br/',
image: '/images/showcases/brazil.png',
description: 'Government Open Data Portal',
},
{
title: 'Datahub Open Data',
href: 'https://opendata.datahub.io/',
image: '/images/showcases/datahub.png',
description: 'Demo Data Portal by DataHub',
},
{
title: 'Example: Simple Data Catalog',
href: 'https://example.portaljs.org/',
image: '/images/showcases/example-simple-catalog.png',
description: 'Simple data catalog',
},
{
title: 'Example: Portal with CKAN',
href: 'https://ckan-example.portaljs.org/',
image: '/images/showcases/example-ckan.png',
description: 'Simple portal with data coming from CKAN',
},
];
export default function Gallery() {
return (
<Container>
<h2
className="text-3xl font-bold text-primary dark:text-primary-dark"
id="gallery"
>
Gallery
</h2>
<p className="text-lg mt-8">Discover what's being powered by Portal.JS</p>
<div className="not-prose my-12 grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3">
{items.map((item) => {
return <GalleryItem item={item} />;
})}
</div>
</Container>
);
}