basic astro docs

website/src/components/PageContent/PageContent.astro

@@ -0,0 +1,54 @@
+---
+import type { Frontmatter } from '../../config';
+import MoreMenu from '../RightSidebar/MoreMenu.astro';
+import TableOfContents from '../RightSidebar/TableOfContents';
+import type { MarkdownHeading } from 'astro';
+
+type Props = {
+  frontmatter: Frontmatter;
+  headings: MarkdownHeading[];
+  githubEditUrl: string;
+};
+
+const { frontmatter, headings, githubEditUrl } = Astro.props as Props;
+const title = frontmatter.title;
+---
+
+<article id="article" class="content">
+  <section class="main-section">
+    <nav class="block sm:hidden">
+      <TableOfContents client:media="(max-width: 50em)" headings={headings} />
+    </nav>
+    <div class="prose prose-invert max-w-full">
+      <slot />
+    </div>
+  </section>
+  <nav class="block sm:hidden">
+    <MoreMenu editHref={githubEditUrl} />
+  </nav>
+</article>
+
+<style>
+  .content {
+    padding: 0;
+    max-width: 75ch;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .content > section {
+    margin-bottom: 4rem;
+  }
+
+  .block {
+    display: block;
+  }
+
+  @media (min-width: 50em) {
+    .sm\:hidden {
+      display: none;
+    }
+  }
+</style>