diff options
Diffstat (limited to 'docs/src/pages/index.astro')
| -rw-r--r-- | docs/src/pages/index.astro | 254 |
1 files changed, 6 insertions, 248 deletions
diff --git a/docs/src/pages/index.astro b/docs/src/pages/index.astro index e5b06cc10..7b16ea1a0 100644 --- a/docs/src/pages/index.astro +++ b/docs/src/pages/index.astro @@ -1,251 +1,9 @@ --- -import SiteSidebar from '../components/SiteSidebar.astro'; -import AstroLogo from '../components/AstroLogo.astro'; -import ThemeToggle from '../components/ThemeToggle.tsx'; -import MenuToggle from '../components/MenuToggle.tsx'; +import Layout from '../layouts/Main.astro'; --- -<html lang="en-us"> - <head> - <meta name="viewport" content="width=device-width, initial-scale=1.0"> - <title>Astro Documentation</title> - <link rel="stylesheet" href="/theme.css" /> - <link rel="stylesheet" href="/code.css" /> - <link rel="stylesheet" href="/index.css" /> - <script src="/theme.js" /> - <link rel="icon" type="image/svg+xml" href="/favicon.svg"> - - <style> - body { - width: 100%; - display: grid; - grid-template-rows: 3.5rem 1fr; - --gutter: 0.5rem; - --doc-padding: 2rem; - } - - header { - position: sticky; - top: 0; - z-index: 10; - height: 56px; - width: 100%; - background-color: var(--theme-bg-offset); - display: flex; - align-items: center; - justify-content: center; - } - - .layout { - display: grid; - grid-auto-flow: column; - grid-template-columns: - minmax(var(--gutter), 1fr) - minmax(0, var(--max-width)) - minmax(var(--gutter), 1fr); - gap: 1em; - } - - .menu-and-logo { - gap: 1em; - } - - #site-title { - display: flex; - align-items: center; - gap: 0.25em; - font-size: 1.5rem; - font-weight: 700; - margin: 0; - line-height: 1; - color: var(--theme-text); - text-decoration: none; - } - - #site-title:hover, - #site-title:focus { - color: var(--theme-text-light); - } - - #site-title h1 { - font: inherit; - color: inherit; - margin: 0; - } - - .nav-wrapper { - display: flex; - align-items: center; - justify-content: space-between; - width: 100%; - max-width: 82em; - padding: 0 1rem; - } - - .layout :global(> *) { - width: 100%; - height: 100%; - } - - .sidebar { - min-height: calc(100vh - 3.5rem); - height: calc(100vh - 3.5rem); - max-height: 100vh; - position: sticky; - top: 3.5rem; - padding: 0; - } - - #sidebar-site { - position: fixed; - background-color: var(--theme-bg); - z-index: 1000; - } - - - #article { - padding: var(--doc-padding) var(--gutter); - grid-column: 2; - display: flex; - flex-direction: column; - height: 100%; - } - - -@font-face { - font-family: 'Roboto Mono'; - font-style: normal; - font-weight: 600; - font-display: swap; - src: url(data:font/woff;base64,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) format('woff'); -} - -.npm-init-snippet { - font-family: 'Roboto Mono', monospace; - font-size: 1.6rem; - background-color: var(--theme-code-inline-bg); - color: var(--theme-text); - border-radius: 6px; - padding: 4px 14px; - margin-top: 1rem; -} - - .content { - width: 100%; - height: 100%; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - } - - .content > main { - margin-bottom: 4rem; - } - - #sidebar-content { - display: none; - } - .theme-toggle-wrapper { - display: none; - } - - #sidebar-site { - display: none; - } - :global(.mobile-sidebar-toggle) { - overflow: hidden; - } - :global(.mobile-sidebar-toggle) #sidebar-site { - display: block; - } - @media (min-width: 60em) { - #sidebar-site { - display: flex; - } - :global(.mobile-sidebar-toggle) { - overflow: initial; - } - :global(.mobile-sidebar-toggle) #sidebar-site { - display: flex; - } - .menu-toggle { - display: none; - } - .layout { - grid-template-columns: - 20rem - minmax(0, 1fr); - } - #article { - grid-column: 2; - } - #sidebar-site { - position: sticky; - } - #sidebar-nav { - display: flex; - } - .theme-toggle-wrapper { - display: flex; - } - } - - @media (min-width: 82em) { - .layout { - grid-template-columns: - 20rem - minmax(0, var(--max-width)) - 18rem; - padding-left: 0; - padding-right: 0; - margin: 0 auto; - } - - #sidebar-nav { - grid-column: 1; - } - #article { - grid-column: 2/4; - } - } - - - </style> - </head> - - <body class="mobile-sidebar-hidden"> - <header> - <nav class="nav-wrapper"> - <div class="menu-and-logo flex"> - <div class="menu-toggle"> - <MenuToggle client:idle/> - </div> - <a id="site-title" href="/"> - <h1>Astro Documentation</h1> - </a> - </div> - - <div /> - - <div class="theme-toggle-wrapper"> - <ThemeToggle client:idle /> - </div> - </nav> - </header> - - <main class="layout"> - <aside class="sidebar" id="sidebar-site"> - <SiteSidebar currentPage="" /> - </aside> - <div id="article"> - <article class="content"> - <AstroLogo size={160} /> - <div class="npm-init-snippet"> - npm init astro - </div> - </article> - </div> - </main> - </body> -</html> +<Layout centered> + <h1> + <code style="white-space: nowrap;">npm init astro</code> + </h1> +</Layout> |