Reorganize duplicated tailwind code and formatting

This commit is contained in:
prototypa
2022-08-27 01:52:23 -04:00
parent ca01eecc24
commit 212331215b
28 changed files with 424 additions and 950 deletions

View File

@ -2,7 +2,7 @@
import { Icon } from "astro-icon";
import Picture from "~/components/core/Picture.astro";
const {} = Astro.props;
const { } = Astro.props;
---
<section class="px-4 py-16 sm:px-6 mx-auto lg:px-8 lg:py-20 max-w-6xl">
@ -11,13 +11,8 @@ const {} = Astro.props;
<div class="flex">
<div class="flex flex-col items-center mr-4">
<div>
<div
class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2"
>
<Icon
name="tabler:arrow-down"
class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold"
/>
<div class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2">
<Icon name="tabler:arrow-down" class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold" />
</div>
</div>
<div class="w-px h-full bg-gray-300 dark:bg-slate-500"></div>
@ -37,13 +32,8 @@ const {} = Astro.props;
<div class="flex">
<div class="flex flex-col items-center mr-4">
<div>
<div
class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2"
>
<Icon
name="tabler:arrow-down"
class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold"
/>
<div class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2">
<Icon name="tabler:arrow-down" class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold" />
</div>
</div>
<div class="w-px h-full bg-gray-300 dark:bg-slate-500"></div>
@ -62,13 +52,8 @@ const {} = Astro.props;
<div class="flex">
<div class="flex flex-col items-center mr-4">
<div>
<div
class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2"
>
<Icon
name="tabler:arrow-down"
class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold"
/>
<div class="flex items-center justify-center w-10 h-10 rounded-full border-pink-500 border-2">
<Icon name="tabler:arrow-down" class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold" />
</div>
</div>
<div class="w-px h-full bg-gray-300 dark:bg-slate-500"></div>
@ -87,13 +72,8 @@ const {} = Astro.props;
<div class="flex">
<div class="flex flex-col items-center mr-4">
<div>
<div
class="flex items-center justify-center w-10 h-10 rounded-full border-blue-600 border-2"
>
<Icon
name="tabler:check"
class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold"
/>
<div class="flex items-center justify-center w-10 h-10 rounded-full border-blue-600 border-2">
<Icon name="tabler:check" class="w-6 h-6 text-gray-600 dark:text-slate-200 icon-bold" />
</div>
</div>
</div>
@ -108,12 +88,8 @@ const {} = Astro.props;
<div class="relative">
<Picture
class="inset-0 object-cover object-top w-full rounded-md shadow-lg md:absolute md:h-full bg-gray-400 dark:bg-slate-700"
src={import("~/assets/images/astronaut.jpg")}
widths={[400, 768]}
sizes="(max-width: 768px) 100vw, 432px"
alt="Astronaut"
aspectRatio="432:768"
/>
src={import("~/assets/images/astronaut.jpg")} widths={[400, 768]} sizes="(max-width: 768px) 100vw, 432px"
alt="Astronaut" aspectRatio="432:768" />
</div>
</div>
</section>
</section>