church-website/src/components/BlogExcerpt/BlogExcerpt.tsx
2025-09-09 16:23:00 +02:00

43 lines
No EOL
1.1 KiB
TypeScript

import { Button } from '@/components/Button/Button'
import Link from 'next/link'
import styles from './styles.module.scss'
import Image, { StaticImageData } from 'next/image'
type BlogExcerptProps = {
id: string,
title: string,
excerpt: string
photo: StaticImageData | undefined
}
export const BlogExcerpt = ({id, title, excerpt, photo}: BlogExcerptProps) => {
const url = `/blog/${id}`;
return (
<div className={styles.container}>
<div>
{ photo &&
<Link href={url}>
<Image
src={photo.src}
width={photo.width}
height={photo.height}
alt={"Blogbild"}
className={styles.image}
unoptimized={true}
/>
</Link>
}
</div>
<div className={styles.content}>
<h3><Link href={url} className={styles.title}>{title}</Link></h3>
<p>{excerpt}</p>
<div className={styles.button}>
<Button size={"md"} href={url}>Weiter lesen</Button>
</div>
</div>
</div>
);
}