Audit examples templates (#3940)
* basics, framework-alpine, framework-solid, delete unused examples * framework-multiple * Remove non-standard file extensions, add missing .vscode folders * Remove robots.txt * Remove blog-multiple-authors * Rewrite components comments to be consistent * Update lockfile * Remove unnecessary usage of SCSS in subpath example * Fix props weirdness in portfolio example * Remove Lit from `framework-multiple` for now * Misc fixes * Update lockfile * I'm in lockfile hell, send help
This commit is contained in:
Erika
GitHub
parent
32580d4fdc
commit
f591150512
130 changed files with 273 additions and 1720 deletions
|
|
@ -1,6 +1,5 @@
|
|||
# Astro Examples Library
|
||||
|
||||
|
||||
The easiest way to check out one of these examples on your machine is by running this command in an empty directory:
|
||||
|
||||
```
|
||||
|
|
|
|||
|
|
@ -4,7 +4,8 @@ export interface Props {
|
|||
body: string;
|
||||
href: string;
|
||||
}
|
||||
const { href, title, body } = Astro.props;
|
||||
|
||||
const { href, title, body } = Astro.props as Props;
|
||||
---
|
||||
|
||||
<li class="link-card">
|
||||
|
|
@ -69,6 +70,7 @@ const { href, title, body } = Astro.props;
|
|||
}
|
||||
|
||||
.link-card:is(:hover, :focus-within) h2 span {
|
||||
will-change: transform;
|
||||
transform: translateX(2px);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -86,6 +86,7 @@ import Card from "../components/Card.astro";
|
|||
border-radius: 4px;
|
||||
padding: 0.15em 0.25em;
|
||||
}
|
||||
|
||||
.link-card-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
|
||||
|
|
|
|||
19
examples/blog-multiple-authors/.gitignore
vendored
19
examples/blog-multiple-authors/.gitignore
vendored
|
|
@ -1,19 +0,0 @@
|
|||
# build output
|
||||
dist/
|
||||
|
||||
# dependencies
|
||||
node_modules/
|
||||
|
||||
# logs
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
|
||||
# environment variables
|
||||
.env
|
||||
.env.production
|
||||
|
||||
# macOS-specific files
|
||||
.DS_Store
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
# Expose Astro dependencies for `pnpm` users
|
||||
shamefully-hoist=true
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"startCommand": "npm start",
|
||||
"env": {
|
||||
"ENABLE_CJS_IMPORTS": true
|
||||
}
|
||||
}
|
||||
|
|
@ -1,54 +0,0 @@
|
|||
# Astro Starter Kit: Blog with Multiple Authors
|
||||
|
||||
```
|
||||
npm init astro -- --template blog-multiple-authors
|
||||
```
|
||||
|
||||
[](https://stackblitz.com/github/withastro/astro/tree/latest/examples/blog-multiple-authors)
|
||||
|
||||
> 🧑🚀 **Seasoned astronaut?** Delete this file. Have fun!
|
||||
|
||||
Features:
|
||||
|
||||
- ✅ SEO-friendly setup with canonical URLs and OpenGraph data
|
||||
- ✅ Full Markdown support
|
||||
- ✅ RSS 2.0 generation
|
||||
- ✅ Sitemap.xml generation
|
||||
|
||||
## 🚀 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 dev` | Starts local dev server at `localhost:3000` |
|
||||
| `npm run build` | Build your production site to `./dist/` |
|
||||
| `npm run preview` | Preview your build locally, before deploying |
|
||||
|
||||
## 👀 Want to learn more?
|
||||
|
||||
Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
import { defineConfig } from 'astro/config';
|
||||
import preact from '@astrojs/preact';
|
||||
|
||||
// https://astro.build/config
|
||||
export default defineConfig({
|
||||
// Enable the Preact integration to support Preact JSX components.
|
||||
integrations: [preact()],
|
||||
site: `http://astro.build`,
|
||||
});
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"name": "@example/blog-multiple-authors",
|
||||
"version": "0.0.1",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "astro dev",
|
||||
"start": "astro dev",
|
||||
"build": "astro build",
|
||||
"preview": "astro preview"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@astrojs/preact": "^0.5.2",
|
||||
"astro": "^1.0.0-rc.6",
|
||||
"sass": "^1.52.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"preact": "^10.7.3"
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 150 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 97 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 164 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 28 KiB |
|
|
@ -1,11 +0,0 @@
|
|||
{
|
||||
"infiniteLoopProtection": true,
|
||||
"hardReloadOnChange": false,
|
||||
"view": "browser",
|
||||
"template": "node",
|
||||
"container": {
|
||||
"port": 3000,
|
||||
"startScript": "start",
|
||||
"node": "14"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
---
|
||||
import "../styles/global.css";
|
||||
|
||||
export interface Props {
|
||||
title: string;
|
||||
description: string;
|
||||
image?: string;
|
||||
type?: string;
|
||||
next?: string;
|
||||
prev?: string;
|
||||
canonicalURL?: string | URL;
|
||||
}
|
||||
|
||||
const { title, description, image, type, next, prev, canonicalURL } = Astro.props as Props;
|
||||
---
|
||||
|
||||
<!-- Common -->
|
||||
<meta charset="UTF-8" />
|
||||
<title>{title}</title>
|
||||
<meta name="description" content={description} />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,400;0,700;1,400;1,700&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<!-- Sitemap -->
|
||||
<link rel="sitemap" href="/sitemap.xml" />
|
||||
<!-- RSS -->
|
||||
<link rel="alternate" type="application/rss+xml" href="/feed/posts.xml" />
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
|
||||
|
||||
<!-- SEO -->
|
||||
<link rel="canonical" href={canonicalURL} />
|
||||
{next && <link rel="next" aria-label="Previous Page" href={new URL(next, canonicalURL).href} />}
|
||||
{prev && <link rel="prev" aria-label="Next Page" href={new URL(prev, canonicalURL).href} />}
|
||||
|
||||
<!-- OpenGraph -->
|
||||
<meta property="og:title" content={title} />
|
||||
<meta property="og:description" content={description} />
|
||||
{image && <meta property="og:image" content={new URL(image, canonicalURL)} />}
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta name="twitter:card" content={image ? "summary_large_image" : "summary"} />
|
||||
<meta name="twitter:site" content="@astro" />
|
||||
<meta name="twitter:title" content={title} />
|
||||
<meta name="twitter:description" content={description} />
|
||||
{image && <meta name="twitter:image" content={image} />}
|
||||
|
|
@ -1,63 +0,0 @@
|
|||
---
|
||||
export interface Props {
|
||||
title: string;
|
||||
}
|
||||
const { title } = Astro.props;
|
||||
---
|
||||
|
||||
<nav class="header">
|
||||
<h1 class="title">Don’s Blog</h1>
|
||||
<ul class="nav">
|
||||
<li><a href="/">Home</a></li>
|
||||
<li><a href="/posts">All Posts</a></li>
|
||||
<li><a href="/authors/don">Author: Don</a></li>
|
||||
<li><a href="/authors/sancho">Author: Sancho</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<style lang="scss">
|
||||
.header {
|
||||
text-align: center;
|
||||
|
||||
@media (min-width: 600px) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
margin: 0;
|
||||
font-size: 1.2em;
|
||||
letter-spacing: -0.03em;
|
||||
font-weight: 400;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
.nav {
|
||||
text-align: center;
|
||||
|
||||
@media (min-width: 600px) {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
font-size: 1.2em;
|
||||
letter-spacing: -0.02em;
|
||||
margin-left: 0.75em;
|
||||
margin-right: 0.75em;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
---
|
||||
export interface Props {
|
||||
prevUrl: string;
|
||||
nextUrl: string;
|
||||
}
|
||||
|
||||
const { prevUrl, nextUrl } = Astro.props;
|
||||
---
|
||||
|
||||
<div class="wrapper">
|
||||
<nav class="nav">
|
||||
<a class="prev" href={prevUrl || "#"} aria-label="Previous Page">Prev</a>
|
||||
<a class="next" href={nextUrl || "#"} aria-label="Next Page">Next</a>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.nav {
|
||||
display: flex;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
padding-top: 4rem;
|
||||
padding-bottom: 4rem;
|
||||
}
|
||||
|
||||
.prev,
|
||||
.next {
|
||||
display: block;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.8em;
|
||||
|
||||
&[href="#"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.prev {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.next {
|
||||
margin-left: auto;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,66 +0,0 @@
|
|||
---
|
||||
export interface Props {
|
||||
post: any;
|
||||
author: string;
|
||||
}
|
||||
const { post, author } = Astro.props;
|
||||
const { frontmatter } = post;
|
||||
|
||||
function formatDate(date) {
|
||||
return new Date(date).toUTCString().replace(/(\d\d\d\d) .*/, "$1"); // remove everything after YYYY
|
||||
}
|
||||
---
|
||||
|
||||
<article class="post">
|
||||
<div class="data">
|
||||
<h2>{frontmatter.title}</h2>
|
||||
<a class="author" href={`/authors/${frontmatter.author}`}>{author.name}</a>
|
||||
<time class="date" datetime={frontmatter.date}>{formatDate(frontmatter.date)}</time>
|
||||
<p class="description">
|
||||
{frontmatter.description}
|
||||
<a class="link" href={post.url} aria-label={`Read ${frontmatter.title}`}>Read</a>
|
||||
</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<style lang="scss">
|
||||
.post {
|
||||
padding-top: 6rem;
|
||||
padding-bottom: 6rem;
|
||||
border-bottom: 1px solid rgba(black, 0.25);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.author {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.date {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
.link {
|
||||
text-transform: uppercase;
|
||||
font-size: 0.8em;
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-weight: 700;
|
||||
font-size: 2.75em;
|
||||
line-height: 1;
|
||||
letter-spacing: -0.04em;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
time {
|
||||
display: block;
|
||||
margin-top: 0.25rem;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
{
|
||||
"don": {
|
||||
"name": "Don Quixote",
|
||||
"image": "/images/don.jpg"
|
||||
},
|
||||
"sancho": {
|
||||
"name": "Sancho Panza",
|
||||
"image": "/images/sancho.jpg"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,82 +0,0 @@
|
|||
---
|
||||
import MainHead from "../components/MainHead.astro";
|
||||
import Nav from "../components/Nav.astro";
|
||||
|
||||
const { content } = Astro.props;
|
||||
const canonicalURL = new URL(Astro.url.pathname, Astro.site);
|
||||
---
|
||||
|
||||
<html lang={content.lang || "en"}>
|
||||
<head>
|
||||
<title>{content.title}</title>
|
||||
<MainHead
|
||||
title={content.title}
|
||||
description={content.description}
|
||||
image={content.image}
|
||||
{canonicalURL}
|
||||
/>
|
||||
<style lang="scss">
|
||||
.title {
|
||||
margin-top: 4rem;
|
||||
margin-bottom: 4rem;
|
||||
font-size: 3em;
|
||||
letter-spacing: -0.04em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.description {
|
||||
margin-bottom: 4rem;
|
||||
font-size: 1.4em;
|
||||
font-weight: 400;
|
||||
text-align: justify;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.article {
|
||||
margin-top: 4rem;
|
||||
margin-bottom: 6rem;
|
||||
|
||||
:global(p) {
|
||||
font-size: 1.3em;
|
||||
line-height: 2;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
}
|
||||
|
||||
.posts {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.footer {
|
||||
margin-top: 6rem;
|
||||
padding-bottom: 6rem;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<Nav />
|
||||
|
||||
<main class="wrapper">
|
||||
<h2 class="title">{content.title}</h2>
|
||||
<p class="description">{content.description}</p>
|
||||
<img class="img" src={content.image} alt="" />
|
||||
<article class="article">
|
||||
<slot />
|
||||
</article>
|
||||
<footer class="footer">
|
||||
<a class="posts" href="/posts">All Posts</a>
|
||||
</footer>
|
||||
</main>
|
||||
|
||||
<footer></footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,74 +0,0 @@
|
|||
---
|
||||
import MainHead from "../components/MainHead.astro";
|
||||
import Nav from "../components/Nav.astro";
|
||||
|
||||
let title = "About";
|
||||
let description = "About page of an example blog on Astro";
|
||||
const canonicalURL = new URL(Astro.url.pathname, Astro.site);
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<MainHead {title} {description} {canonicalURL} />
|
||||
<style lang="scss">
|
||||
.text {
|
||||
padding-bottom: 6rem;
|
||||
|
||||
p {
|
||||
font-size: 1.2em;
|
||||
line-height: 2;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
}
|
||||
|
||||
.hero {
|
||||
display: block;
|
||||
height: 16rem;
|
||||
overflow: hidden;
|
||||
margin: 4rem 0;
|
||||
|
||||
&-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 3em;
|
||||
letter-spacing: -0.04em;
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 0;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<Nav {title} />
|
||||
|
||||
<main class="wrapper">
|
||||
<h2 class="title">{title}</h2>
|
||||
<div class="hero">
|
||||
<img class="hero-img" src="/images/chapter-01.jpg" alt="" />
|
||||
</div>
|
||||
<div class="text">
|
||||
<p>
|
||||
The book cover and spine above and the images which follow were not part of the original
|
||||
Ormsby translation—they are taken from the 1880 edition of J. W. Clark, illustrated by
|
||||
Gustave Doré. Clark in his edition states that, “The English text of ‘Don Quixote’ adopted
|
||||
in this edition is that of Jarvis, with occasional corrections from Motteaux.”
|
||||
</p>
|
||||
<p>
|
||||
See in the introduction below John Ormsby’s critique of both the Jarvis and Motteaux
|
||||
translations. It has been elected in the present Project Gutenberg edition to attach the
|
||||
famous engravings of Gustave Doré to the Ormsby translation instead of the
|
||||
Jarvis/Motteaux. The detail of many of the Doré engravings can be fully appreciated only
|
||||
by utilizing the “Full Size” button to expand them to their original dimensions. Ormsby in
|
||||
his Preface has criticized the fanciful nature of Doré’s illustrations; others feel these
|
||||
woodcuts and steel engravings well match Quixote’s dreams.
|
||||
</p>
|
||||
</div>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,80 +0,0 @@
|
|||
---
|
||||
import MainHead from "../../components/MainHead.astro";
|
||||
import Nav from "../../components/Nav.astro";
|
||||
import PostPreview from "../../components/PostPreview.astro";
|
||||
import authorData from "../../data/authors.json";
|
||||
|
||||
export async function getStaticPaths() {
|
||||
const allPosts = await Astro.glob("../post/*.md");
|
||||
let allAuthorsUnique = [...new Set(allPosts.map((p) => p.frontmatter.author))];
|
||||
return allAuthorsUnique.map((author) => ({ params: { author }, props: { allPosts } }));
|
||||
}
|
||||
|
||||
const { allPosts } = Astro.props;
|
||||
const title = "Don’s Blog";
|
||||
const description = "An example blog on Astro";
|
||||
const canonicalURL = new URL(Astro.url.pathname, Astro.site);
|
||||
|
||||
/** filter posts by author, sort by date */
|
||||
const posts = allPosts
|
||||
.filter((post) => post.frontmatter.author === Astro.params.author)
|
||||
.sort((a, b) => new Date(b.frontmatter.date).valueOf() - new Date(a.frontmatter.date).valueOf());
|
||||
const author = authorData[posts[0].frontmatter.author];
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>{title}</title>
|
||||
<MainHead
|
||||
{title}
|
||||
{description}
|
||||
image={posts[0].frontmatter.image}
|
||||
canonicalURL={canonicalURL.toString()}
|
||||
/>
|
||||
|
||||
<style lang="scss">
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 3em;
|
||||
letter-spacing: -0.04em;
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
margin-right: 0.5em;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
|
||||
&-img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
|
||||
.count {
|
||||
font-size: 1em;
|
||||
display: block;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<Nav {title} />
|
||||
|
||||
<main class="wrapper">
|
||||
<h2 class="title">
|
||||
<div class="avatar"><img class="avatar-img" src={author.image} alt="" /></div>
|
||||
{author.name}
|
||||
</h2>
|
||||
{posts.map((post) => <PostPreview post={post} author={author} />)}
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
---
|
||||
// Component Imports
|
||||
import MainHead from "../components/MainHead.astro";
|
||||
import Nav from "../components/Nav.astro";
|
||||
import PostPreview from "../components/PostPreview.astro";
|
||||
import Pagination from "../components/Pagination.astro";
|
||||
import authorData from "../data/authors.json";
|
||||
|
||||
// Component Script:
|
||||
// You can write any JavaScript/TypeScript that you'd like here.
|
||||
// It will run during the build, but never in the browser.
|
||||
// All variables are available to use in the HTML template below.
|
||||
let title = "Don’s Blog";
|
||||
let description = "An example blog on Astro";
|
||||
const canonicalURL = new URL(Astro.url.pathname, Astro.site);
|
||||
|
||||
// Data Fetching: List all Markdown posts in the repo.
|
||||
let allPosts = await Astro.glob("./post/*.md");
|
||||
allPosts.sort(
|
||||
(a, b) => new Date(b.frontmatter.date).valueOf() - new Date(a.frontmatter.date).valueOf()
|
||||
);
|
||||
let firstPage = allPosts.slice(0, 2);
|
||||
// Full Astro Component Syntax:
|
||||
// https://docs.astro.build/core-concepts/astro-components/
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<MainHead {title} {description} image={allPosts[0].frontmatter.image} {canonicalURL} />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<Nav {title} />
|
||||
|
||||
<main class="wrapper">
|
||||
{allPosts.map((post) => (
|
||||
<PostPreview post={post} author={authorData[post.frontmatter.author]} />
|
||||
))}
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<Pagination prevUrl="/posts" nextUrl="/posts/2" />
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
---
|
||||
layout: ../../layouts/post.astro
|
||||
title: Chapter I
|
||||
tag: movie
|
||||
date: 2021-05-17
|
||||
image: /images/chapter-01.jpg
|
||||
author: don
|
||||
description: Which Treats of the Character and Pursuits of the Famous Gentleman Don Quixote of La Mancha
|
||||
---
|
||||
|
||||
In a village of La Mancha, the name of which I have no desire to call to mind, there lived not long since one of those gentlemen that keep a lance in the lance-rack, an old buckler, a lean hack, and a greyhound for coursing. An olla of rather more beef than mutton, a salad on most nights, scraps on Saturdays, lentils on Fridays, and a pigeon or so extra on Sundays, made away with three-quarters of his income. The rest of it went in a doublet of fine cloth and velvet breeches and shoes to match for holidays, while on week-days he made a brave figure in his best homespun. He had in his house a housekeeper past forty, a niece under twenty, and a lad for the field and market-place, who used to saddle the hack as well as handle the bill-hook. The age of this gentleman of ours was bordering on fifty; he was of a hardy habit, spare, gaunt-featured, a very early riser and a great sportsman. They will have it his surname was Quixada or Quesada (for here there is some difference of opinion among the authors who write on the subject), although from reasonable conjectures it seems plain that he was called Quexana. This, however, is of but little importance to our tale; it will be enough not to stray a hair’s breadth from the truth in the telling of it.
|
||||
|
||||
You must know, then, that the above-named gentleman whenever he was at leisure (which was mostly all the year round) gave himself up to reading books of chivalry with such ardour and avidity that he almost entirely neglected the pursuit of his field-sports, and even the management of his property; and to such a pitch did his eagerness and infatuation go that he sold many an acre of tillageland to buy books of chivalry to read, and brought home as many of them as he could get. But of all there were none he liked so well as those of the famous Feliciano de Silva’s composition, for their lucidity of style and complicated conceits were as pearls in his sight, particularly when in his reading he came upon courtships and cartels, where he often found passages like “the reason of the unreason with which my reason is afflicted so weakens my reason that with reason I murmur at your beauty;” or again, “the high heavens, that of your divinity divinely fortify you with the stars, render you deserving of the desert your greatness deserves.” Over conceits of this sort the poor gentleman lost his wits, and used to lie awake striving to understand them and worm the meaning out of them; what Aristotle himself could not have made out or extracted had he come to life again for that special purpose. He was not at all easy about the wounds which Don Belianis gave and took, because it seemed to him that, great as were the surgeons who had cured him, he must have had his face and body covered all over with seams and scars. He commended, however, the author’s way of ending his book with the promise of that interminable adventure, and many a time was he tempted to take up his pen and finish it properly as is there proposed, which no doubt he would have done, and made a successful piece of work of it too, had not greater and more absorbing thoughts prevented him.
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
---
|
||||
layout: ../../layouts/post.astro
|
||||
title: Chapter II
|
||||
tag: movie
|
||||
date: 2021-05-18
|
||||
image: /images/chapter-02.jpg
|
||||
author: sancho
|
||||
description: Which Treats of the First Sally the Ingenious Don Quixote Made From Home
|
||||
---
|
||||
|
||||
These preliminaries settled, he did not care to put off any longer the execution of his design, urged on to it by the thought of all the world was losing by his delay, seeing what wrongs he intended to right, grievances to redress, injustices to repair, abuses to remove, and duties to discharge. So, without giving notice of his intention to anyone, and without anybody seeing him, one morning before the dawning of the day (which was one of the hottest of the month of July) he donned his suit of armour, mounted Rocinante with his patched-up helmet on, braced his buckler, took his lance, and by the back door of the yard sallied forth upon the plain in the highest contentment and satisfaction at seeing with what ease he had made a beginning with his grand purpose. But scarcely did he find himself upon the open plain, when a terrible thought struck him, one all but enough to make him abandon the enterprise at the very outset. It occurred to him that he had not been dubbed a knight, and that according to the law of chivalry he neither could nor ought to bear arms against any knight; and that even if he had been, still he ought, as a novice knight, to wear white armour, without a device upon the shield until by his prowess he had earned one. These reflections made him waver in his purpose, but his craze being stronger than any reasoning, he made up his mind to have himself dubbed a knight by the first one he came across, following the example of others in the same case, as he had read in the books that brought him to this pass. As for white armour, he resolved, on the first opportunity, to scour his until it was whiter than an ermine; and so comforting himself he pursued his way, taking that which his horse chose, for in this he believed lay the essence of adventures.
|
||||
|
||||
Thus setting out, our new-fledged adventurer paced along, talking to himself and saying, “Who knows but that in time to come, when the veracious history of my famous deeds is made known, the sage who writes it, when he has to set forth my first sally in the early morning, will do it after this fashion? ‘Scarce had the rubicund Apollo spread o’er the face of the broad spacious earth the golden threads of his bright hair, scarce had the little birds of painted plumage attuned their notes to hail with dulcet and mellifluous harmony the coming of the rosy Dawn, that, deserting the soft couch of her jealous spouse, was appearing to mortals at the gates and balconies of the Manchegan horizon, when the renowned knight Don Quixote of La Mancha, quitting the lazy down, mounted his celebrated steed Rocinante and began to traverse the ancient and famous Campo de Montiel;’” which in fact he was actually traversing. “Happy the age, happy the time,” he continued, “in which shall be made known my deeds of fame, worthy to be moulded in brass, carved in marble, limned in pictures, for a memorial for ever. And thou, O sage magician, whoever thou art, to whom it shall fall to be the chronicler of this wondrous history, forget not, I entreat thee, my good Rocinante, the constant companion of my ways and wanderings.” Presently he broke out again, as if he were love-stricken in earnest, “O Princess Dulcinea, lady of this captive heart, a grievous wrong hast thou done me to drive me forth with scorn, and with inexorable obduracy banish me from the presence of thy beauty. O lady, deign to hold in remembrance this heart, thy vassal, that thus in anguish pines for love of thee.”
|
||||
|
||||
So he went on stringing together these and other absurdities, all in the style of those his books had taught him, imitating their language as well as he could; and all the while he rode so slowly and the sun mounted so rapidly and with such fervour that it was enough to melt his brains if he had any. Nearly all day he travelled without anything remarkable happening to him, at which he was in despair, for he was anxious to encounter someone at once upon whom to try the might of his strong arm.
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
---
|
||||
layout: ../../layouts/post.astro
|
||||
title: Chapter III
|
||||
tag: movie
|
||||
date: 2021-05-19
|
||||
image: /images/chapter-03.jpg
|
||||
author: don
|
||||
description: Wheren is Related the Droll Way in which Don Quixote Had Himself Dubbed a Knight
|
||||
---
|
||||
|
||||
Harassed by this reflection, he made haste with his scanty pothouse supper, and having finished it called the landlord, and shutting himself into the stable with him, fell on his knees before him, saying, “From this spot I rise not, valiant knight, until your courtesy grants me the boon I seek, one that will redound to your praise and the benefit of the human race.” The landlord, seeing his guest at his feet and hearing a speech of this kind, stood staring at him in bewilderment, not knowing what to do or say, and entreating him to rise, but all to no purpose until he had agreed to grant the boon demanded of him. “I looked for no less, my lord, from your High Magnificence,” replied Don Quixote, “and I have to tell you that the boon I have asked and your liberality has granted is that you shall dub me knight to-morrow morning, and that to-night I shall watch my arms in the chapel of this your castle; thus to-morrow, as I have said, will be accomplished what I so much desire, enabling me lawfully to roam through all the four quarters of the world seeking adventures on behalf of those in distress, as is the duty of chivalry and of knights-errant like myself, whose ambition is directed to such deeds.”
|
||||
|
||||
The landlord, who, as has been mentioned, was something of a wag, and had already some suspicion of his guest’s want of wits, was quite convinced of it on hearing talk of this kind from him, and to make sport for the night he determined to fall in with his humour. So he told him he was quite right in pursuing the object he had in view, and that such a motive was natural and becoming in cavaliers as distinguished as he seemed and his gallant bearing showed him to be; and that he himself in his younger days had followed the same honourable calling, roaming in quest of adventures in various parts of the world, among others the Curing-grounds of Malaga, the Isles of Riaran, the Precinct of Seville, the Little Market of Segovia, the Olivera of Valencia, the Rondilla of Granada, the Strand of San Lucar, the Colt of Cordova, the Taverns of Toledo, and divers other quarters, where he had proved the nimbleness of his feet and the lightness of his fingers, doing many wrongs, cheating many widows, ruining maids and swindling minors, and, in short, bringing himself under the notice of almost every tribunal and court of justice in Spain; until at last he had retired to this castle of his, where he was living upon his property and upon that of others; and where he received all knights-errant of whatever rank or condition they might be, all for the great love he bore them and that they might share their substance with him in return for his benevolence. He told him, moreover, that in this castle of his there was no chapel in which he could watch his armour, as it had been pulled down in order to be rebuilt, but that in a case of necessity it might, he knew, be watched anywhere, and he might watch it that night in a courtyard of the castle, and in the morning, God willing, the requisite ceremonies might be performed so as to have him dubbed a knight, and so thoroughly dubbed that nobody could be more so. He asked if he had any money with him, to which Don Quixote replied that he had not a farthing, as in the histories of knights-errant he had never read of any of them carrying any. On this point the landlord told him he was mistaken; for, though not recorded in the histories, because in the author’s opinion there was no need to mention anything so obvious and necessary as money and clean shirts, it was not to be supposed therefore that they did not carry them, and he might regard it as certain and established that all knights-errant (about whom there were so many full and unimpeachable books) carried well-furnished purses in case of emergency, and likewise carried shirts and a little box of ointment to cure the wounds they received. For in those plains and deserts where they engaged in combat and came out wounded, it was not always that there was someone to cure them, unless indeed they had for a friend some sage magician to succour them at once by fetching through the air upon a cloud some damsel or dwarf with a vial of water of such virtue that by tasting one drop of it they were cured of their hurts and wounds in an instant and left as sound as if they had not received any damage whatever. But in case this should not occur, the knights of old took care to see that their squires were provided with money and other requisites, such as lint and ointments for healing purposes; and when it happened that knights had no squires (which was rarely and seldom the case) they themselves carried everything in cunning saddle-bags that were hardly seen on the horse’s croup, as if it were something else of more importance, because, unless for some such reason, carrying saddle-bags was not very favourably regarded among knights-errant. He therefore advised him (and, as his godson so soon to be, he might even command him) never from that time forth to travel without money and the usual requirements, and he would find the advantage of them when he least expected it.
|
||||
|
|
@ -1,83 +0,0 @@
|
|||
---
|
||||
import MainHead from "../../components/MainHead.astro";
|
||||
import Nav from "../../components/Nav.astro";
|
||||
import PostPreview from "../../components/PostPreview.astro";
|
||||
import Pagination from "../../components/Pagination.astro";
|
||||
import authorData from "../../data/authors.json";
|
||||
|
||||
export async function getStaticPaths({ paginate, rss }) {
|
||||
const allPosts = await Astro.glob("../post/*.md");
|
||||
const sortedPosts = allPosts.sort(
|
||||
(a, b) => new Date(b.frontmatter.date).valueOf() - new Date(a.frontmatter.date).valueOf()
|
||||
);
|
||||
|
||||
// Generate an RSS feed from this collection of posts.
|
||||
// NOTE: This is disabled by default, since it requires `site` to be set in your "astro.config.mjs" file.
|
||||
// rss({
|
||||
// title: 'Don’s Blog',
|
||||
// description: 'An example blog on Astro',
|
||||
// customData: `<language>en-us</language>`,
|
||||
// items: sortedPosts.map(item => ({
|
||||
// title: item.title,
|
||||
// description: item.description,
|
||||
// link: item.url,
|
||||
// pubDate: item.date,
|
||||
// })),
|
||||
// });
|
||||
|
||||
// Return a paginated collection of paths for all posts
|
||||
return paginate(sortedPosts, { pageSize: 1 });
|
||||
}
|
||||
|
||||
// page
|
||||
const title = "Don’s Blog";
|
||||
const description = "An example blog on Astro";
|
||||
const canonicalURL = new URL(Astro.url.pathname, Astro.site);
|
||||
const { page } = Astro.props;
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>{title}</title>
|
||||
<MainHead
|
||||
{title}
|
||||
{description}
|
||||
image={page.data[0].frontmatter.image}
|
||||
canonicalURL={canonicalURL.toString()}
|
||||
prev={page.url.prev}
|
||||
next={page.url.next}
|
||||
/>
|
||||
|
||||
<style lang="scss">
|
||||
.title {
|
||||
font-size: 3em;
|
||||
letter-spacing: -0.04em;
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.count {
|
||||
font-size: 1em;
|
||||
display: block;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<Nav {title} />
|
||||
|
||||
<main class="wrapper">
|
||||
<h2 class="title">All Posts</h2>
|
||||
<small class="count">{page.start + 1}–{page.end + 1} of {page.total}</small>
|
||||
{page.data.map((post) => (
|
||||
<PostPreview post={post} author={authorData[post.frontmatter.author]} />
|
||||
))}
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<Pagination prevUrl={page.url.prev} nextUrl={page.url.next} />
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
body {
|
||||
font-family: 'Spectral', serif;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
p {
|
||||
line-height: 2;
|
||||
}
|
||||
|
||||
a {
|
||||
color: crimson;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
max-width: 60rem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-left: 2rem;
|
||||
padding-right: 2rem;
|
||||
}
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
// Enable top-level await, and other modern ESM features.
|
||||
"target": "ESNext",
|
||||
"module": "ESNext",
|
||||
// Enable node-style module resolution, for things like npm package imports.
|
||||
"moduleResolution": "node",
|
||||
// Enable JSON imports.
|
||||
"resolveJsonModule": true,
|
||||
// Enable stricter transpilation for better output.
|
||||
"isolatedModules": true,
|
||||
// Add type definitions for our Astro runtime.
|
||||
"types": ["astro/client"]
|
||||
}
|
||||
}
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
User-agent: *
|
||||
Disallow: /
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
import { SITE, OPEN_GRAPH } from "../config.ts";
|
||||
import { SITE, OPEN_GRAPH } from "../config";
|
||||
export interface Props {
|
||||
content: any;
|
||||
site: any;
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
---
|
||||
import { getLanguageFromURL, KNOWN_LANGUAGE_CODES } from "../../languages.ts";
|
||||
import * as CONFIG from "../../config.ts";
|
||||
import { getLanguageFromURL, KNOWN_LANGUAGE_CODES } from "../../languages";
|
||||
import * as CONFIG from "../../config";
|
||||
import AstroLogo from "./AstroLogo.astro";
|
||||
import SkipToContent from "./SkipToContent.astro";
|
||||
import SidebarToggle from "./SidebarToggle.tsx";
|
||||
import LanguageSelect from "./LanguageSelect.tsx";
|
||||
import Search from "./Search.tsx";
|
||||
import SidebarToggle from "./SidebarToggle";
|
||||
import LanguageSelect from "./LanguageSelect";
|
||||
import Search from "./Search";
|
||||
|
||||
const { currentPage } = Astro.props;
|
||||
const lang = currentPage && getLanguageFromURL(currentPage);
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
---
|
||||
import { getLanguageFromURL } from "../../languages.ts";
|
||||
import { SIDEBAR } from "../../config.ts";
|
||||
import { getLanguageFromURL } from "../../languages";
|
||||
import { SIDEBAR } from "../../config";
|
||||
const { currentPage } = Astro.props;
|
||||
const currentPageMatch = currentPage.slice(1);
|
||||
const langCode = getLanguageFromURL(currentPage);
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
---
|
||||
import MoreMenu from "../RightSidebar/MoreMenu.astro";
|
||||
import TableOfContents from "../RightSidebar/TableOfContents.tsx";
|
||||
import TableOfContents from "../RightSidebar/TableOfContents";
|
||||
|
||||
const { content, githubEditUrl } = Astro.props;
|
||||
const title = content.title;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
import ThemeToggleButton from "./ThemeToggleButton.tsx";
|
||||
import ThemeToggleButton from "./ThemeToggleButton";
|
||||
import * as CONFIG from "../../config";
|
||||
const { editHref } = Astro.props;
|
||||
const showMoreSection = CONFIG.COMMUNITY_INVITE_URL || editHref;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
import TableOfContents from "./TableOfContents.tsx";
|
||||
import TableOfContents from "./TableOfContents";
|
||||
import MoreMenu from "./MoreMenu.astro";
|
||||
const { content, githubEditUrl } = Astro.props;
|
||||
const headings = content.astro.headings;
|
||||
|
|
|
|||
3
examples/env-vars/src/env.d.ts
vendored
3
examples/env-vars/src/env.d.ts
vendored
|
|
@ -1,5 +1,8 @@
|
|||
/// <reference types="astro/client" />
|
||||
|
||||
// Use this file to type your environment variables!
|
||||
// See https://docs.astro.build/en/guides/environment-variables/#intellisense-for-typescript for more information
|
||||
|
||||
interface ImportMetaEnv {
|
||||
readonly DB_PASSWORD: string;
|
||||
readonly PUBLIC_SOME_KEY: string;
|
||||
|
|
|
|||
4
examples/framework-alpine/.vscode/extensions.json
vendored
Normal file
4
examples/framework-alpine/.vscode/extensions.json
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"recommendations": ["astro-build.astro-vscode"],
|
||||
"unwantedRecommendations": []
|
||||
}
|
||||
11
examples/framework-alpine/.vscode/launch.json
vendored
Normal file
11
examples/framework-alpine/.vscode/launch.json
vendored
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"command": "./node_modules/.bin/astro dev",
|
||||
"name": "Development server",
|
||||
"request": "launch",
|
||||
"type": "node-terminal"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -9,6 +9,7 @@
|
|||
"preview": "astro preview"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/alpinejs": "^3.7.0",
|
||||
"astro": "^1.0.0-rc.6"
|
||||
},
|
||||
"dependencies": {
|
||||
|
|
|
|||
|
|
@ -2,10 +2,14 @@
|
|||
// Full Astro Component Syntax:
|
||||
// https://docs.astro.build/core-concepts/astro-components/
|
||||
|
||||
const { initialCount = 0 } = Astro.props;
|
||||
export interface Props {
|
||||
initialCount?: number;
|
||||
}
|
||||
|
||||
const { initialCount = 0 } = Astro.props as Props;
|
||||
---
|
||||
|
||||
<div class="counter" x-data=`{ count: ${initialCount} }`>
|
||||
<div class="counter" x-data={`{ count: ${initialCount} }`}>
|
||||
<button x-on:click="count--">-</button>
|
||||
<pre x-text="count">{ initialCount }</pre>
|
||||
<button x-on:click="count++">+</button>
|
||||
|
|
@ -23,6 +27,7 @@ const { initialCount = 0 } = Astro.props;
|
|||
margin-top: 2em;
|
||||
place-items: center;
|
||||
}
|
||||
|
||||
.counter-message {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -25,7 +25,6 @@ import Counter from "../components/Counter.astro";
|
|||
<!-- Load AlpineJS on the page -->
|
||||
<script>
|
||||
import Alpine from "alpinejs";
|
||||
window.Alpine = Alpine;
|
||||
Alpine.start();
|
||||
</script>
|
||||
</head>
|
||||
|
|
|
|||
4
examples/framework-lit/.vscode/extensions.json
vendored
Normal file
4
examples/framework-lit/.vscode/extensions.json
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"recommendations": ["astro-build.astro-vscode"],
|
||||
"unwantedRecommendations": []
|
||||
}
|
||||
11
examples/framework-lit/.vscode/launch.json
vendored
Normal file
11
examples/framework-lit/.vscode/launch.json
vendored
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"command": "./node_modules/.bin/astro dev",
|
||||
"name": "Development server",
|
||||
"request": "launch",
|
||||
"type": "node-terminal"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
User-agent: *
|
||||
Disallow: /
|
||||
|
|
@ -2,6 +2,9 @@
|
|||
import Lorem from "../components/Lorem.astro";
|
||||
import { CalcAdd } from "../components/calc-add.js";
|
||||
import { MyCounter } from "../components/my-counter.js";
|
||||
|
||||
// Full Astro Component Syntax:
|
||||
// https://docs.astro.build/core-concepts/astro-components/
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
|
|
|
|||
4
examples/framework-multiple/.vscode/extensions.json
vendored
Normal file
4
examples/framework-multiple/.vscode/extensions.json
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"recommendations": ["astro-build.astro-vscode"],
|
||||
"unwantedRecommendations": []
|
||||
}
|
||||
11
examples/framework-multiple/.vscode/launch.json
vendored
Normal file
11
examples/framework-multiple/.vscode/launch.json
vendored
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"command": "./node_modules/.bin/astro dev",
|
||||
"name": "Development server",
|
||||
"request": "launch",
|
||||
"type": "node-terminal"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -4,9 +4,10 @@ import react from '@astrojs/react';
|
|||
import svelte from '@astrojs/svelte';
|
||||
import vue from '@astrojs/vue';
|
||||
import solid from '@astrojs/solid-js';
|
||||
import lit from '@astrojs/lit';
|
||||
|
||||
// https://astro.build/config
|
||||
export default defineConfig({
|
||||
// Enable many frameworks to support all different kinds of components.
|
||||
integrations: [preact(), react(), svelte(), vue(), solid()],
|
||||
integrations: [preact(), react(), svelte(), vue(), solid(), lit()],
|
||||
});
|
||||
|
|
|
|||
|
|
@ -9,7 +9,6 @@
|
|||
"preview": "astro preview"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@astrojs/lit": "^0.3.2",
|
||||
"@astrojs/preact": "^0.5.2",
|
||||
"@astrojs/react": "^0.4.2",
|
||||
"@astrojs/solid-js": "^0.4.1",
|
||||
|
|
@ -18,8 +17,6 @@
|
|||
"astro": "^1.0.0-rc.6"
|
||||
},
|
||||
"dependencies": {
|
||||
"@webcomponents/template-shadowroot": "^0.1.0",
|
||||
"lit": "^2.2.5",
|
||||
"preact": "^10.7.3",
|
||||
"react": "^18.1.0",
|
||||
"react-dom": "^18.1.0",
|
||||
|
|
|
|||
|
|
@ -1,3 +0,0 @@
|
|||
<div class="children">
|
||||
<h1>Hello Astro (A)</h1>
|
||||
</div>
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
<div class="children">
|
||||
<h1>Hello Astro (B)</h1>
|
||||
</div>
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
import { LitElement, html } from 'lit';
|
||||
|
||||
export const tagName = 'my-counter';
|
||||
|
||||
class Counter extends LitElement {
|
||||
static get properties() {
|
||||
return {
|
||||
count: {
|
||||
type: Number,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
this.count = 0;
|
||||
}
|
||||
|
||||
increment() {
|
||||
this.count++;
|
||||
}
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<div>
|
||||
<p>Count: ${this.count}</p>
|
||||
<button type="button" @click=${this.increment}>Increment</button>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define(tagName, Counter);
|
||||
|
|
@ -1,6 +1,8 @@
|
|||
/** @jsxImportSource preact */
|
||||
|
||||
import { useState } from 'preact/hooks';
|
||||
|
||||
/** a counter written in Preact */
|
||||
/** A counter written with Preact */
|
||||
export function PreactCounter({ children }) {
|
||||
const [count, setCount] = useState(0);
|
||||
const add = () => setCount((i) => i + 1);
|
||||
|
|
|
|||
|
|
@ -1,10 +0,0 @@
|
|||
/** @jsxImportSource preact */
|
||||
|
||||
/** a counter written in Preact */
|
||||
export default function PreactSFC({ children }) {
|
||||
return (
|
||||
<>
|
||||
<div className="counter">Hello from Preact!</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import { useState } from 'react';
|
||||
|
||||
/** a counter written in React */
|
||||
/** A counter written with React */
|
||||
export function Counter({ children }) {
|
||||
const [count, setCount] = useState(0);
|
||||
const add = () => setCount((i) => i + 1);
|
||||
|
|
@ -1,6 +1,8 @@
|
|||
/** @jsxImportSource solid-js */
|
||||
|
||||
import { createSignal } from 'solid-js';
|
||||
|
||||
/** a counter written with Solid */
|
||||
/** A counter written with Solid */
|
||||
export default function SolidCounter({ children }) {
|
||||
const [count, setCount] = createSignal(0);
|
||||
const add = () => setCount(count() + 1);
|
||||
|
|
|
|||
|
|
@ -1,22 +1,23 @@
|
|||
<!-- @component
|
||||
A counter written with Svelte
|
||||
-->
|
||||
<script lang="ts">
|
||||
let count = 0;
|
||||
|
||||
<script>
|
||||
let children;
|
||||
let count = 0;
|
||||
|
||||
function add() {
|
||||
function add() {
|
||||
count += 1;
|
||||
}
|
||||
|
||||
function subtract() {
|
||||
function subtract() {
|
||||
count -= 1;
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="counter">
|
||||
<button on:click={subtract}>-</button>
|
||||
<pre>{ count }</pre>
|
||||
<button on:click={add}>+</button>
|
||||
<button on:click={subtract}>-</button>
|
||||
<pre>{count}</pre>
|
||||
<button on:click={add}>+</button>
|
||||
</div>
|
||||
<div class="counter-message">
|
||||
<slot />
|
||||
<slot />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,10 @@
|
|||
<template>
|
||||
<!--
|
||||
Seeing type errors on the word `class`?
|
||||
This unfortunately happens because @types/react's JSX definitions leak into every file due to being declared globally.
|
||||
There's currently no way to prevent this when using both Vue and React with TypeScript in the same project.
|
||||
You can read more about this issue here: https://github.com/johnsoncodehk/volar/discussions/592
|
||||
-->
|
||||
<div class="counter">
|
||||
<button @click="subtract()">-</button>
|
||||
<pre>{{ count }}</pre>
|
||||
|
|
@ -9,7 +15,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script lang="ts">
|
||||
import { ref } from 'vue';
|
||||
export default {
|
||||
setup() {
|
||||
|
|
|
|||
|
|
@ -1,2 +0,0 @@
|
|||
export { default as A } from './A.astro';
|
||||
export { default as B } from './B.astro';
|
||||
|
|
@ -1,12 +1,13 @@
|
|||
---
|
||||
// Style Imports
|
||||
import "../styles/global.css";
|
||||
|
||||
// Component Imports
|
||||
import { A, B as Renamed } from "../components";
|
||||
import * as react from "../components/ReactCounter.jsx";
|
||||
import { PreactCounter } from "../components/PreactCounter.tsx";
|
||||
import PreactSFC from "../components/PreactSFC.tsx";
|
||||
import SolidCounter from "../components/SolidCounter.tsx";
|
||||
// For JSX components, all the common ways of exporting (under a namespace, specific export, default export etc) are supported!
|
||||
import * as react from "../components/ReactCounter";
|
||||
import { PreactCounter } from "../components/PreactCounter";
|
||||
import SolidCounter from "../components/SolidCounter";
|
||||
|
||||
import VueCounter from "../components/VueCounter.vue";
|
||||
import SvelteCounter from "../components/SvelteCounter.svelte";
|
||||
|
||||
|
|
@ -23,29 +24,24 @@ import SvelteCounter from "../components/SvelteCounter.svelte";
|
|||
<body>
|
||||
<main>
|
||||
<react.Counter client:visible>
|
||||
<h1>Hello React!</h1>
|
||||
<p>What's up?</p>
|
||||
<h1>Hello from React!</h1>
|
||||
</react.Counter>
|
||||
|
||||
<PreactCounter client:visible>
|
||||
<h1>Hello Preact!</h1>
|
||||
<h1>Hello from Preact!</h1>
|
||||
</PreactCounter>
|
||||
|
||||
<SolidCounter client:visible>
|
||||
<h1>Hello Solid!</h1>
|
||||
<h1>Hello from Solid!</h1>
|
||||
</SolidCounter>
|
||||
|
||||
<VueCounter client:visible>
|
||||
<h1>Hello Vue!</h1>
|
||||
<h1>Hello from Vue!</h1>
|
||||
</VueCounter>
|
||||
|
||||
<SvelteCounter client:visible>
|
||||
<h1>Hello Svelte!</h1>
|
||||
<h1>Hello from Svelte!</h1>
|
||||
</SvelteCounter>
|
||||
|
||||
<A />
|
||||
|
||||
<Renamed />
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -3,6 +3,8 @@
|
|||
// Enable top-level await, and other modern ESM features.
|
||||
"target": "ESNext",
|
||||
"module": "ESNext",
|
||||
// Needed for TypeScript intellisense in the template inside Vue files
|
||||
"jsx": "preserve",
|
||||
// Enable node-style module resolution, for things like npm package imports.
|
||||
"moduleResolution": "node",
|
||||
// Enable JSON imports.
|
||||
|
|
|
|||
4
examples/framework-preact/.vscode/extensions.json
vendored
Normal file
4
examples/framework-preact/.vscode/extensions.json
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"recommendations": ["astro-build.astro-vscode"],
|
||||
"unwantedRecommendations": []
|
||||
}
|
||||
11
examples/framework-preact/.vscode/launch.json
vendored
Normal file
11
examples/framework-preact/.vscode/launch.json
vendored
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"command": "./node_modules/.bin/astro dev",
|
||||
"name": "Development server",
|
||||
"request": "launch",
|
||||
"type": "node-terminal"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
---
|
||||
// Component Imports
|
||||
import Counter from "../components/Counter.tsx";
|
||||
import Counter from "../components/Counter";
|
||||
|
||||
// Full Astro Component Syntax:
|
||||
// https://docs.astro.build/core-concepts/astro-components/
|
||||
|
|
|
|||
4
examples/framework-react/.vscode/extensions.json
vendored
Normal file
4
examples/framework-react/.vscode/extensions.json
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"recommendations": ["astro-build.astro-vscode"],
|
||||
"unwantedRecommendations": []
|
||||
}
|
||||
11
examples/framework-react/.vscode/launch.json
vendored
Normal file
11
examples/framework-react/.vscode/launch.json
vendored
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"command": "./node_modules/.bin/astro dev",
|
||||
"name": "Development server",
|
||||
"request": "launch",
|
||||
"type": "node-terminal"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
import React, { useState } from 'react';
|
||||
import { useState } from 'react';
|
||||
import './Counter.css';
|
||||
|
||||
export default function Counter({ children, count: initialCount }) {
|
||||
export default function Counter({ children, count: initialCount }: { children: JSX.Element, count: number }) {
|
||||
const [count, setCount] = useState(initialCount);
|
||||
const add = () => setCount((i) => i + 1);
|
||||
const subtract = () => setCount((i) => i - 1);
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
---
|
||||
// Component Imports
|
||||
import Counter from "../components/Counter.jsx";
|
||||
import Counter from "../components/Counter";
|
||||
const someProps = {
|
||||
count: 0,
|
||||
};
|
||||
|
|
|
|||
4
examples/framework-solid/.vscode/extensions.json
vendored
Normal file
4
examples/framework-solid/.vscode/extensions.json
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"recommendations": ["astro-build.astro-vscode"],
|
||||
"unwantedRecommendations": []
|
||||
}
|
||||
11
examples/framework-solid/.vscode/launch.json
vendored
Normal file
11
examples/framework-solid/.vscode/launch.json
vendored
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"command": "./node_modules/.bin/astro dev",
|
||||
"name": "Development server",
|
||||
"request": "launch",
|
||||
"type": "node-terminal"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,8 +1,12 @@
|
|||
---
|
||||
import Counter from "../components/Counter.jsx";
|
||||
// Component Imports
|
||||
import Counter from "../components/Counter";
|
||||
|
||||
// Full Astro Component Syntax:
|
||||
// https://docs.astro.build/core-concepts/astro-components/
|
||||
---
|
||||
|
||||
<html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
|
|
|
|||
4
examples/framework-svelte/.vscode/extensions.json
vendored
Normal file
4
examples/framework-svelte/.vscode/extensions.json
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"recommendations": ["astro-build.astro-vscode"],
|
||||
"unwantedRecommendations": []
|
||||
}
|
||||
11
examples/framework-svelte/.vscode/launch.json
vendored
Normal file
11
examples/framework-svelte/.vscode/launch.json
vendored
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"command": "./node_modules/.bin/astro dev",
|
||||
"name": "Development server",
|
||||
"request": "launch",
|
||||
"type": "node-terminal"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,33 +1,34 @@
|
|||
<script>
|
||||
let count = 0;
|
||||
<script lang="ts">
|
||||
let count = 0;
|
||||
|
||||
function add() {
|
||||
count += 1;
|
||||
}
|
||||
function add() {
|
||||
count += 1;
|
||||
}
|
||||
|
||||
function subtract() {
|
||||
count -= 1;
|
||||
}
|
||||
function subtract() {
|
||||
count -= 1;
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="counter">
|
||||
<button on:click={subtract}>-</button>
|
||||
<pre>{ count }</pre>
|
||||
<button on:click={add}>+</button>
|
||||
<button on:click={subtract}>-</button>
|
||||
<pre>{count}</pre>
|
||||
<button on:click={add}>+</button>
|
||||
</div>
|
||||
<div class="message">
|
||||
<slot />
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.counter{
|
||||
display: grid;
|
||||
font-size: 2em;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
margin-top: 2em;
|
||||
place-items: center;
|
||||
}
|
||||
.message {
|
||||
text-align: center;
|
||||
}
|
||||
.counter {
|
||||
display: grid;
|
||||
font-size: 2em;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
margin-top: 2em;
|
||||
place-items: center;
|
||||
}
|
||||
|
||||
.message {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
4
examples/framework-vue/.vscode/extensions.json
vendored
Normal file
4
examples/framework-vue/.vscode/extensions.json
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"recommendations": ["astro-build.astro-vscode"],
|
||||
"unwantedRecommendations": []
|
||||
}
|
||||
11
examples/framework-vue/.vscode/launch.json
vendored
Normal file
11
examples/framework-vue/.vscode/launch.json
vendored
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"command": "./node_modules/.bin/astro dev",
|
||||
"name": "Development server",
|
||||
"request": "launch",
|
||||
"type": "node-terminal"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script lang="ts">
|
||||
import { ref } from 'vue';
|
||||
export default {
|
||||
setup() {
|
||||
|
|
@ -34,6 +34,7 @@ export default {
|
|||
margin-top: 2em;
|
||||
place-items: center;
|
||||
}
|
||||
|
||||
.counter-message {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,6 +3,8 @@
|
|||
// Enable top-level await, and other modern ESM features.
|
||||
"target": "ESNext",
|
||||
"module": "ESNext",
|
||||
// Needed for TypeScript intellisense in the template inside Vue files
|
||||
"jsx": "preserve",
|
||||
// Enable node-style module resolution, for things like npm package imports.
|
||||
"moduleResolution": "node",
|
||||
// Enable JSON imports.
|
||||
|
|
|
|||
19
examples/integrations-playground/.gitignore
vendored
19
examples/integrations-playground/.gitignore
vendored
|
|
@ -1,19 +0,0 @@
|
|||
# build output
|
||||
dist/
|
||||
|
||||
# dependencies
|
||||
node_modules/
|
||||
|
||||
# logs
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
|
||||
# environment variables
|
||||
.env
|
||||
.env.production
|
||||
|
||||
# macOS-specific files
|
||||
.DS_Store
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
# Expose Astro dependencies for `pnpm` users
|
||||
shamefully-hoist=true
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"startCommand": "npm start",
|
||||
"env": {
|
||||
"ENABLE_CJS_IMPORTS": true
|
||||
}
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
# Integrations Playground
|
||||
|
||||
```
|
||||
npm init astro -- --template integrations-playground
|
||||
```
|
||||
|
||||
[](https://stackblitz.com/github/withastro/astro/tree/latest/examples/integrations-playground)
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
import { defineConfig } from 'astro/config';
|
||||
import lit from '@astrojs/lit';
|
||||
import react from '@astrojs/react';
|
||||
import tailwind from '@astrojs/tailwind';
|
||||
import turbolinks from '@astrojs/turbolinks';
|
||||
import sitemap from '@astrojs/sitemap';
|
||||
import partytown from '@astrojs/partytown';
|
||||
import solid from '@astrojs/solid-js';
|
||||
|
||||
// https://astro.build/config
|
||||
export default defineConfig({
|
||||
site: 'https://example.com',
|
||||
integrations: [lit(), react(), tailwind(), turbolinks(), partytown(), sitemap(), solid()],
|
||||
});
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
{
|
||||
"name": "@example/integrations-playground",
|
||||
"version": "0.0.1",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "astro dev",
|
||||
"start": "astro dev",
|
||||
"build": "astro build",
|
||||
"preview": "astro preview"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@astrojs/lit": "^0.3.2",
|
||||
"@astrojs/partytown": "^0.1.9",
|
||||
"@astrojs/react": "^0.4.2",
|
||||
"@astrojs/sitemap": "^0.3.0",
|
||||
"@astrojs/solid-js": "0.4.1",
|
||||
"@astrojs/tailwind": "^0.2.5",
|
||||
"@astrojs/turbolinks": "^0.1.4",
|
||||
"astro": "^1.0.0-rc.6",
|
||||
"solid-js": "^1.4.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"@webcomponents/template-shadowroot": "^0.1.0",
|
||||
"lit": "^2.2.5",
|
||||
"preact": "^10.7.3",
|
||||
"react": "^18.1.0",
|
||||
"react-dom": "^18.1.0",
|
||||
"svelte": "^3.48.0",
|
||||
"vue": "^3.2.37"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
<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>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
|
|
@ -1,2 +0,0 @@
|
|||
User-agent: *
|
||||
Disallow: /
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
{
|
||||
"infiniteLoopProtection": true,
|
||||
"hardReloadOnChange": false,
|
||||
"view": "browser",
|
||||
"template": "node",
|
||||
"container": {
|
||||
"port": 3000,
|
||||
"startScript": "start",
|
||||
"node": "14"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
/* jsxImportSource: react */
|
||||
import React from 'react';
|
||||
|
||||
export default function Link({ to, text }) {
|
||||
return <a href={to}>{text}</a>;
|
||||
}
|
||||
|
|
@ -1,115 +0,0 @@
|
|||
---
|
||||
//hey
|
||||
---
|
||||
|
||||
<style>
|
||||
p {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi quam arcu, rhoncus et dui at,
|
||||
volutpat viverra augue. Suspendisse placerat libero tellus, ut consequat ligula rutrum id.
|
||||
Vestibulum lectus libero, viverra in lacus eget, porttitor tincidunt leo. Integer sit amet turpis
|
||||
et felis fringilla lacinia in id nibh. Proin vitae dapibus odio. Mauris ornare eget urna id
|
||||
volutpat. Duis tellus nisi, hendrerit id sodales in, rutrum a quam. Proin tempor velit turpis, et
|
||||
tempor lacus sagittis in. Sed congue mauris quis nibh posuere, nec semper lacus auctor. Morbi sit
|
||||
amet enim sit amet arcu ullamcorper sollicitudin. Donec dignissim posuere tincidunt. Donec
|
||||
ultrices quam nec orci venenatis suscipit. Maecenas sapien quam, pretium sit amet ullamcorper at,
|
||||
vulputate sit amet urna. Suspendisse potenti. Integer in sapien turpis. Nulla accumsan viverra
|
||||
diam, quis convallis magna finibus eget. Integer sed eros bibendum, consequat velit sit amet,
|
||||
tincidunt orci. Mauris varius id metus in fringilla. Vestibulum dignissim massa eget erat luctus,
|
||||
ac congue mauris pellentesque. In et tempor dolor. Cras blandit congue lorem at facilisis. Aenean
|
||||
vel lacinia quam. Pellentesque luctus metus ut scelerisque efficitur. Mauris laoreet sodales
|
||||
libero eget luctus. Proin at congue dui, a cursus risus. Pellentesque lorem sem, rhoncus fermentum
|
||||
arcu ut, euismod fermentum ligula. Nullam eu orci posuere, laoreet leo in, commodo dolor. Fusce at
|
||||
felis elementum, commodo justo at, placerat justo. Nam feugiat scelerisque arcu, ut fermentum
|
||||
tellus elementum in. Sed ut vulputate ante. Morbi cursus arcu quis odio convallis egestas. Donec
|
||||
vulputate vestibulum dolor eget tristique. Nullam tempor semper augue, vitae lobortis neque tempor
|
||||
ac. Pellentesque massa leo, congue id ligula auctor, sollicitudin pharetra lorem. Curabitur a
|
||||
lacus porttitor, venenatis est quis, mattis velit. Fusce hendrerit lobortis mi ac efficitur.
|
||||
Mauris ornare, lorem sed varius faucibus, nisi dui pretium urna, sit amet lacinia nibh ligula in
|
||||
ipsum. Phasellus gravida, metus eget ornare ultrices, dolor ipsum consectetur erat, ac aliquet
|
||||
eros metus sed lectus. Nullam eleifend posuere rhoncus. Curabitur semper ligula vel ante posuere,
|
||||
at blandit orci accumsan. Vivamus accumsan metus in lorem laoreet, a luctus arcu tempus. Donec
|
||||
posuere sollicitudin nulla at vulputate. Nulla condimentum imperdiet purus, et lobortis ligula
|
||||
iaculis in. Donec suscipit viverra neque, ut elementum eros lacinia ut. Fusce at odio enim. Donec
|
||||
rutrum lectus sit amet est auctor, ac rhoncus lorem imperdiet. Curabitur commodo ex est, non
|
||||
tempus massa pulvinar nec. Sed fermentum, lectus eget ultricies luctus, enim sem sodales quam, sed
|
||||
laoreet tortor sem feugiat nisi. Morbi molestie vehicula viverra. Integer accumsan mi in orci
|
||||
ultrices posuere. Integer mi quam, faucibus et aliquet imperdiet, ornare ac ex. Nunc mattis
|
||||
molestie nisi, eu venenatis nibh vehicula at. Aliquam ut elit consectetur, finibus lorem sed,
|
||||
condimentum sapien. Praesent fermentum iaculis orci, vitae tincidunt est viverra nec. Morbi semper
|
||||
turpis sed lectus ornare tristique. Sed congue dui ex. Maecenas orci ligula, imperdiet sit amet
|
||||
accumsan et, finibus a velit. Ut vitae blandit eros. Nam gravida nec ipsum non volutpat. Integer
|
||||
quam metus, porttitor id ante sed, rutrum porta quam. Aenean at mattis ante. Morbi id libero eget
|
||||
risus sagittis gravida. Proin consequat sapien a dignissim posuere. Ut luctus sed metus ut
|
||||
elementum. Mauris tincidunt condimentum risus at bibendum. Aenean a sapien justo. Morbi vel neque
|
||||
in eros venenatis scelerisque vitae nec justo. Vestibulum lacinia, dui eu sollicitudin ornare, est
|
||||
elit vestibulum arcu, nec ultrices augue turpis in massa. Duis commodo lectus sed est posuere, et
|
||||
mollis nisi dapibus. Sed id ultrices arcu. Praesent tempor sodales aliquet. Donec suscipit ipsum
|
||||
eu odio cursus, quis sodales metus sodales. Nunc vestibulum massa at felis ullamcorper cursus.
|
||||
Pellentesque facilisis ante ut lectus vulputate vestibulum. Nullam pharetra felis ac lacus
|
||||
sodales, vel suscipit metus faucibus. Donec facilisis imperdiet risus, in volutpat odio tincidunt
|
||||
a. Aliquam vitae leo lorem. Proin scelerisque efficitur velit, vel cursus ipsum accumsan id. Morbi
|
||||
nibh nulla, pretium quis venenatis et, pharetra et sapien. Cras lobortis, massa sit amet blandit
|
||||
pulvinar, mi magna condimentum ex, quis commodo ipsum est quis metus. Maecenas pulvinar, leo sit
|
||||
amet congue pulvinar, neque magna ultrices mi, et rhoncus massa sapien quis libero. Etiam a nunc
|
||||
et ipsum faucibus pretium. Nulla facilisi. Nunc nec dolor velit. In semper semper mi non
|
||||
condimentum. Pellentesque vehicula volutpat odio, a semper sem porta a. In sit amet lectus rutrum,
|
||||
sollicitudin augue auctor, maximus quam. Mauris congue, nisl non fermentum iaculis, leo erat
|
||||
interdum lorem, quis bibendum arcu eros et elit. Fusce tortor ante, gravida a arcu in, lacinia
|
||||
finibus ante. Phasellus facilisis lectus vitae sapien feugiat laoreet. Curabitur ultricies libero
|
||||
sit amet condimentum suscipit. Duis at vestibulum mi. Suspendisse at neque augue. Duis ornare a
|
||||
mauris id efficitur. Suspendisse in dui nec dolor dignissim venenatis. Curabitur a magna turpis.
|
||||
Aliquam at commodo tellus. In id sem interdum, suscipit felis at, mattis velit. Proin accumsan
|
||||
sodales felis a lacinia. Curabitur at magna a massa varius maximus. Vestibulum in auctor ante.
|
||||
Donec aliquam tortor sed nulla rutrum, et egestas mi efficitur. Sed viverra quam tellus, quis
|
||||
vulputate felis ultrices sed. Mauris sagittis, neque quis laoreet gravida, nisi est ultrices mi,
|
||||
at tempus nunc justo non dui. Suspendisse porttitor tortor nulla, eget luctus quam finibus id.
|
||||
Proin sodales eros mollis tellus euismod luctus a eu mi. Quisque consectetur iaculis nibh, at
|
||||
mollis tellus volutpat eu. Aenean a nulla vel lectus rhoncus aliquam. Donec vitae lacinia neque.
|
||||
Donec non lectus eget sem finibus ultrices vel nec felis. Proin fringilla mi a leo rhoncus aliquam
|
||||
sit amet quis augue. Duis congue ligula at est suscipit fringilla. Proin aliquam erat ut consequat
|
||||
dapibus. Suspendisse non nisi orci. Donec ac erat vel libero egestas laoreet. Nullam felis odio,
|
||||
tincidunt eget eleifend a, porttitor eu nisi. Suspendisse tristique eros at dolor scelerisque
|
||||
hendrerit. Etiam id dignissim lectus. Fusce lacinia metus eu risus placerat, et eleifend nunc
|
||||
ultrices. Ut gravida a dui sed volutpat. Sed semper quis erat sed ornare. Pellentesque sapien sem,
|
||||
fermentum vel nunc at, auctor posuere nisl. Maecenas aliquet lobortis leo. Vivamus tellus urna,
|
||||
dignissim consectetur sapien vitae, hendrerit varius sem. Nunc dictum tristique fermentum. Duis eu
|
||||
suscipit odio. Curabitur quis egestas neque. Fusce eu fringilla orci, vitae euismod sapien. Donec
|
||||
sit amet iaculis urna. Phasellus maximus nisl in libero bibendum volutpat. Nulla at vehicula
|
||||
lorem. Phasellus varius, elit ac suscipit pretium, turpis ipsum porttitor lectus, vitae
|
||||
ullamcorper orci velit ut ligula. Proin mollis, orci vel commodo auctor, sapien ipsum vulputate
|
||||
enim, sit amet aliquam nulla sapien ut sapien. Proin tincidunt ex non massa aliquet, quis aliquam
|
||||
nulla egestas. Maecenas mollis turpis dapibus, dignissim lectus tincidunt, egestas ligula.
|
||||
Suspendisse in lobortis purus. Sed tellus tellus, mollis eget tempor sed, interdum ut lectus.
|
||||
Nulla sed ex efficitur, porta dui cursus, tristique elit. Maecenas tincidunt tortor vitae massa
|
||||
laoreet ultricies. Mauris ac elit vitae orci eleifend ornare non eu ligula. Curabitur venenatis
|
||||
nulla ut neque tristique, non tincidunt justo pretium. Suspendisse mattis semper dui, eget
|
||||
vestibulum risus elementum sed. In consequat nisi sit amet nulla euismod, at convallis tortor
|
||||
tincidunt. Aliquam hendrerit venenatis risus in interdum. Duis ullamcorper imperdiet elit sit amet
|
||||
blandit. Mauris placerat lacinia velit id pharetra. Nam nec iaculis dui. Etiam odio mi, fringilla
|
||||
in rutrum in, viverra quis tellus. Aliquam egestas mauris id nisi facilisis, in laoreet nibh
|
||||
malesuada. Ut eu dui laoreet, venenatis tellus ac, feugiat mauris. Nunc in velit laoreet,
|
||||
venenatis tellus quis, blandit dolor. Nulla ultrices et neque id placerat. Nulla eu interdum
|
||||
nulla. Aliquam molestie enim quis rutrum finibus. Nulla bibendum orci vel scelerisque posuere.
|
||||
Praesent quis magna molestie, luctus tortor tincidunt, gravida neque. Quisque et ligula eget magna
|
||||
viverra interdum at a sapien. Mauris ornare efficitur nunc sed vulputate. Praesent laoreet mollis
|
||||
tincidunt. Vestibulum id arcu vulputate, eleifend enim vel, accumsan turpis. Morbi faucibus
|
||||
convallis tellus, semper laoreet justo lacinia nec. Sed sodales ligula consectetur dui rhoncus, et
|
||||
convallis metus accumsan. Sed ullamcorper non ex sit amet ultricies. Donec finibus nulla nec
|
||||
blandit porttitor. Etiam aliquam quis leo a imperdiet. Cras at lobortis est. In convallis semper
|
||||
enim, ac porta ligula fringilla at. Donec augue est, facilisis et odio sit amet, viverra
|
||||
ullamcorper nisl. Ut porta velit nec sem lacinia, sit amet mollis magna auctor. Nulla lobortis
|
||||
lacinia mauris nec sagittis. Suspendisse rutrum ex vel nisi interdum hendrerit et ut purus. Sed
|
||||
consectetur sodales nibh eget tempus. Aenean egestas luctus viverra. Integer fermentum tincidunt
|
||||
tellus, nec rhoncus velit hendrerit vitae. Proin quis neque porttitor, scelerisque risus gravida,
|
||||
volutpat sem. Fusce nec ex rhoncus, tempor libero nec, pellentesque ex. Integer quis iaculis
|
||||
purus. Nullam vitae imperdiet orci. Sed sit amet eros condimentum, scelerisque turpis facilisis,
|
||||
dignissim ante. Proin quis tristique lacus, sed sagittis nisl. Cras pharetra ultrices purus, sed
|
||||
ullamcorper nisi fringilla eu. Praesent risus turpis, auctor in fringilla a, fringilla eu dolor.
|
||||
Phasellus auctor tristique enim, eleifend molestie diam venenatis ut. Mauris dapibus, enim eget
|
||||
pharetra semper, nulla dui porttitor mi, auctor hendrerit augue nulla quis urna. Aliquam in cursus
|
||||
justo.
|
||||
</p>
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
import { createSignal } from 'solid-js';
|
||||
|
||||
export default function Counter(props) {
|
||||
const [count, setCount] = createSignal(0);
|
||||
const add = () => setCount(count() + 1);
|
||||
const subtract = () => setCount(count() - 1);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div class="counter">
|
||||
<button onClick={subtract}>-</button>
|
||||
<pre>{count()}</pre>
|
||||
<button onClick={add}>+</button>
|
||||
</div>
|
||||
<div class="counter-message">{props.children}</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
import { LitElement, html } from 'lit';
|
||||
|
||||
export class CalcAdd extends LitElement {
|
||||
static get properties() {
|
||||
return {
|
||||
num: {
|
||||
type: Number,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
return html` <div>Number: ${this.num}</div> `;
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define('calc-add', CalcAdd);
|
||||
|
|
@ -1,32 +0,0 @@
|
|||
import { LitElement, html } from 'lit';
|
||||
|
||||
export class MyCounter extends LitElement {
|
||||
static get properties() {
|
||||
return {
|
||||
count: {
|
||||
type: Number,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
this.count = 0;
|
||||
}
|
||||
|
||||
increment() {
|
||||
this.count++;
|
||||
}
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<div>
|
||||
<p>Count: ${this.count}</p>
|
||||
|
||||
<button type="button" @click=${this.increment}>Increment</button>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define('my-counter', MyCounter);
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
---
|
||||
// Page 2!
|
||||
import Link from "../components/Link.jsx";
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
|
||||
<title>Demo: Page 2</title>
|
||||
</head>
|
||||
<body>
|
||||
<Link to="/" text="Go Home" />
|
||||
</body>
|
||||
</html>
|
||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Reference in a new issue