style: reformat

Reformat files using Prettier and Rustywind. I tried the official
Tailwind CSS Prettier plugin but it was erroring when trying to run it -
I assume because I'm using Astro's Tailwind integration.
This commit is contained in:
Oliver Davies 2023-04-19 17:00:29 +01:00
parent f2dc5ad235
commit a33f269253
19 changed files with 111 additions and 113 deletions

View file

@ -16,7 +16,7 @@ For example, with this component, as I duplicate it to add more links, I also du
```html
<li>
<a class="py-2 block border-b-2 border-transparent hover:border-blue-500 hover:text-blue-500 focus:outline-none focus:bg-yellow-400 focus:border-current" href="#0">About</a>
<a class="block py-2 border-b-2 border-transparent hover:text-blue-500 hover:border-blue-500 focus:bg-yellow-400 focus:border-current focus:outline-none" href="#0">About</a>
</li>
```
@ -43,7 +43,7 @@ Instead of extracting a variable, you could also extract a CSS component. With T
```astro
<Layout>
<ul
class="flex flex-col justify-center gap-4 sm:flex-row sm:flex-wrap sm:gap-6"
class="flex flex-col gap-4 justify-center sm:flex-row sm:flex-wrap sm:gap-6"
>
<li><a class="link" href="#0">About</a></li>
<li><a class="link" href="#0">Blog</a></li>
@ -79,7 +79,7 @@ const links = [
{links.map(link => (
<li>
<a class="py-2 block border-b-2 border-transparent hover:border-blue-500 hover:text-blue-500 focus:outline-none focus:bg-yellow-400 focus:border-current" href="#0">
<a class="block py-2 border-b-2 border-transparent hover:text-blue-500 hover:border-blue-500 focus:bg-yellow-400 focus:border-current focus:outline-none" href="#0">
{link.name}
</a>
</li>
@ -97,7 +97,7 @@ This is the extracted component:
const { name } = Astro.props;
---
<a class="py-2 block border-b-2 border-transparent hover:border-blue-500 hover:text-blue-500 focus:outline-none focus:bg-yellow-400 focus:border-current" href="#0">
<a class="block py-2 border-b-2 border-transparent hover:text-blue-500 hover:border-blue-500 focus:bg-yellow-400 focus:border-current focus:outline-none" href="#0">
{name}
</a>
```
@ -111,7 +111,7 @@ import Link from "~/components/Link.astro";
---
<Layout>
<ul class="flex flex-col justify-center gap-4 sm:flex-row sm:flex-wrap sm:gap-6">
<ul class="flex flex-col gap-4 justify-center sm:flex-row sm:flex-wrap sm:gap-6">
<li><Link name="About" /></li>
<li><Link name="Blog" /></li>
<li><Link name="Talks" /></li>