summaryrefslogtreecommitdiff
path: root/examples
diff options
context:
space:
mode:
authorGravatar Princesseuh <Princesseuh@users.noreply.github.com> 2022-11-08 18:39:22 +0000
committerGravatar fredkbot <fred+astrobot@astro.build> 2022-11-08 18:39:22 +0000
commitdcdeca56acb6c03d4868ece51ef4611e7598e270 (patch)
treef8731cc4f82f335c00a4a9a7f4b573d277b84a3e /examples
parent0dcdc6fb1e6160c8a225a65c4810f565e2b673b5 (diff)
downloadastro-dcdeca56acb6c03d4868ece51ef4611e7598e270.tar.gz
astro-dcdeca56acb6c03d4868ece51ef4611e7598e270.tar.zst
astro-dcdeca56acb6c03d4868ece51ef4611e7598e270.zip
[ci] format
Diffstat (limited to 'examples')
-rw-r--r--examples/blog/src/layouts/BlogPost.astro12
-rw-r--r--examples/blog/src/pages/blog.astro26
-rw-r--r--examples/docs/src/components/Footer/AvatarList.astro44
-rw-r--r--examples/docs/src/components/HeadCommon.astro4
-rw-r--r--examples/docs/src/components/LeftSidebar/LeftSidebar.astro40
-rw-r--r--examples/docs/src/components/RightSidebar/MoreMenu.astro100
-rw-r--r--examples/framework-lit/src/pages/index.astro10
-rw-r--r--examples/hackernews/src/components/Comment.astro2
-rw-r--r--examples/hackernews/src/components/For.astro16
-rw-r--r--examples/hackernews/src/components/Nav.astro12
-rw-r--r--examples/hackernews/src/pages/users/[id].astro2
-rw-r--r--examples/portfolio/src/components/PortfolioPreview.astro12
-rw-r--r--examples/ssr/src/components/ProductListing.astro28
-rw-r--r--examples/ssr/src/components/TextDecorationSkip.astro14
-rw-r--r--examples/ssr/src/pages/cart.astro14
-rw-r--r--examples/with-vite-plugin-pwa/src/pages/index.astro4
16 files changed, 182 insertions, 158 deletions
diff --git a/examples/blog/src/layouts/BlogPost.astro b/examples/blog/src/layouts/BlogPost.astro
index 67f297444..4baf8e972 100644
--- a/examples/blog/src/layouts/BlogPost.astro
+++ b/examples/blog/src/layouts/BlogPost.astro
@@ -40,11 +40,13 @@ const {
{heroImage && <img width={720} height={360} src={heroImage} alt="" />}
<h1 class="title">{title}</h1>
{pubDate && <time>{pubDate}</time>}
- {updatedDate && (
- <div>
- Last updated on <time>{updatedDate}</time>
- </div>
- )}
+ {
+ updatedDate && (
+ <div>
+ Last updated on <time>{updatedDate}</time>
+ </div>
+ )
+ }
<hr />
<slot />
</article>
diff --git a/examples/blog/src/pages/blog.astro b/examples/blog/src/pages/blog.astro
index c50cc0528..cedf505b0 100644
--- a/examples/blog/src/pages/blog.astro
+++ b/examples/blog/src/pages/blog.astro
@@ -37,18 +37,20 @@ const posts = (await Astro.glob('./blog/*.{md,mdx}')).sort(
<main>
<section>
<ul>
- {posts.map((post) => (
- <li>
- <time datetime={post.frontmatter.pubDate}>
- {new Date(post.frontmatter.pubDate).toLocaleDateString('en-us', {
- year: 'numeric',
- month: 'short',
- day: 'numeric',
- })}
- </time>
- <a href={post.url}>{post.frontmatter.title}</a>
- </li>
- ))}
+ {
+ posts.map((post) => (
+ <li>
+ <time datetime={post.frontmatter.pubDate}>
+ {new Date(post.frontmatter.pubDate).toLocaleDateString('en-us', {
+ year: 'numeric',
+ month: 'short',
+ day: 'numeric',
+ })}
+ </time>
+ <a href={post.url}>{post.frontmatter.title}</a>
+ </li>
+ ))
+ }
</ul>
</section>
</main>
diff --git a/examples/docs/src/components/Footer/AvatarList.astro b/examples/docs/src/components/Footer/AvatarList.astro
index 5926936d6..b75589f5a 100644
--- a/examples/docs/src/components/Footer/AvatarList.astro
+++ b/examples/docs/src/components/Footer/AvatarList.astro
@@ -72,27 +72,31 @@ const additionalContributors = unique.length - recentContributors.length; // lis
<!-- Thanks to @5t3ph for https://smolcss.dev/#smol-avatar-list! -->
<div class="contributors">
<ul class="avatar-list" style={`--avatar-count: ${recentContributors.length}`}>
- {recentContributors.map((item) => (
- <li>
- <a href={`https://github.com/${item.login}`}>
- <img
- alt={`Contributor ${item.login}`}
- title={`Contributor ${item.login}`}
- width="64"
- height="64"
- src={`https://avatars.githubusercontent.com/u/${item.id}`}
- />
- </a>
- </li>
- ))}
+ {
+ recentContributors.map((item) => (
+ <li>
+ <a href={`https://github.com/${item.login}`}>
+ <img
+ alt={`Contributor ${item.login}`}
+ title={`Contributor ${item.login}`}
+ width="64"
+ height="64"
+ src={`https://avatars.githubusercontent.com/u/${item.id}`}
+ />
+ </a>
+ </li>
+ ))
+ }
</ul>
- {additionalContributors > 0 && (
- <span>
- <a href={commitsURL}>{`and ${additionalContributors} additional contributor${
- additionalContributors > 1 ? 's' : ''
- }.`}</a>
- </span>
- )}
+ {
+ additionalContributors > 0 && (
+ <span>
+ <a href={commitsURL}>{`and ${additionalContributors} additional contributor${
+ additionalContributors > 1 ? 's' : ''
+ }.`}</a>
+ </span>
+ )
+ }
{unique.length === 0 && <a href={commitsURL}>Contributors</a>}
</div>
diff --git a/examples/docs/src/components/HeadCommon.astro b/examples/docs/src/components/HeadCommon.astro
index 3551e5489..d77e4a90c 100644
--- a/examples/docs/src/components/HeadCommon.astro
+++ b/examples/docs/src/components/HeadCommon.astro
@@ -21,9 +21,7 @@ import '../styles/index.css';
/>
<!-- Scrollable a11y code helper -->
-<script src="/make-scrollable-code-focusable.js" is:inline>
-
-</script>
+<script src="/make-scrollable-code-focusable.js" is:inline></script>
<!-- This is intentionally inlined to avoid FOUC -->
<script is:inline>
diff --git a/examples/docs/src/components/LeftSidebar/LeftSidebar.astro b/examples/docs/src/components/LeftSidebar/LeftSidebar.astro
index 33af79463..33433f5be 100644
--- a/examples/docs/src/components/LeftSidebar/LeftSidebar.astro
+++ b/examples/docs/src/components/LeftSidebar/LeftSidebar.astro
@@ -16,25 +16,27 @@ const sidebar = SIDEBAR[langCode];
<nav aria-labelledby="grid-left">
<ul class="nav-groups">
- {Object.entries(sidebar).map(([header, children]) => (
- <li>
- <div class="nav-group">
- <h2>{header}</h2>
- <ul>
- {children.map((child) => {
- const url = Astro.site?.pathname + child.link;
- return (
- <li class="nav-link">
- <a href={url} aria-current={currentPageMatch === child.link ? 'page' : false}>
- {child.text}
- </a>
- </li>
- );
- })}
- </ul>
- </div>
- </li>
- ))}
+ {
+ Object.entries(sidebar).map(([header, children]) => (
+ <li>
+ <div class="nav-group">
+ <h2>{header}</h2>
+ <ul>
+ {children.map((child) => {
+ const url = Astro.site?.pathname + child.link;
+ return (
+ <li class="nav-link">
+ <a href={url} aria-current={currentPageMatch === child.link ? 'page' : false}>
+ {child.text}
+ </a>
+ </li>
+ );
+ })}
+ </ul>
+ </div>
+ </li>
+ ))
+ }
</ul>
</nav>
diff --git a/examples/docs/src/components/RightSidebar/MoreMenu.astro b/examples/docs/src/components/RightSidebar/MoreMenu.astro
index 8fcbfa567..655f8eac1 100644
--- a/examples/docs/src/components/RightSidebar/MoreMenu.astro
+++ b/examples/docs/src/components/RightSidebar/MoreMenu.astro
@@ -12,54 +12,58 @@ const showMoreSection = CONFIG.COMMUNITY_INVITE_URL;
{showMoreSection && <h2 class="heading">More</h2>}
<ul>
- {editHref && (
- <li class={`heading-link depth-2`}>
- <a class="edit-on-github" href={editHref} target="_blank">
- <svg
- aria-hidden="true"
- focusable="false"
- data-prefix="fas"
- data-icon="pen"
- class="svg-inline--fa fa-pen fa-w-16"
- role="img"
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 512 512"
- height="1em"
- width="1em"
- >
- <path
- fill="currentColor"
- d="M290.74 93.24l128.02 128.02-277.99 277.99-114.14 12.6C11.35 513.54-1.56 500.62.14 485.34l12.7-114.22 277.9-277.88zm207.2-19.06l-60.11-60.11c-18.75-18.75-49.16-18.75-67.91 0l-56.55 56.55 128.02 128.02 56.55-56.55c18.75-18.76 18.75-49.16 0-67.91z"
- />
- </svg>
- <span>Edit this page</span>
- </a>
- </li>
- )}
- {CONFIG.COMMUNITY_INVITE_URL && (
- <li class={`heading-link depth-2`}>
- <a href={CONFIG.COMMUNITY_INVITE_URL} target="_blank">
- <svg
- aria-hidden="true"
- focusable="false"
- data-prefix="fas"
- data-icon="comment-alt"
- class="svg-inline--fa fa-comment-alt fa-w-16"
- role="img"
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 512 512"
- height="1em"
- width="1em"
- >
- <path
- fill="currentColor"
- d="M448 0H64C28.7 0 0 28.7 0 64v288c0 35.3 28.7 64 64 64h96v84c0 9.8 11.2 15.5 19.1 9.7L304 416h144c35.3 0 64-28.7 64-64V64c0-35.3-28.7-64-64-64z"
- />
- </svg>
- <span>Join our community</span>
- </a>
- </li>
- )}
+ {
+ editHref && (
+ <li class={`heading-link depth-2`}>
+ <a class="edit-on-github" href={editHref} target="_blank">
+ <svg
+ aria-hidden="true"
+ focusable="false"
+ data-prefix="fas"
+ data-icon="pen"
+ class="svg-inline--fa fa-pen fa-w-16"
+ role="img"
+ xmlns="http://www.w3.org/2000/svg"
+ viewBox="0 0 512 512"
+ height="1em"
+ width="1em"
+ >
+ <path
+ fill="currentColor"
+ d="M290.74 93.24l128.02 128.02-277.99 277.99-114.14 12.6C11.35 513.54-1.56 500.62.14 485.34l12.7-114.22 277.9-277.88zm207.2-19.06l-60.11-60.11c-18.75-18.75-49.16-18.75-67.91 0l-56.55 56.55 128.02 128.02 56.55-56.55c18.75-18.76 18.75-49.16 0-67.91z"
+ />
+ </svg>
+ <span>Edit this page</span>
+ </a>
+ </li>
+ )
+ }
+ {
+ CONFIG.COMMUNITY_INVITE_URL && (
+ <li class={`heading-link depth-2`}>
+ <a href={CONFIG.COMMUNITY_INVITE_URL} target="_blank">
+ <svg
+ aria-hidden="true"
+ focusable="false"
+ data-prefix="fas"
+ data-icon="comment-alt"
+ class="svg-inline--fa fa-comment-alt fa-w-16"
+ role="img"
+ xmlns="http://www.w3.org/2000/svg"
+ viewBox="0 0 512 512"
+ height="1em"
+ width="1em"
+ >
+ <path
+ fill="currentColor"
+ d="M448 0H64C28.7 0 0 28.7 0 64v288c0 35.3 28.7 64 64 64h96v84c0 9.8 11.2 15.5 19.1 9.7L304 416h144c35.3 0 64-28.7 64-64V64c0-35.3-28.7-64-64-64z"
+ />
+ </svg>
+ <span>Join our community</span>
+ </a>
+ </li>
+ )
+ }
</ul>
<div style="margin: 2rem 0; text-align: center;">
<ThemeToggleButton client:visible />
diff --git a/examples/framework-lit/src/pages/index.astro b/examples/framework-lit/src/pages/index.astro
index d193842a0..55d051cc0 100644
--- a/examples/framework-lit/src/pages/index.astro
+++ b/examples/framework-lit/src/pages/index.astro
@@ -20,10 +20,12 @@ import { MyCounter } from '../components/my-counter.js';
<MyCounter client:load />
<Lorem />
- {/**
- * Our VS Code extension does not currently properly typecheck attributes on Lit components
- * As such, the following code will result in a TypeScript error inside the editor, nonetheless, it works in Astro!
- * @ts-expect-error */}
+ {
+ /**
+ * Our VS Code extension does not currently properly typecheck attributes on Lit components
+ * As such, the following code will result in a TypeScript error inside the editor, nonetheless, it works in Astro!
+ * @ts-expect-error */
+ }
<CalcAdd num={0} />
</body>
</html>
diff --git a/examples/hackernews/src/components/Comment.astro b/examples/hackernews/src/components/Comment.astro
index 50fa3e9e4..8327e666c 100644
--- a/examples/hackernews/src/components/Comment.astro
+++ b/examples/hackernews/src/components/Comment.astro
@@ -16,7 +16,7 @@ const { comment } = Astro.props;
<a href={`/users/${comment.user}`}>{comment.user}</a>{' '}
{comment.time_ago} ago
</div>
- <div class="text" set:html={comment.content}></div>
+ <div class="text" set:html={comment.content} />
<Show when={comment.comments.length}>
<Toggle open>
<For each={comment.comments}>{(comment: IComment) => <Astro.self comment={comment} />}</For>
diff --git a/examples/hackernews/src/components/For.astro b/examples/hackernews/src/components/For.astro
index b784f8f8a..885c22a65 100644
--- a/examples/hackernews/src/components/For.astro
+++ b/examples/hackernews/src/components/For.astro
@@ -8,13 +8,15 @@ export interface Props<T> {
const { each } = Astro.props;
---
-{(async function* () {
- for await (const value of each) {
- let html = await Astro.slots.render('default', [value]);
- yield <Fragment set:html={html} />;
- yield '\n';
- }
-})()}
+{
+ (async function* () {
+ for await (const value of each) {
+ let html = await Astro.slots.render('default', [value]);
+ yield <Fragment set:html={html} />;
+ yield '\n';
+ }
+ })()
+}
<Show when={!each.length}>
<slot name="fallback" />
diff --git a/examples/hackernews/src/components/Nav.astro b/examples/hackernews/src/components/Nav.astro
index 10bf0f899..7eeba2865 100644
--- a/examples/hackernews/src/components/Nav.astro
+++ b/examples/hackernews/src/components/Nav.astro
@@ -15,11 +15,13 @@ const links: Link[] = [
<header>
<nav aria-label="Main menu">
- {links.map(({ href, text }) => (
- <a href={href} aria-current={href === Astro.url.pathname ? 'page' : undefined}>
- <strong>{text}</strong>
- </a>
- ))}
+ {
+ links.map(({ href, text }) => (
+ <a href={href} aria-current={href === Astro.url.pathname ? 'page' : undefined}>
+ <strong>{text}</strong>
+ </a>
+ ))
+ }
<a class="github" href="http://github.com/withastro/astro" target="_blank" rel="noreferrer">
Built with Astro
</a>
diff --git a/examples/hackernews/src/pages/users/[id].astro b/examples/hackernews/src/pages/users/[id].astro
index 9b43c6958..e56085992 100644
--- a/examples/hackernews/src/pages/users/[id].astro
+++ b/examples/hackernews/src/pages/users/[id].astro
@@ -25,7 +25,7 @@ const user = (await fetchAPI(`user/${id}`)) as IUser;
{user.karma}
</li>
<Show when={user.about}>
- <li set:html={user.about} class="about"></li>{' '}
+ <li set:html={user.about} class="about" />{' '}
</Show>
</ul>
<p>
diff --git a/examples/portfolio/src/components/PortfolioPreview.astro b/examples/portfolio/src/components/PortfolioPreview.astro
index 4a4b55e7d..4dafd0e6a 100644
--- a/examples/portfolio/src/components/PortfolioPreview.astro
+++ b/examples/portfolio/src/components/PortfolioPreview.astro
@@ -17,11 +17,13 @@ const { frontmatter, url } = Astro.props.project;
<p class="desc">{frontmatter.description}</p>
<div class="tags">
Tagged:
- {frontmatter.tags.map((t) => (
- <div class="tag" data-tag={t}>
- {t}
- </div>
- ))}
+ {
+ frontmatter.tags.map((t) => (
+ <div class="tag" data-tag={t}>
+ {t}
+ </div>
+ ))
+ }
</div>
<a class="link" href={url}>
<span class="linkInner">View</span>
diff --git a/examples/ssr/src/components/ProductListing.astro b/examples/ssr/src/components/ProductListing.astro
index 96b6ea581..14e6e1d8c 100644
--- a/examples/ssr/src/components/ProductListing.astro
+++ b/examples/ssr/src/components/ProductListing.astro
@@ -52,17 +52,19 @@ const { products } = Astro.props;
</style>
<slot name="title" />
<ul>
- {products.map((product) => (
- <li class="product">
- <a href={`/products/${product.id}`}>
- <figure>
- <img src={product.image} />
- <figcaption>
- <div class="name">{product.name}</div>
- <div class="price">${product.price}</div>
- </figcaption>
- </figure>
- </a>
- </li>
- ))}
+ {
+ products.map((product) => (
+ <li class="product">
+ <a href={`/products/${product.id}`}>
+ <figure>
+ <img src={product.image} />
+ <figcaption>
+ <div class="name">{product.name}</div>
+ <div class="price">${product.price}</div>
+ </figcaption>
+ </figure>
+ </a>
+ </li>
+ ))
+ }
</ul>
diff --git a/examples/ssr/src/components/TextDecorationSkip.astro b/examples/ssr/src/components/TextDecorationSkip.astro
index 524732d04..707027763 100644
--- a/examples/ssr/src/components/TextDecorationSkip.astro
+++ b/examples/ssr/src/components/TextDecorationSkip.astro
@@ -13,9 +13,11 @@ const last = words.length - 1;
text-decoration: underline;
}
</style>
-{words.map((word, i) => (
- <Fragment>
- <span>{word}</span>
- {i !== last && <Fragment>&#32;</Fragment>}
- </Fragment>
-))}
+{
+ words.map((word, i) => (
+ <Fragment>
+ <span>{word}</span>
+ {i !== last && <Fragment>&#32;</Fragment>}
+ </Fragment>
+ ))
+}
diff --git a/examples/ssr/src/pages/cart.astro b/examples/ssr/src/pages/cart.astro
index d153e3ea9..ebc2f1472 100644
--- a/examples/ssr/src/pages/cart.astro
+++ b/examples/ssr/src/pages/cart.astro
@@ -36,12 +36,14 @@ const cart = await getCart(Astro.request);
</tr>
</thead>
<tbody>
- {cart.items.map((item) => (
- <tr>
- <td>{item.name}</td>
- <td>{item.count}</td>
- </tr>
- ))}
+ {
+ cart.items.map((item) => (
+ <tr>
+ <td>{item.name}</td>
+ <td>{item.count}</td>
+ </tr>
+ ))
+ }
</tbody>
</table>
</Container>
diff --git a/examples/with-vite-plugin-pwa/src/pages/index.astro b/examples/with-vite-plugin-pwa/src/pages/index.astro
index af2303f57..28af70e3b 100644
--- a/examples/with-vite-plugin-pwa/src/pages/index.astro
+++ b/examples/with-vite-plugin-pwa/src/pages/index.astro
@@ -12,8 +12,6 @@
<body>
<h1>Welcome to <a href="https://astro.build/">Astro</a></h1>
- <script src="/src/index.ts">
-
- </script>
+ <script src="/src/index.ts"></script>
</body>
</html>