118 lines
2.2 KiB
Text
118 lines
2.2 KiB
Text
---
|
|
import BaseLayout from "@/layouts/BaseLayout.astro";
|
|
|
|
const { frontmatter } = Astro.props;
|
|
---
|
|
|
|
<BaseLayout title={frontmatter.title} description={frontmatter.description}>
|
|
<main class="main">
|
|
<a href="/" class="back">← Home</a>
|
|
<div class="content">
|
|
<slot />
|
|
<script>
|
|
document.querySelectorAll('[data-obf]').forEach(el => {
|
|
el.textContent = atob((el as HTMLElement).dataset.obf!);
|
|
});
|
|
document.querySelectorAll('[data-obf-href]').forEach(el => {
|
|
(el as HTMLAnchorElement).href = atob((el as HTMLElement).dataset.obfHref!);
|
|
});
|
|
</script>
|
|
</div>
|
|
</main>
|
|
</BaseLayout>
|
|
|
|
<style>
|
|
.main {
|
|
max-width: var(--width-prose);
|
|
margin: 0 auto;
|
|
padding: 2rem 2rem 4rem;
|
|
width: 100%;
|
|
}
|
|
|
|
.back {
|
|
display: inline-block;
|
|
margin-bottom: 1.5rem;
|
|
font-size: 0.9rem;
|
|
color: #555;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.back:hover {
|
|
color: var(--accent);
|
|
}
|
|
|
|
.content {
|
|
font-size: 1rem;
|
|
line-height: 1.75;
|
|
color: #333;
|
|
}
|
|
|
|
.content :global(h1) {
|
|
font-size: 1.75rem;
|
|
font-weight: 400;
|
|
letter-spacing: -0.02em;
|
|
margin-bottom: 2rem;
|
|
color: #111;
|
|
}
|
|
|
|
.content :global(h2) {
|
|
font-size: 1rem;
|
|
font-weight: 600;
|
|
letter-spacing: 0.06em;
|
|
text-transform: uppercase;
|
|
color: #888;
|
|
margin: 2rem 0 0.75rem;
|
|
padding-bottom: 0.4rem;
|
|
border-bottom: 2px solid #111;
|
|
}
|
|
|
|
.content :global(h3) {
|
|
font-size: 1rem;
|
|
font-weight: 600;
|
|
margin: 1.5rem 0 0.5rem;
|
|
color: #111;
|
|
}
|
|
|
|
.content :global(p) {
|
|
margin-bottom: 1.25rem;
|
|
}
|
|
|
|
.content :global(ul),
|
|
.content :global(ol) {
|
|
margin-bottom: 1.25rem;
|
|
padding-left: 1.5rem;
|
|
}
|
|
|
|
.content :global(li) {
|
|
margin-bottom: 0.4rem;
|
|
}
|
|
|
|
.content :global(strong) {
|
|
font-weight: 600;
|
|
color: #111;
|
|
}
|
|
|
|
.content :global(a) {
|
|
color: var(--accent);
|
|
text-underline-offset: 3px;
|
|
}
|
|
|
|
.content :global(code) {
|
|
font-family: monospace;
|
|
font-size: 0.9rem;
|
|
background: #eeeeed;
|
|
padding: 0.25rem 0.5rem;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.content :global(.r) {
|
|
direction: rtl;
|
|
unicode-bidi: bidi-override;
|
|
}
|
|
|
|
.content :global(hr) {
|
|
border: none;
|
|
border-top: 1px solid #ddd;
|
|
margin: 2rem 0;
|
|
}
|
|
</style>
|