diff options
-rw-r--r-- | examples/blog/src/components/BlogPostPreview.astro | 6 | ||||
-rw-r--r-- | examples/blog/src/pages/index.astro | 6 | ||||
-rw-r--r-- | www/src/components/BlogPostPreview.astro | 4 | ||||
-rw-r--r-- | www/src/pages/blog/index.astro | 6 | ||||
-rw-r--r-- | www/src/scss/blog.scss | 2 |
5 files changed, 10 insertions, 14 deletions
diff --git a/examples/blog/src/components/BlogPostPreview.astro b/examples/blog/src/components/BlogPostPreview.astro index 0451a8c57..6a553366d 100644 --- a/examples/blog/src/components/BlogPostPreview.astro +++ b/examples/blog/src/components/BlogPostPreview.astro @@ -10,10 +10,8 @@ const { post } = Astro.props; <p class="publish-date">{post.publishDate}</p> <a href={post.url}><h1 class="title">{post.title}</h1></a> </header> - <main> - <p>{post.description}</p> - <a href={post.url}>Read more</a> - </main> + <p>{post.description}</p> + <a href={post.url}>Read more</a> </article> <style> diff --git a/examples/blog/src/pages/index.astro b/examples/blog/src/pages/index.astro index b082088c8..224e9db1d 100644 --- a/examples/blog/src/pages/index.astro +++ b/examples/blog/src/pages/index.astro @@ -76,15 +76,15 @@ allPosts = allPosts.sort((a, b) => new Date(b.publishDate).valueOf() - new Date( <body> <BlogHeader /> <div class="layout"> - <article class="content"> + <main class="content"> <section class="intro"> <h1 class="latest">{title}</h1> <p>{description}</p> </section> - <section> + <section aria-label="Blog post list"> {allPosts.map(p => <BlogPostPreview post={p} />)} </section> - </article> + </main> </div> </body> </html> diff --git a/www/src/components/BlogPostPreview.astro b/www/src/components/BlogPostPreview.astro index fc99d877a..8ec716736 100644 --- a/www/src/components/BlogPostPreview.astro +++ b/www/src/components/BlogPostPreview.astro @@ -14,9 +14,7 @@ const { title, publishDate, href } = Astro.props; <p class="publish-date">{publishDate}</p> <a href={href}><h1 class="title">{title}</h1></a> </header> - <main> - <slot />{' '}<a href={href}>Read more →</a> - </main> + <slot />{' '}<a href={href}>Read more →</a> </article> <style> diff --git a/www/src/pages/blog/index.astro b/www/src/pages/blog/index.astro index 11d1aefb1..5ea37c043 100644 --- a/www/src/pages/blog/index.astro +++ b/www/src/pages/blog/index.astro @@ -61,12 +61,12 @@ let lang = 'en'; <body> <BlogHeader /> <div class="layout"> - <article class="content"> + <main class="content"> <section class="intro"> <h1 class="latest">The Astro Blog</h1> <p>{description}</p> </section> - <section> + <section aria-label="Blog post list"> <BlogPostPreview title="Astro 0.21 Preview: Vite + WASM = ⚡️" publishDate="October 6, 2021" href="/blog/astro-021-preview"> <span>Get a sneak preview of what's next for Astro, including our new Vite build engine and WASM-powered Go compiler.</span> </BlogPostPreview> @@ -95,7 +95,7 @@ let lang = 'en'; <span>We're excited to announce Astro as a new way to build static websites and deliver lightning-fast performance without sacrificing a modern developer experience.</span> </BlogPostPreview> </section> - </article> + </main> </div> </body> </html> diff --git a/www/src/scss/blog.scss b/www/src/scss/blog.scss index 08dc0262c..20b4511af 100644 --- a/www/src/scss/blog.scss +++ b/www/src/scss/blog.scss @@ -116,7 +116,7 @@ body { gap: 1em; } -.layout > article { +.layout > :is(main,article) { grid-column: 2; } |