examples/portfolio/src/components/PortfolioPreview/index.jsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

import { h } from 'preact';
import Styles from './styles.module.scss';

function PortfolioPreview({ project }) {
	return (
		<div className={Styles.card}>
			<div className={Styles.titleCard} style={`background-image:url(${project.img})`}>
				<h1 className={Styles.title}>{project.title}</h1>
			</div>
			<div className="pa3">
				<p className={`${Styles.desc} mt0 mb2`}>{project.description}</p>
				<div className={Styles.tags}>
					Tagged:
					{project.tags.map((t) => (
						<div className={Styles.tag} data-tag={t}>
							{t}
						</div>
					))}
				</div>
				<a className={Styles.link} href={project.url}>
					<span className={Styles.linkInner}>View</span>
				</a>
			</div>
		</div>
	);
}

export default PortfolioPreview;