wunphile
Version:
Simple, imperative JavaScript-based static site generator
50 lines (42 loc) • 1.42 kB
JavaScript
import config from '../../config.mjs'
import { html, RenderFragment, BehaviorLoader } from '../../../index.mjs'
/** @typedef {import('../../index.mjs').Component} Component */
/**
* @typedef LayoutProps
* @property {string?} title The page title (optional, uses the main site title if omitted)
* @property {string[]?} stylesheets The URIs of stylesheets to include in the page (optional)
* @property {string[]?} scripts The URIs of scripts to include in the path (optional)
*/
/**
* The main page layout.
* @type {Component<LayoutProps, RenderFragment[]>}
*/
export const Layout = ({ title, stylesheets, scripts }, children) => {
return html`
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="/css/site.css" />
${(stylesheets ?? []).map(uri => html`
<link rel="stylesheet" href="${uri}" />
`)}
${title ? html`
<title>${title} - ${config.title}</title>
` : html`
<title>${config.title}</title>
`}
</head>
<body>
${children}
<i>Generated on ${new Date().toLocaleString()}</i>
${(scripts ?? []).map(uri => `
<script src="${uri}"></script>
`)}
${BehaviorLoader()}
</body>
</html>
`
}