Use accessible indentation (#2253)

4 files changed, 154 insertions, 155 deletions

diff --git a/examples/blog-multiple-authors/src/components/MainHead.astro b/examples/blog-multiple-authors/src/components/MainHead.astro
index 0bf1ec4b0..ffdc0f1c7 100644
--- a/examples/blog-multiple-authors/src/components/MainHead.astro
+++ b/examples/blog-multiple-authors/src/components/MainHead.astro
@@ -1,45 +1,45 @@
 ---
 export interface Props {
-  title: string;
-  description: string;
-  image?: string;
-  type?: string;
-  next?: string;
-  prev?: string;
-  canonicalURL?: string | URL;
+	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">
+<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">
+<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" />
 <link rel="stylesheet" href={Astro.resolve('../styles/global.css')} />
 <!-- Sitemap -->
-<link rel="sitemap" href="/sitemap.xml">
+<link rel="sitemap" href="/sitemap.xml" />
 <!-- RSS -->
-<link rel="alternate" type="application/rss+xml" href="/feed/posts.xml">
+<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}>
+<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}>
+<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}>
+<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}>)}
diff --git a/examples/blog-multiple-authors/src/components/Nav.astro b/examples/blog-multiple-authors/src/components/Nav.astro
index 04a537f87..a2a5fc3a3 100644
--- a/examples/blog-multiple-authors/src/components/Nav.astro
+++ b/examples/blog-multiple-authors/src/components/Nav.astro
@@ -1,63 +1,63 @@
 ---
 export interface Props {
-  title: string;
+	title: string;
 }
 const { title } = Astro.props;
 ---
 
-<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>
-
 <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>
+	<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>
diff --git a/examples/blog-multiple-authors/src/components/Pagination.astro b/examples/blog-multiple-authors/src/components/Pagination.astro
index 401931c07..8cc3941f6 100644
--- a/examples/blog-multiple-authors/src/components/Pagination.astro
+++ b/examples/blog-multiple-authors/src/components/Pagination.astro
@@ -1,44 +1,44 @@
 ---
 export interface Props {
-  prevUrl: string;
-  nextUrl: string;
+	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;
-}
+	.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;
+	.prev,
+	.next {
+		display: block;
+		text-transform: uppercase;
+		font-size: 0.8em;
 
-  &[href="#"] {
-    display: none;
-  }
-}
+		&[href='#'] {
+			display: none;
+		}
+	}
 
-.prev {
-  margin-right: auto;
-}
+	.prev {
+		margin-right: auto;
+	}
 
-.next {
-  margin-left: auto;
-}
+	.next {
+		margin-left: auto;
+	}
 </style>
-
-<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>
diff --git a/examples/blog-multiple-authors/src/components/PostPreview.astro b/examples/blog-multiple-authors/src/components/PostPreview.astro
index 19e1362e5..81e80ba6c 100644
--- a/examples/blog-multiple-authors/src/components/PostPreview.astro
+++ b/examples/blog-multiple-authors/src/components/PostPreview.astro
@@ -1,66 +1,65 @@
 ---
 export interface Props {
-  post: any;
-  author: string;
+	post: any;
+	author: string;
 }
 const { post, author } = Astro.props;
 
 function formatDate(date) {
-  return new Date(date).toUTCString().replace(/(\d\d\d\d) .*/, '$1'); // remove everything after YYYY
+	return new Date(date).toUTCString().replace(/(\d\d\d\d) .*/, '$1'); // remove everything after YYYY
 }
 ---
 
+<article class="post">
+	<div class="data">
+		<h2>{post.title}</h2>
+		<a class="author" href={`/authors/${post.author}`}>{author.name}</a>
+		<time class="date" datetime={post.date}>{formatDate(post.date)}</time>
+		<p class="description">
+			{post.description}
+			<a class="link" href={post.url} aria-label={`Read ${post.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;
-}
+	.post {
+		padding-top: 6rem;
+		padding-bottom: 6rem;
+		border-bottom: 1px solid rgba(black, 0.25);
+		text-align: center;
+	}
 
-.author {
-  text-transform: uppercase;
-}
+	.author {
+		text-transform: uppercase;
+	}
 
-.date {
-  font-style: italic;
-}
+	.date {
+		font-style: italic;
+	}
 
-.description {
-  font-size: 1.25em;
-}
+	.description {
+		font-size: 1.25em;
+	}
 
-.link {
-  text-transform: uppercase;
-  font-size: 0.8em;
-  margin-left: 1em;
-}
+	.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;
-}
+	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;
-}
+	time {
+		display: block;
+		margin-top: 0.25rem;
+		margin-bottom: 0.5em;
+	}
 </style>
-
-<article class="post">
-
-  <div class="data">
-    <h2>{post.title}</h2>
-    <a class="author" href={`/authors/${post.author}`}>{author.name}</a>
-    <time class="date" datetime={post.date}>{formatDate(post.date)}</time>
-    <p class="description">
-      {post.description}
-      <a class="link" href={post.url} aria-label={`Read ${post.title}`}>Read</a>
-    </p>
-  </div>
-</article>