38 lines
1.1 KiB
TypeScript
38 lines
1.1 KiB
TypeScript
import styles from "./newsItem.module.scss";
|
|
import { Image } from "@/components/general/Image";
|
|
import { NewsFragment } from "@/lib/news";
|
|
import { formatDate } from "@/lib/date";
|
|
import Link from "next/link";
|
|
|
|
export const NewsItem = ({ news }: { news: NewsFragment }) => {
|
|
const featuredImage: any = news.featuredImage;
|
|
|
|
return (
|
|
<li className={`${styles.newsItem} linkItem`}>
|
|
<div className={styles.image}>
|
|
{featuredImage && (
|
|
<Image
|
|
src={featuredImage.url}
|
|
alt={featuredImage.alt}
|
|
width={featuredImage.width}
|
|
height={featuredImage.height}
|
|
sizes="(max-width: 600px) 25vw, 55vw"
|
|
/>
|
|
)}
|
|
</div>
|
|
<div className={styles.text}>
|
|
{news.firstPublishedAt && (
|
|
<p className={styles.date}>
|
|
{formatDate(news.firstPublishedAt, "d. MMMM yyyy")}
|
|
</p>
|
|
)}
|
|
<h2 className={styles.title}>{news.title}</h2>
|
|
<p className={styles.lead}>{news.excerpt}</p>
|
|
</div>
|
|
<Link href={`/aktuelt/${news.slug}`} className="hiddenLink">
|
|
Les artikkelen: {news.title}
|
|
</Link>
|
|
</li>
|
|
);
|
|
};
|