website/_components/header.tsx

25 lines
653 B
TypeScript

export interface Props {
title: string;
description?: string;
author?: {
name: string;
};
date: Date;
comp: any;
}
export default function(props: Props) {
const dateFormatted = Intl.DateTimeFormat("en-CA", { dateStyle: "long" }).format(props.date);
return (
<header className="page-header">
<h1>{ props.title }</h1>
{props.author &&
<p style={{ color: "var(--color-brown)" }}>
By {props.author.name} on <time dateTime={props.date.toISOString()}>{dateFormatted}</time>
</p>
}
{props.comp.separator()}
<p className="subheading">{ props.description }</p>
</header>
)
}