diff options
Diffstat (limited to 'docs/src/pages')
-rw-r--r-- | docs/src/pages/404.astro | 243 | ||||
-rw-r--r-- | docs/src/pages/getting-started.md | 60 | ||||
-rw-r--r-- | docs/src/pages/guides/deploy.md | 6 | ||||
-rw-r--r-- | docs/src/pages/index.astro | 254 | ||||
-rw-r--r-- | docs/src/pages/integrations/data-sources-cms.md | 4 | ||||
-rw-r--r-- | docs/src/pages/integrations/deploy-astro.md | 4 | ||||
-rw-r--r-- | docs/src/pages/integrations/developer-tools.md | 4 | ||||
-rw-r--r-- | docs/src/pages/integrations/state-management.md | 4 | ||||
-rw-r--r-- | docs/src/pages/integrations/styles-and-css-libraries.md | 4 |
9 files changed, 507 insertions, 76 deletions
diff --git a/docs/src/pages/404.astro b/docs/src/pages/404.astro index b1770ee31..bfe117e9a 100644 --- a/docs/src/pages/404.astro +++ b/docs/src/pages/404.astro @@ -1,9 +1,240 @@ --- -import Layout from '../layouts/Main.astro'; +import SiteSidebar from '../components/SiteSidebar.astro'; +import AstroLogo from '../components/AstroLogo.astro'; +import ThemeToggle from '../components/ThemeToggle.tsx'; +import MenuToggle from '../components/MenuToggle.tsx'; --- -<Layout> - <h1>404</h1> - <p>This page isn't in our solar system.</p> - <a href="/">Take me home.</a> -</Layout> +<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'); +} + + .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"> + <h1>404</h1> + <p>This page isn't in our solar system.</p> + <a href="/">Take me home.</a> + </article> + </div> + </main> + </body> +</html> diff --git a/docs/src/pages/getting-started.md b/docs/src/pages/getting-started.md deleted file mode 100644 index 71b5434ef..000000000 --- a/docs/src/pages/getting-started.md +++ /dev/null @@ -1,60 +0,0 @@ ---- -layout: ~/layouts/Main.astro -title: Getting Started ---- - - -Astro is modern static site builder. Learn what Astro is all about from [our homepage](https://astro.build/) or [our release post](https://astro.build/blog/introducing-astro). This page is an overview of the Astro documentation and all related resources. - -## Try Astro - -The easiest way to try Astro is to run `npm init astro` in a new directory on your machine. This CLI command will walk you through starting a new Astro project. - -Read our [Installation Guide](/installation) for a full walk-through on getting set up with Astro. - -### Online Playgrounds - -If you're interested in playing around with Astro in the browser, you can use an online code playground. Try a Hello World template on [CodeSandbox](https://codesandbox.io/s/astro-template-hugb3). - -*Note: some features (ex: Fast Refresh) are currently limited on CodeSandbox.* - - -## Learn Astro - -People come to Astro from different backgrounds and with different learning styles. Whether you prefer a more theoretical or a practical approach, we hope you'll find this section helpful. - -* If you prefer to **learn by doing**, start with our [examples library](https://github.com/snowpackjs/astro/tree/main/examples). -* If you prefer to **learn concepts step by step**, start with our [basic concepts and guides](/core-concepts/project-structure). - -Like any unfamiliar technology, Astro does have a learning curve. With practice and some patience, you *will* get the hang of it. - -### Learn `.astro` Syntax - -When you begin to learn Astro, you'll see many files using the `.astro` file extension. This is the **Astro component syntax**: a special HTML-like file format that Astro uses for templating. It was designed to feel familiar to anyone with HTML or JSX experience. - -Our guide on [Astro components](/core-concepts/astro-components) walks you through the new syntax, and is best way to learn. - -### API Reference - -This documentation section is useful when you want to learn more details about a particular Astro API. For example, [Configuration Reference](/reference/configuration-reference) lists all possible configuration options available to you. [Built-in Components Reference](/reference/builtin-components) lists all available core components, like `<Markdown />` and `<Prism />`. - -### Versioned Documentation - -This documentation always reflects the latest stable version of Astro. Once we hit the v1.0 milestone, we will add the ability to view versioned documentation. - - -## Staying Informed - -The [@astrodotbuild](https://twitter.com/astrodotbuild) Twitter account is the official source for the updates from the Astro team. - -We also post release announcements to our [Discord community](https://astro.build/chat) in the #announcements channel. - -Not every Astro release deserves its own blog post, but you can find a detailed changelog for every release in the [`CHANGELOG.md` file in the Astro repository](https://github.com/snowpackjs/astro/blob/main/packages/astro/CHANGELOG.md). - -## Something Missing? - -If something is missing in the documentation or if you found some part confusing, please [file an issue for the documentation](https://github.com/snowpackjs/astro/issues/new/choose) with your suggestions for improvement, or tweet at the [@astrodotbuild](https://twitter.com/astrodotbuild) Twitter account. We love hearing from you! - -## Credit - -This getting started guide was originally based off of [React's](https://reactjs.org/) getting started guide.
\ No newline at end of file diff --git a/docs/src/pages/guides/deploy.md b/docs/src/pages/guides/deploy.md index ca8365e5e..39518fc78 100644 --- a/docs/src/pages/guides/deploy.md +++ b/docs/src/pages/guides/deploy.md @@ -3,6 +3,8 @@ layout: ~/layouts/Main.astro title: Deploy a Website --- +> This page is based off of [Vite's](https://vitejs.dev/) well-documented [static deploy instructions](https://vitejs.dev/guide/static-deploy.html). + The following guides are based on some shared assumptions: - You are using the default build output location (`dist/`). This location [can be changed using the `dist` configuration option](/reference/configuration-reference). @@ -251,7 +253,3 @@ Install the extension in VS Code and navigate to your app root. Open the Static Follow the wizard started by the extension to give your app a name, choose a framework preset, and designate the app root (usually `/`) and built file location `/dist`. The wizard will run and will create a GitHub action in your repo in a `.github` folder. The action will work to deploy your app (watch its progress in your repo's Actions tab) and, when successfully completed, you can view your app in the address provided in the extension's progress window by clicking the 'Browse Website' button that appears when the GitHub action has run. - -## Credits - -This guide was originally based off of [Vite's](https://vitejs.dev/) well-documented static deploy guide.
\ No newline at end of file diff --git a/docs/src/pages/index.astro b/docs/src/pages/index.astro index 358e44cbc..e5b06cc10 100644 --- a/docs/src/pages/index.astro +++ b/docs/src/pages/index.astro @@ -1,9 +1,251 @@ --- -import Layout from '../layouts/Main.astro'; +import SiteSidebar from '../components/SiteSidebar.astro'; +import AstroLogo from '../components/AstroLogo.astro'; +import ThemeToggle from '../components/ThemeToggle.tsx'; +import MenuToggle from '../components/MenuToggle.tsx'; --- -<Layout> - <h1> - <code>npm init astro</code> - </h1> -</Layout> +<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> diff --git a/docs/src/pages/integrations/data-sources-cms.md b/docs/src/pages/integrations/data-sources-cms.md new file mode 100644 index 000000000..d5af468d9 --- /dev/null +++ b/docs/src/pages/integrations/data-sources-cms.md @@ -0,0 +1,4 @@ +--- +layout: ~/layouts/Main.astro +title: Data Sources / CMS +--- diff --git a/docs/src/pages/integrations/deploy-astro.md b/docs/src/pages/integrations/deploy-astro.md new file mode 100644 index 000000000..5cec38a50 --- /dev/null +++ b/docs/src/pages/integrations/deploy-astro.md @@ -0,0 +1,4 @@ +--- +layout: ~/layouts/Main.astro +title: Deploy Astro +--- diff --git a/docs/src/pages/integrations/developer-tools.md b/docs/src/pages/integrations/developer-tools.md new file mode 100644 index 000000000..1f719306d --- /dev/null +++ b/docs/src/pages/integrations/developer-tools.md @@ -0,0 +1,4 @@ +--- +layout: ~/layouts/Main.astro +title: Developer Tools +--- diff --git a/docs/src/pages/integrations/state-management.md b/docs/src/pages/integrations/state-management.md new file mode 100644 index 000000000..4a65c3eb0 --- /dev/null +++ b/docs/src/pages/integrations/state-management.md @@ -0,0 +1,4 @@ +--- +layout: ~/layouts/Main.astro +title: State Management +--- diff --git a/docs/src/pages/integrations/styles-and-css-libraries.md b/docs/src/pages/integrations/styles-and-css-libraries.md new file mode 100644 index 000000000..2107e8947 --- /dev/null +++ b/docs/src/pages/integrations/styles-and-css-libraries.md @@ -0,0 +1,4 @@ +--- +layout: ~/layouts/Main.astro +title: Styles & CSS Libraries +--- |