pub.solar/_includes/DefaultLayout.tsx

67 lines
1.9 KiB
TypeScript

import {
title as titleFilter,
en,
de,
md,
} from '../../filters.ts';
import Background from '../../components/Background.tsx';
export default ({ title, theme, extraStylesheets, content, cssCacheBust }) => <>
<html>
<head>
<meta charset="utf-8" />
<title>{ titleFilter(title) }</title>
<link rel="shortcut icon" href="/assets/pubsolar.svg" />
<meta name="theme-color" content="{{ theme.color }}" id="theme-color" />
<meta name="description" content="pub.solar wants you to have control of your data and privacy. We host Matrix, Nextcloud, and Mastodon for you to use." />
<meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" type="text/css" href="/style.css?1" media="all" />
<>
{(extraStylesheets || [])
.map(extraStylesheet => <link rel="stylesheet" type="text/css" href="{{ extraStylesheet }}{{ cssCacheBust }}" media="all" />)}
</>
</head>
<body className="ps-main">
<Background />
<main className="ps-main--page ps-page">
<section
lang="en"
id="en"
className="ps-page--section"
>
<a
className="ps-page--section-link"
href="#de"
>Deutsche übersetzung unten</a>
<div
dangerouslySetInnerHTML={{ __html: md(content.en) }}
className="ps-page--section-contents"
></div>
</section>
<section
lang="de"
id="de"
className="ps-page--section"
>
<a
className="ps-page--section-link"
href="#en"
>English translation above</a>
<div
dangerouslySetInnerHTML={{ __html: md(content.de) }}
className="ps-page--section-contents"
></div>
</section>
</main>
</body>
</html>
</>;