diff options
Diffstat (limited to 'examples')
43 files changed, 441 insertions, 56 deletions
diff --git a/examples/astro-markdown/package.json b/examples/astro-markdown/package.json index fe5cebb05..9071e0a64 100644 --- a/examples/astro-markdown/package.json +++ b/examples/astro-markdown/package.json @@ -1,15 +1,13 @@ { - "name": "@example/astro-markdown", + "name": "@astrojs/markdown-example", "version": "0.0.1", "private": true, "scripts": { "start": "astro dev", - "build": "astro build", - "astro-dev": "nodemon --delay 0.5 -w ../../packages/astro/dist -x '../../packages/astro/astro.mjs dev'" + "build": "astro build" }, "devDependencies": { - "astro": "0.12.9", - "nodemon": "^2.0.7" + "astro": "^0.12.9" }, "snowpack": { "workspaceRoot": "../.." diff --git a/examples/blog/.gitignore b/examples/blog/.gitignore new file mode 100644 index 000000000..d436c6dad --- /dev/null +++ b/examples/blog/.gitignore @@ -0,0 +1,18 @@ +# build output +dist + +# dependencies +node_modules/ +.snowpack/ + +# logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# environment variables +.env +.env.production + +# macOS-specific files +.DS_Store diff --git a/examples/blog/README.md b/examples/blog/README.md index 2a20654f2..87c48761c 100644 --- a/examples/blog/README.md +++ b/examples/blog/README.md @@ -1,5 +1,7 @@ # Astro Blog Example +> π§βπ **Seasoned astronaut?** Delete this file. Have fun! + Features: - β
SEO-friendly setup with canonical URLs and OpenGraph data @@ -7,24 +9,39 @@ Features: - β
RSS 2.0 generation - β
Sitemap.xml generation -## Setup +## π Project Structure + +Inside of your Astro project, you'll see the following folders and files: ``` -yarn +/ +βββ public/ +β βββ robots.txt +β βββ favicon.ico +βββ src/ +β βββ components/ +β β βββ Tour.astro +β βββ pages/ +β βββ index.astro +βββ package.json ``` -## Dev +Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name. -``` -yarn start -``` +There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components. -Preview at `http://localhost:3000` +Any static assets, like images, can be placed in the `public/` directory. -## Build +## π§ Commands -``` -yarn build -``` +All commands are run from the root of the project, from a terminal: + +| Command | Action | +|:----------------|:--------------------------------------------| +| `npm install` | Installs dependencies | +| `npm run start` | Starts local dev server at `localhost:3000` | +| `npm run build` | Build your production site to `./dist/` | + +## π Want to learn more? -Will output static site at `./dist` +Feel free to check [our documentation](https://github.com/snowpackjs/astro) or jump into our [Discord server](https://discord.gg/EsGdSGen). diff --git a/examples/blog/astro.config.mjs b/examples/blog/astro.config.mjs index 9933e9571..c7583a774 100644 --- a/examples/blog/astro.config.mjs +++ b/examples/blog/astro.config.mjs @@ -1,10 +1,14 @@ export default { - projectRoot: '.', - pages: './src/pages', - public: './public', - dist: './dist', + // projectRoot: '.', // Where to resolve all URLs relative to. Useful if you have a monorepo project. + // pages: './src/pages', // Path to Astro components, pages, and data + // dist: './dist', // When running `astro build`, path to final static output + // public: './public', // A folder of static files Astro will copy to the root. Useful for favicons, images, and other files that donβt need processing. buildOptions: { - sitemap: true, - site: 'https://mysite.dev/', // change + // site: '', // Your public domain, e.g.: https://my-site.dev/. Used to generate sitemaps and canonical URLs. + // sitemap: true, // Generate sitemap (set to "false" to disable) + }, + devOptions: { + // port: 3000, // The port to run the dev server on. + // tailwindConfig: '', // Path to tailwind.config.js if used, e.g. './tailwind.config.js' }, }; diff --git a/examples/blog/meta.json b/examples/blog/meta.json new file mode 100644 index 000000000..caa6852e5 --- /dev/null +++ b/examples/blog/meta.json @@ -0,0 +1,5 @@ +{ + "title": "Blog", + "description": "an SEO-optimized blog starter", + "rank": 1 +} diff --git a/examples/blog/package.json b/examples/blog/package.json index 5d8d17115..c6faac56a 100644 --- a/examples/blog/package.json +++ b/examples/blog/package.json @@ -1,11 +1,10 @@ { - "name": "@example/blog", + "name": "@astrojs/example-blog", "version": "0.0.1", "private": true, "scripts": { "start": "astro dev", - "build": "astro build", - "astro-dev": "nodemon --delay 0.5 -w ../../packages/astro/dist -x '../../packages/astro/astro.mjs dev'" + "build": "astro build" }, "devDependencies": { "astro": "^0.12.9", diff --git a/examples/doc/public/favicon.svg b/examples/blog/public/favicon.svg index 542f90aec..542f90aec 100644 --- a/examples/doc/public/favicon.svg +++ b/examples/blog/public/favicon.svg diff --git a/examples/doc/package.json b/examples/doc/package.json deleted file mode 100644 index 61d247ff8..000000000 --- a/examples/doc/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@example/doc", - "version": "0.0.1", - "private": true, - "scripts": { - "start": "astro dev", - "build": "astro build", - "astro-dev": "nodemon --delay 0.5 -w ../../packages/astro/dist -x '../../packages/astro/astro.mjs dev'" - }, - "devDependencies": { - "astro": "^0.12.9", - "nodemon": "^2.0.7" - }, - "snowpack": { - "workspaceRoot": "../.." - } -} diff --git a/examples/docs/.gitignore b/examples/docs/.gitignore new file mode 100644 index 000000000..d436c6dad --- /dev/null +++ b/examples/docs/.gitignore @@ -0,0 +1,18 @@ +# build output +dist + +# dependencies +node_modules/ +.snowpack/ + +# logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# environment variables +.env +.env.production + +# macOS-specific files +.DS_Store diff --git a/examples/doc/astro.config.mjs b/examples/docs/astro.config.mjs index d97e2804d..d97e2804d 100644 --- a/examples/doc/astro.config.mjs +++ b/examples/docs/astro.config.mjs diff --git a/examples/docs/package.json b/examples/docs/package.json new file mode 100644 index 000000000..cb587286d --- /dev/null +++ b/examples/docs/package.json @@ -0,0 +1,15 @@ +{ + "name": "@astrojs/docs-template", + "version": "0.0.1", + "private": true, + "scripts": { + "start": "astro dev", + "build": "astro build" + }, + "devDependencies": { + "astro": "^0.12.9" + }, + "snowpack": { + "workspaceRoot": "../.." + } +} diff --git a/examples/doc/public/code.css b/examples/docs/public/code.css index 54b2c5094..54b2c5094 100644 --- a/examples/doc/public/code.css +++ b/examples/docs/public/code.css diff --git a/examples/docs/public/favicon.svg b/examples/docs/public/favicon.svg new file mode 100644 index 000000000..542f90aec --- /dev/null +++ b/examples/docs/public/favicon.svg @@ -0,0 +1,11 @@ +<svg width="256" height="256" fill="none" xmlns="http://www.w3.org/2000/svg"> + <style> + #flame { fill: #FF5D01; } + #a { fill: #000014; } + @media (prefers-color-scheme: dark) { + #a { fill: #fff; } + } + </style> + <path id="a" fill-rule="evenodd" clip-rule="evenodd" d="M163.008 18.929c1.944 2.413 2.935 5.67 4.917 12.181l43.309 142.27a180.277 180.277 0 00-51.778-17.53l-28.198-95.29a3.67 3.67 0 00-7.042.01l-27.857 95.232a180.225 180.225 0 00-52.01 17.557l43.52-142.281c1.99-6.502 2.983-9.752 4.927-12.16a15.999 15.999 0 016.484-4.798c2.872-1.154 6.271-1.154 13.07-1.154h31.085c6.807 0 10.211 0 13.086 1.157a16.004 16.004 0 016.487 4.806z" /> + <path id="flame" fill-rule="evenodd" clip-rule="evenodd" d="M168.19 180.151c-7.139 6.105-21.39 10.268-37.804 10.268-20.147 0-37.033-6.272-41.513-14.707-1.602 4.835-1.961 10.367-1.961 13.902 0 0-1.056 17.355 11.015 29.426 0-6.268 5.081-11.349 11.349-11.349 10.743 0 10.731 9.373 10.721 16.977v.679c0 11.542 7.054 21.436 17.086 25.606a23.27 23.27 0 01-2.339-10.2c0-11.008 6.463-15.107 13.974-19.87 5.976-3.79 12.616-8.001 17.192-16.449a31.024 31.024 0 003.743-14.82c0-3.299-.513-6.479-1.463-9.463z" /> +</svg> diff --git a/examples/doc/public/index.css b/examples/docs/public/index.css index c5ae87f5c..c5ae87f5c 100644 --- a/examples/doc/public/index.css +++ b/examples/docs/public/index.css diff --git a/examples/doc/public/theme.css b/examples/docs/public/theme.css index d381604c8..d381604c8 100644 --- a/examples/doc/public/theme.css +++ b/examples/docs/public/theme.css diff --git a/examples/doc/public/theme.js b/examples/docs/public/theme.js index d75d0bf99..d75d0bf99 100644 --- a/examples/doc/public/theme.js +++ b/examples/docs/public/theme.js diff --git a/examples/doc/src/components/ArticleFooter.astro b/examples/docs/src/components/ArticleFooter.astro index 8078e2cc3..8078e2cc3 100644 --- a/examples/doc/src/components/ArticleFooter.astro +++ b/examples/docs/src/components/ArticleFooter.astro diff --git a/examples/doc/src/components/AvatarList.astro b/examples/docs/src/components/AvatarList.astro index aafcb371b..aafcb371b 100644 --- a/examples/doc/src/components/AvatarList.astro +++ b/examples/docs/src/components/AvatarList.astro diff --git a/examples/doc/src/components/DocSidebar.tsx b/examples/docs/src/components/DocSidebar.tsx index 076d460cc..076d460cc 100644 --- a/examples/doc/src/components/DocSidebar.tsx +++ b/examples/docs/src/components/DocSidebar.tsx diff --git a/examples/doc/src/components/EditOnGithub.tsx b/examples/docs/src/components/EditOnGithub.tsx index f7478934f..f7478934f 100644 --- a/examples/doc/src/components/EditOnGithub.tsx +++ b/examples/docs/src/components/EditOnGithub.tsx diff --git a/examples/doc/src/components/Note.astro b/examples/docs/src/components/Note.astro index 46940ddf8..46940ddf8 100644 --- a/examples/doc/src/components/Note.astro +++ b/examples/docs/src/components/Note.astro diff --git a/examples/doc/src/components/SiteSidebar.astro b/examples/docs/src/components/SiteSidebar.astro index 7279d9aea..7279d9aea 100644 --- a/examples/doc/src/components/SiteSidebar.astro +++ b/examples/docs/src/components/SiteSidebar.astro diff --git a/examples/doc/src/components/ThemeToggle.tsx b/examples/docs/src/components/ThemeToggle.tsx index 5a5061c15..5a5061c15 100644 --- a/examples/doc/src/components/ThemeToggle.tsx +++ b/examples/docs/src/components/ThemeToggle.tsx diff --git a/examples/doc/src/config.ts b/examples/docs/src/config.ts index 6b6ce3fdc..6b6ce3fdc 100644 --- a/examples/doc/src/config.ts +++ b/examples/docs/src/config.ts diff --git a/examples/doc/src/layouts/Main.astro b/examples/docs/src/layouts/Main.astro index b741098ef..b741098ef 100644 --- a/examples/doc/src/layouts/Main.astro +++ b/examples/docs/src/layouts/Main.astro diff --git a/examples/doc/src/pages/example.md b/examples/docs/src/pages/example.md index 0966595d8..0966595d8 100644 --- a/examples/doc/src/pages/example.md +++ b/examples/docs/src/pages/example.md diff --git a/examples/doc/src/pages/index.astro b/examples/docs/src/pages/index.astro index 75ca0da4f..75ca0da4f 100644 --- a/examples/doc/src/pages/index.astro +++ b/examples/docs/src/pages/index.astro diff --git a/examples/kitchen-sink/package.json b/examples/kitchen-sink/package.json index 630007124..ea89cbe3b 100644 --- a/examples/kitchen-sink/package.json +++ b/examples/kitchen-sink/package.json @@ -1,15 +1,13 @@ { - "name": "@example/kitchen-sink", + "name": "@astrojs/kitchen-sink-example", "private": true, "version": "1.0.0", "scripts": { "start": "astro dev", - "build": "astro build", - "astro-dev": "nodemon --delay 0.5 -w ../../packages/astro/dist -x '../../packages/astro/astro.mjs dev'" + "build": "astro build" }, "devDependencies": { - "astro": "^0.12.9", - "nodemon": "^2.0.7" + "astro": "^0.12.9" }, "snowpack": { "workspaceRoot": "../.." diff --git a/examples/portfolio/.gitignore b/examples/portfolio/.gitignore new file mode 100644 index 000000000..d436c6dad --- /dev/null +++ b/examples/portfolio/.gitignore @@ -0,0 +1,18 @@ +# build output +dist + +# dependencies +node_modules/ +.snowpack/ + +# logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# environment variables +.env +.env.production + +# macOS-specific files +.DS_Store diff --git a/examples/portfolio/package.json b/examples/portfolio/package.json index 6e2ecfac6..008c624db 100644 --- a/examples/portfolio/package.json +++ b/examples/portfolio/package.json @@ -1,11 +1,10 @@ { - "name": "@example/portfolio", + "name": "@astrojs/portfolio-template", "private": true, "version": "0.0.1", "scripts": { "start": "astro dev", - "build": "astro build", - "astro-dev": "nodemon --delay 0.5 -w ../../packages/astro/dist -x '../../packages/astro/astro.mjs dev'" + "build": "astro build" }, "devDependencies": { "astro": "^0.12.9" diff --git a/examples/starter/.gitignore b/examples/starter/.gitignore new file mode 100644 index 000000000..d436c6dad --- /dev/null +++ b/examples/starter/.gitignore @@ -0,0 +1,18 @@ +# build output +dist + +# dependencies +node_modules/ +.snowpack/ + +# logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# environment variables +.env +.env.production + +# macOS-specific files +.DS_Store diff --git a/examples/starter/README.md b/examples/starter/README.md new file mode 100644 index 000000000..8565cdbb3 --- /dev/null +++ b/examples/starter/README.md @@ -0,0 +1,40 @@ +# Welcome to [Astro](https://astro.build) + +> π§βπ **Seasoned astronaut?** Delete this file. Have fun! + +## π Project Structure + +Inside of your Astro project, you'll see the following folders and files: + +``` +/ +βββ public/ +β βββ robots.txt +β βββ favicon.ico +βββ src/ +β βββ components/ +β β βββ Tour.astro +β βββ pages/ +β βββ index.astro +βββ package.json +``` + +Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name. + +There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components. + +Any static assets, like images, can be placed in the `public/` directory. + +## π§ Commands + +All commands are run from the root of the project, from a terminal: + +| Command | Action | +|:----------------|:--------------------------------------------| +| `npm install` | Installs dependencies | +| `npm run start` | Starts local dev server at `localhost:3000` | +| `npm run build` | Build your production site to `./dist/` | + +## π Want to learn more? + +Feel free to check [our documentation](https://github.com/snowpackjs/astro) or jump into our [Discord server](https://discord.gg/EsGdSGen). diff --git a/examples/starter/astro.config.mjs b/examples/starter/astro.config.mjs new file mode 100644 index 000000000..e16ed1327 --- /dev/null +++ b/examples/starter/astro.config.mjs @@ -0,0 +1,14 @@ +export default { + // projectRoot: '.', // Where to resolve all URLs relative to. Useful if you have a monorepo project. + // pages: './src/pages', // Path to Astro components, pages, and data + // dist: './dist', // When running `astro build`, path to final static output + // public: './public', // A folder of static files Astro will copy to the root. Useful for favicons, images, and other files that donβt need processing. + buildOptions: { + // site: 'http://example.com', // Your public domain, e.g.: https://my-site.dev/. Used to generate sitemaps and canonical URLs. + // sitemap: true, // Generate sitemap (set to "false" to disable) + }, + devOptions: { + // port: 3000, // The port to run the dev server on. + // tailwindConfig: '', // Path to tailwind.config.js if used, e.g. './tailwind.config.js' + }, +}; diff --git a/examples/starter/meta.json b/examples/starter/meta.json new file mode 100644 index 000000000..e9f3778c7 --- /dev/null +++ b/examples/starter/meta.json @@ -0,0 +1,5 @@ +{ + "title": "Getting Started", + "description": "a friendly starting point for new astronauts", + "rank": 999 +} diff --git a/examples/starter/package.json b/examples/starter/package.json new file mode 100644 index 000000000..00dfc15e6 --- /dev/null +++ b/examples/starter/package.json @@ -0,0 +1,12 @@ +{ + "name": "@astrojs/starter-kit", + "version": "0.0.1", + "private": true, + "scripts": { + "start": "astro dev", + "build": "astro build" + }, + "devDependencies": { + "astro": "^0.12.9" + } +} diff --git a/examples/starter/public/assets/logo.svg b/examples/starter/public/assets/logo.svg new file mode 100644 index 000000000..d751556b2 --- /dev/null +++ b/examples/starter/public/assets/logo.svg @@ -0,0 +1,12 @@ +<svg width="193" height="256" fill="none" xmlns="http://www.w3.org/2000/svg"> + <style> + #flame { fill: #FF5D01; } + #a { fill: #000014; } + @media (prefers-color-scheme: dark) { + #a { fill: #fff; } + } + </style> + + <path id="a" fill-rule="evenodd" clip-rule="evenodd" d="M131.496 18.929c1.943 2.413 2.935 5.67 4.917 12.181l43.309 142.27a180.277 180.277 0 00-51.778-17.53L99.746 60.56a3.67 3.67 0 00-7.042.01l-27.857 95.232a180.224 180.224 0 00-52.01 17.557l43.52-142.281c1.989-6.502 2.983-9.752 4.927-12.16a15.999 15.999 0 016.484-4.798c2.872-1.154 6.271-1.154 13.07-1.154h31.085c6.807 0 10.211 0 13.085 1.157a16 16 0 016.488 4.806z" fill="url(#paint0_linear)"/> + <path id="flame" fill-rule="evenodd" clip-rule="evenodd" d="M136.678 180.151c-7.14 6.105-21.39 10.268-37.804 10.268-20.147 0-37.033-6.272-41.513-14.707-1.602 4.835-1.962 10.367-1.962 13.902 0 0-1.055 17.355 11.016 29.426 0-6.268 5.081-11.349 11.349-11.349 10.743 0 10.731 9.373 10.721 16.977v.679c0 11.542 7.054 21.436 17.086 25.606a23.27 23.27 0 01-2.339-10.2c0-11.008 6.463-15.107 13.973-19.87 5.977-3.79 12.616-8.001 17.192-16.449a31.013 31.013 0 003.744-14.82c0-3.299-.513-6.479-1.463-9.463z" /> +</svg> diff --git a/examples/starter/public/favicon.svg b/examples/starter/public/favicon.svg new file mode 100644 index 000000000..542f90aec --- /dev/null +++ b/examples/starter/public/favicon.svg @@ -0,0 +1,11 @@ +<svg width="256" height="256" fill="none" xmlns="http://www.w3.org/2000/svg"> + <style> + #flame { fill: #FF5D01; } + #a { fill: #000014; } + @media (prefers-color-scheme: dark) { + #a { fill: #fff; } + } + </style> + <path id="a" fill-rule="evenodd" clip-rule="evenodd" d="M163.008 18.929c1.944 2.413 2.935 5.67 4.917 12.181l43.309 142.27a180.277 180.277 0 00-51.778-17.53l-28.198-95.29a3.67 3.67 0 00-7.042.01l-27.857 95.232a180.225 180.225 0 00-52.01 17.557l43.52-142.281c1.99-6.502 2.983-9.752 4.927-12.16a15.999 15.999 0 016.484-4.798c2.872-1.154 6.271-1.154 13.07-1.154h31.085c6.807 0 10.211 0 13.086 1.157a16.004 16.004 0 016.487 4.806z" /> + <path id="flame" fill-rule="evenodd" clip-rule="evenodd" d="M168.19 180.151c-7.139 6.105-21.39 10.268-37.804 10.268-20.147 0-37.033-6.272-41.513-14.707-1.602 4.835-1.961 10.367-1.961 13.902 0 0-1.056 17.355 11.015 29.426 0-6.268 5.081-11.349 11.349-11.349 10.743 0 10.731 9.373 10.721 16.977v.679c0 11.542 7.054 21.436 17.086 25.606a23.27 23.27 0 01-2.339-10.2c0-11.008 6.463-15.107 13.974-19.87 5.976-3.79 12.616-8.001 17.192-16.449a31.024 31.024 0 003.743-14.82c0-3.299-.513-6.479-1.463-9.463z" /> +</svg> diff --git a/examples/starter/public/robots.txt b/examples/starter/public/robots.txt new file mode 100644 index 000000000..1f53798bb --- /dev/null +++ b/examples/starter/public/robots.txt @@ -0,0 +1,2 @@ +User-agent: * +Disallow: / diff --git a/examples/starter/public/style/global.css b/examples/starter/public/style/global.css new file mode 100644 index 000000000..0ce3b249a --- /dev/null +++ b/examples/starter/public/style/global.css @@ -0,0 +1,28 @@ +* { + box-sizing: border-box; + margin: 0; +} + +:root { + font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji; + font-size: 1rem; + --user-font-scale: 1rem - 16px; + font-size: clamp(0.875rem, 0.4626rem + 1.0309vw + var(--user-font-scale), 1.125rem); +} + +body { + padding: 4rem 2rem; + width: 100vw; + min-height: 100vh; + display: grid; + justify-content: center; + background: #f9fafb; + color: #111827; +} + +@media (prefers-color-scheme: dark) { + body { + background: #111827; + color: #fff; + } +} diff --git a/examples/starter/public/style/home.css b/examples/starter/public/style/home.css new file mode 100644 index 000000000..c4271a845 --- /dev/null +++ b/examples/starter/public/style/home.css @@ -0,0 +1,38 @@ +:root { + --font-mono: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace; + --color-light: #F3F4F6; +} + +@media (prefers-color-scheme: dark) { + :root { + --color-light: #1F2937; + } +} + +a { + color: inherit; +} + +header > div { + font-size: clamp(2rem, -0.4742rem + 6.1856vw, 2.75rem); +} + +header > div { + display: flex; + flex-direction: column; + align-items: center; +} + +header h1 { + font-size: 1em; + font-weight: 500; +} +header img { + width: 2em; + height: 2.667em; +} + +h2 { + font-weight: 500; + font-size: clamp(1.5rem, 1rem + 1.25vw, 2rem); +} diff --git a/examples/starter/src/components/Tour.astro b/examples/starter/src/components/Tour.astro new file mode 100644 index 000000000..5c822fe75 --- /dev/null +++ b/examples/starter/src/components/Tour.astro @@ -0,0 +1,85 @@ +--- +import { Markdown } from 'astro/components'; +--- +<article> + <div class="banner"> + <p><strong>π§βπ Seasoned astronaut?</strong> Delete this file. Have fun!</p> + </div> + + <section> + <Markdown> + ## π Project Structure + + Inside of your Astro project, you'll see the following folders and files: + + ``` + / + βββ public/ + β βββ robots.txt + β βββ favicon.ico + βββ src/ + β βββ components/ + β β βββ Tour.astro + β βββ pages/ + β βββ index.astro + βββ package.json + ``` + + Astro looks for `.astro` or `.md` files in the `src/pages/` directory. + Each page is exposed as a route based on its file name. + + There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components. + + Any static assets, like images, can be placed in the `public/` directory. + </Markdown> + </section> + + <section> + <h2>π Want to learn more?</h2> + <p>Feel free to check <a href="https://github.com/snowpackjs/astro">our documentation</a> or jump into our <a href="https://discord.gg/EsGdSGen">Discord server</a>.</p> + </section> + +</article> + +<style> + article { + padding-top: 2em; + line-height: 1.5; + } + section { + margin-top: 2em; + display: flex; + flex-direction: column; + gap: 1em; + max-width: 70ch; + } + + .banner { + text-align: center; + font-size: 1.2rem; + background: var(--color-light); + padding: 1em 1.5em; + padding-left: 0.75em; + border-radius: 4px; + } + + pre, + code { + font-family: var(--font-mono); + background: var(--color-light); + border-radius: 4px; + } + + pre { + padding: 1em 1.5em; + } + + .tree { + line-height: 1.2; + } + + code:not(.tree) { + padding: 0.125em; + margin: 0 -0.125em; + } +</style> diff --git a/examples/starter/src/pages/index.astro b/examples/starter/src/pages/index.astro new file mode 100644 index 000000000..de052e9c4 --- /dev/null +++ b/examples/starter/src/pages/index.astro @@ -0,0 +1,38 @@ +--- +import Tour from '../components/Tour.astro'; +--- + +<!doctype html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>Astro</title> + + <link rel="icon" type="image/svg+xml" href="/favicon.svg"> + + <link rel="stylesheet" href="/style/global.css"> + <link rel="stylesheet" href="/style/home.css"> + + <style> + header { + display: flex; + flex-direction: column; + gap: 1em; + max-width: min(100%, 68ch); + } + </style> +</head> +<body> + <main> + <header> + <div> + <img width="60" height="80" src="/assets/logo.svg" alt="Astro logo"> + <h1>Welcome to <a href="https://astro.build/">Astro</a></h1> + </div> + </header> + + <Tour /> + </main> +</body> +</html> diff --git a/examples/tailwindcss/package.json b/examples/tailwindcss/package.json index 2bea3a777..edf0cd0bd 100644 --- a/examples/tailwindcss/package.json +++ b/examples/tailwindcss/package.json @@ -1,15 +1,14 @@ { - "name": "@example/tailwindcss", + "name": "@astrojs/tailwind-example", "version": "0.0.1", "private": true, "scripts": { "start": "astro dev", - "build": "astro build", - "astro-dev": "nodemon --delay 0.5 -w ../../packages/astro/dist -x '../../packages/astro/astro.mjs dev'" + "build": "astro build" }, "devDependencies": { - "astro": "^0.12.9", - "tailwindcss": "^2.1.2" + "tailwindcss": "^2.1.2", + "astro": "^0.12.9" }, "snowpack": { "workspaceRoot": "../.." |
