From 617e369d283db949fce021550f17efaaf41a234f Mon Sep 17 00:00:00 2001
From: secondl1ght <85003930+secondl1ght@users.noreply.github.com>
Date: Thu, 21 Jul 2022 11:04:30 -0600
Subject: create more components to DRY up code

---
 src/components/LandingInfoCard.svelte | 28 ++++++++++++++++++++++++++++
 1 file changed, 28 insertions(+)
 create mode 100644 src/components/LandingInfoCard.svelte

(limited to 'src/components/LandingInfoCard.svelte')

diff --git a/src/components/LandingInfoCard.svelte b/src/components/LandingInfoCard.svelte
new file mode 100644
index 00000000..d693d78d
--- /dev/null
+++ b/src/components/LandingInfoCard.svelte
@@ -0,0 +1,28 @@
+<script>
+	export let gradients;
+	export let image;
+	export let title;
+	export let description;
+	export let order;
+</script>
+
+<div class="block lg:flex justify-center lg:space-x-20 items-center">
+	<div
+		class="{order === 'reverse' &&
+			'order-last'} bg-gradient-to-r {gradients} rounded-full w-[250px] h-[250px] md:w-[300px] md:h-[300px] lg:w-[350px] lg:h-[350px] xl:w-[450px] xl:h-[450px] 2xl:w-[500px] 2xl:h-[500px] flex justify-center items-center mx-auto lg:mx-0 mb-10 lg:mb-0"
+	>
+		{#if image}
+			<img src="/images/{image}.svg" alt={image} class="w-5/6" />
+		{/if}
+	</div>
+	<div class="w-full lg:w-1/2 max-w-3xl space-y-10 mx-auto lg:mx-0">
+		<h3 class="text-5xl font-medium text-left">{title}</h3>
+		<p class="text-secondary text-xl font-medium w-full lg:w-3/4 mx-auto lg:mx-0">
+			{#if description}
+				{description}
+			{:else}
+				<slot />
+			{/if}
+		</p>
+	</div>
+</div>
-- 
cgit v1.2.3