2020-09-23 20:37:34 -04:00

43 lines
1.3 KiB
JavaScript

import { html, css, sanitize } from '../templater.js'
import { Header } from '../components/Header.js'
import { Footer } from '../components/Footer.js'
import base from '../styles/base.js'
const head = ({ title }) => html`
<title>About Page - ${sanitize(title)}</title>
`
const body = async (ctx, { path, title }) => html`
${await ctx.renderBody(Header, { path, title })}
<main id="app">
<section>
<h1>About Page - ${sanitize(title)}</h1>
<p>
Veniam quis commodo ad Lorem do proident et elit labore amet incididunt et culpa. Non ex in deserunt veniam minim pariatur incididunt consectetur. Aliqua occaecat irure eu est.
</p>
<ul>
<li>Anim reprehenderit enim amet eu id esse duis exercitation nulla fugiat sunt esse exercitation.</li>
<li>In non ex esse et fugiat excepteur aliquip ea.</li>
<li>Reprehenderit aliqua aute cupidatat enim ipsum eu.</li>
<li>Consectetur exercitation exercitation excepteur quis in qui qui magna cillum sint.</li>
</ul>
</section>
</main>
${await ctx.renderBody(Footer, { path, title })}
`
const styles = css`
main {
background-color: #fff;
}
`
export async function AboutPage (ctx, { path, title }) {
ctx.addCSS(base)
ctx.addCSS(styles)
ctx.addHead(head({ title }))
ctx.setBody(await body(ctx, { path, title }))
return ctx
}