diff options
Diffstat (limited to 'examples/docs/src/layouts/MainLayout.astro')
-rw-r--r-- | examples/docs/src/layouts/MainLayout.astro | 139 |
1 files changed, 0 insertions, 139 deletions
diff --git a/examples/docs/src/layouts/MainLayout.astro b/examples/docs/src/layouts/MainLayout.astro deleted file mode 100644 index 329ea7efb..000000000 --- a/examples/docs/src/layouts/MainLayout.astro +++ /dev/null @@ -1,139 +0,0 @@ ---- -import type { MarkdownHeading } from 'astro'; -import type { CollectionEntry } from 'astro:content'; -import HeadCommon from '../components/HeadCommon.astro'; -import HeadSEO from '../components/HeadSEO.astro'; -import Header from '../components/Header/Header.astro'; -import PageContent from '../components/PageContent/PageContent.astro'; -import LeftSidebar from '../components/LeftSidebar/LeftSidebar.astro'; -import RightSidebar from '../components/RightSidebar/RightSidebar.astro'; -import Footer from '../components/Footer/Footer.astro'; -import { GITHUB_EDIT_URL, SITE } from '../consts'; - -type Props = CollectionEntry<'docs'>['data'] & { - headings: MarkdownHeading[]; -}; - -const { headings, ...data } = Astro.props; -const canonicalURL = new URL(Astro.url.pathname, Astro.site); -const currentPage = Astro.url.pathname; -const currentFile = `src/content/docs${currentPage.replace(/\/$/, '')}.md`; -const githubEditUrl = `${GITHUB_EDIT_URL}/${currentFile}`; ---- - -<html dir={data.dir} lang={data.lang} class="initial"> - <head> - <HeadCommon /> - <HeadSEO {...data} canonicalUrl={canonicalURL} /> - <title> - {`${data.title} 🚀 ${SITE.title}`} - </title> - <style> - body { - width: 100%; - display: grid; - grid-template-rows: var(--theme-navbar-height) 1fr; - --gutter: 0.5rem; - --doc-padding: 2rem; - } - - .layout { - display: grid; - grid-auto-flow: column; - grid-template-columns: minmax(var(--gutter), 1fr) minmax(0, var(--max-width)) minmax( - var(--gutter), - 1fr - ); - overflow-x: hidden; - } - - .grid-sidebar { - height: 100vh; - position: sticky; - top: 0; - padding: 0; - } - - #grid-left { - position: fixed; - background-color: var(--theme-bg); - z-index: 10; - display: none; - } - - #grid-main { - padding: var(--doc-padding) var(--gutter); - grid-column: 2; - display: flex; - flex-direction: column; - height: 100%; - } - - #grid-right { - display: none; - } - - @media (min-width: 50em) { - .layout { - overflow: initial; - grid-template-columns: 20rem minmax(0, var(--max-width)); - gap: 1em; - } - - #grid-left { - display: flex; - padding-left: 2rem; - position: sticky; - grid-column: 1; - } - } - - @media (min-width: 72em) { - .layout { - grid-template-columns: 20rem minmax(0, var(--max-width)) 18rem; - padding-left: 0; - padding-right: 0; - margin: 0 auto; - } - - #grid-right { - grid-column: 3; - display: flex; - } - } - </style> - <style is:global> - .layout > * { - width: 100%; - height: 100%; - } - - .mobile-sidebar-toggle { - overflow: hidden; - } - - .mobile-sidebar-toggle #grid-left { - display: block; - top: 2rem; - } - </style> - </head> - - <body> - <Header currentPage={currentPage} /> - <main class="layout"> - <aside id="grid-left" class="grid-sidebar" title="Site Navigation"> - <LeftSidebar currentPage={currentPage} /> - </aside> - <div id="grid-main"> - <PageContent title={data.title} headings={headings} githubEditUrl={githubEditUrl}> - <slot /> - </PageContent> - </div> - <aside id="grid-right" class="grid-sidebar" title="Table of Contents"> - <RightSidebar headings={headings} githubEditUrl={githubEditUrl} /> - </aside> - </main> - <Footer path={currentFile} /> - </body> -</html> |