---

import MoreMenu from '../RightSidebar/MoreMenu.astro';

type Props = {

  githubEditUrl?: string;

};

const { githubEditUrl } = Astro.props as Props;

---

<article id="article" class="content">

  <section class="main-section">

    <!-- TODO: add dropdown toc on mobile -->

    <div class="prose dark:prose-invert max-w-full pb-8">

      <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;

  }

</style>