60 lines
1.3 KiB
Plaintext
60 lines
1.3 KiB
Plaintext
---
|
|
// import { renderContent } from "astro-i18n";
|
|
import MetaDate from "./MetaDate.astro";
|
|
import TOC from "./TOC.astro";
|
|
|
|
const { content } = Astro.props;
|
|
const { Content, headings } = await content.render();
|
|
// const { html, headings } = await renderContent(Astro, content);
|
|
|
|
const toc = headings.map((heading) => {
|
|
return heading;
|
|
});
|
|
|
|
import "../styles/vendor/one-dark-pro.css";
|
|
---
|
|
|
|
<div class="sidebar region">
|
|
<TOC toc={toc} />
|
|
<article class="flow editorial">
|
|
<h1>{content.data.title}</h1>
|
|
<p class="h3">{content.data.subtitle}</p>
|
|
<MetaDate item={content.data} />
|
|
<!-- <div class="flow content" set:html={html}> -->
|
|
<Content />
|
|
</article>
|
|
</div>
|
|
|
|
<style define:vars={{ permalink: content.data.permalink }}>
|
|
@media (prefers-reduced-motion: no-preference) {
|
|
article {
|
|
view-transition-name: var(--permalink);
|
|
}
|
|
}
|
|
.sidebar {
|
|
--gutter: var(--space-xs-m);
|
|
}
|
|
.sidebar > :global(:first-child) {
|
|
--sidebar-target-width: 16rem;
|
|
}
|
|
.sidebar > :global(:last-child) {
|
|
--sidebar-content-min-width: 60%;
|
|
}
|
|
h1 {
|
|
font-size: var(--size-4);
|
|
}
|
|
.editorial :global(h2),
|
|
.editorial :global(.h2) {
|
|
font-size: var(--size-3);
|
|
color: var(--color-blue);
|
|
}
|
|
|
|
.editorial :global(img),
|
|
.editorial :global(picture) {
|
|
margin: var(--space-s-m) 0;
|
|
}
|
|
.content :global(p + p) {
|
|
margin-block-start: var(--space-s);
|
|
}
|
|
</style>
|