foster/website
1
0
Fork 0
Code Issues 8 Pull requests Activity

Display date on header along with author

Browse source
This commit is contained in:
Foster Hangdaan 2023-08-05 17:47:37 -04:00
parent 65cf7c1b69
commit 5e5319ee3f
Signed by: foster
GPG key ID: E48D7F49A852F112
2 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
_components/header.tsx
View file

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

4
_includes/layouts/base.tsx
View file

@ -1,4 +1,4 @@
export default function({ title, description, children, comp, metas, links, author }) { export default function({ title, description, children, comp, metas, links, author, date }) {
return ( return (
<html lang="en-CA"> <html lang="en-CA">
<head> <head>
@ -25,7 +25,7 @@ export default function({ title, description, children, comp, metas, links, auth
</head> </head>
<body> <body>
{ comp.navbar() } { comp.navbar() }
{ comp.header({title, description, author}) } { comp.header({title, description, author, date}) }
<main>{children}</main> <main>{children}</main>
{ comp.footer() } { comp.footer() }
</body> </body>