diff options
Diffstat (limited to 'examples/blog-multiple-authors/src/pages')
4 files changed, 67 insertions, 41 deletions
diff --git a/examples/blog-multiple-authors/src/pages/about.astro b/examples/blog-multiple-authors/src/pages/about.astro index f1097a6f4..2d2c9665b 100644 --- a/examples/blog-multiple-authors/src/pages/about.astro +++ b/examples/blog-multiple-authors/src/pages/about.astro @@ -1,9 +1,9 @@ --- -import MainHead from '../components/MainHead.astro'; -import Nav from '../components/Nav.astro'; +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'; +let title = "About"; +let description = "About page of an example blog on Astro"; let canonicalURL = Astro.canonicalURL; --- @@ -54,15 +54,19 @@ let canonicalURL = Astro.canonicalURL; </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.” + 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. + 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> diff --git a/examples/blog-multiple-authors/src/pages/authors/[author].astro b/examples/blog-multiple-authors/src/pages/authors/[author].astro index bb1bc3aa2..cc83c6bbb 100644 --- a/examples/blog-multiple-authors/src/pages/authors/[author].astro +++ b/examples/blog-multiple-authors/src/pages/authors/[author].astro @@ -1,28 +1,35 @@ --- -import MainHead from '../../components/MainHead.astro'; -import Nav from '../../components/Nav.astro'; -import PostPreview from '../../components/PostPreview.astro'; -import authorData from '../../data/authors.json'; +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'); + 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 title = "Don’s Blog"; +const description = "An example blog on Astro"; /** 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 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={Astro.canonicalURL.toString()} /> + <MainHead + {title} + {description} + image={posts[0].frontmatter.image} + canonicalURL={Astro.canonicalURL.toString()} + /> <style lang="scss"> .title { diff --git a/examples/blog-multiple-authors/src/pages/index.astro b/examples/blog-multiple-authors/src/pages/index.astro index 4e93a932e..91168ed43 100644 --- a/examples/blog-multiple-authors/src/pages/index.astro +++ b/examples/blog-multiple-authors/src/pages/index.astro @@ -1,22 +1,24 @@ --- // 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'; +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'; +let title = "Don’s Blog"; +let description = "An example blog on Astro"; let canonicalURL = Astro.canonicalURL; // 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 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/ @@ -31,7 +33,9 @@ let firstPage = allPosts.slice(0, 2); <Nav {title} /> <main class="wrapper"> - {allPosts.map((post) => <PostPreview post={post} author={authorData[post.frontmatter.author]} />)} + {allPosts.map((post) => ( + <PostPreview post={post} author={authorData[post.frontmatter.author]} /> + ))} </main> <footer> diff --git a/examples/blog-multiple-authors/src/pages/posts/[...page].astro b/examples/blog-multiple-authors/src/pages/posts/[...page].astro index f770aadb2..8a6c9a730 100644 --- a/examples/blog-multiple-authors/src/pages/posts/[...page].astro +++ b/examples/blog-multiple-authors/src/pages/posts/[...page].astro @@ -1,13 +1,15 @@ --- -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'; +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()); + 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. @@ -28,8 +30,8 @@ export async function getStaticPaths({ paginate, rss }) { } // page -const title = 'Don’s Blog'; -const description = 'An example blog on Astro'; +const title = "Don’s Blog"; +const description = "An example blog on Astro"; const { canonicalURL } = Astro; const { page } = Astro.props; --- @@ -37,7 +39,14 @@ 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} /> + <MainHead + {title} + {description} + image={page.data[0].frontmatter.image} + canonicalURL={canonicalURL.toString()} + prev={page.url.prev} + next={page.url.next} + /> <style lang="scss"> .title { @@ -62,7 +71,9 @@ const { page } = Astro.props; <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]} />)} + {page.data.map((post) => ( + <PostPreview post={post} author={authorData[post.frontmatter.author]} /> + ))} </main> <footer> |