michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

[ci] format

Browse source
This commit is contained in:
Princesseuh 2022-11-08 18:39:22 +00:00 committed by fredkbot
parent 0dcdc6fb1e
commit dcdeca56ac
17 changed files with 187 additions and 167 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
examples/blog/src/layouts/BlogPost.astro
View file

@ -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>

26
examples/blog/src/pages/blog.astro
View file

@ -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>

44
examples/docs/src/components/Footer/AvatarList.astro
View file

@ -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>

4
examples/docs/src/components/HeadCommon.astro
View file

@ -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>

40
examples/docs/src/components/LeftSidebar/LeftSidebar.astro
View file

@ -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>

100
examples/docs/src/components/RightSidebar/MoreMenu.astro
View file

@ -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 />

10
examples/framework-lit/src/pages/index.astro
View file

@ -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>

2
examples/hackernews/src/components/Comment.astro
View file

@ -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>

16
examples/hackernews/src/components/For.astro
View file

@ -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" />

12
examples/hackernews/src/components/Nav.astro
View file

@ -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>

2
examples/hackernews/src/pages/users/[id].astro
View file

@ -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>

12
examples/portfolio/src/components/PortfolioPreview.astro
View file

@ -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>

28
examples/ssr/src/components/ProductListing.astro
View file

@ -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>

14
examples/ssr/src/components/TextDecorationSkip.astro
View file

@ -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>
))
}

14
examples/ssr/src/pages/cart.astro
View file

@ -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>

4
examples/with-vite-plugin-pwa/src/pages/index.astro
View file

@ -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>

14
packages/astro/CHANGELOG.md
View file

@ -501,7 +501,7 @@
This expands the abilities of `set:html` to ultimate service this use-case:
```astro
<div set:html={fetch('/legacy-post.html')}></div>
<div set:html={fetch('/legacy-post.html')} />
```
This means you can take a legacy app that has been statically generated to HTML and directly consume that HTML within your templates. As is always the case with `set:html`, this should only be used on trusted content.
@ -514,8 +514,7 @@
set:html={new Response('<span>Hello world</span>', {
headers: { 'content-type': 'text/html' },
})}
>
</div>
/>
```
- `ReadableStream`s:
```astro
@ -526,8 +525,7 @@
controller.close();
},
})}
>
</div>
/>
```
- `AsyncIterable`s:
```astro
@ -537,8 +535,7 @@
yield `<li>${num}</li>`;
}
})()}
>
</div>
/>
```
- `Iterable`s (non-async):
```astro
@ -548,8 +545,7 @@
yield `<li>${num}</li>`;
}
})()}
>
</div>
/>
```
### Patch Changes