From b3412826a58d63da7bf305c5b16d2b45526aa06c Mon Sep 17 00:00:00 2001
From: Rebecca Black <rebecca.ann.black@gmail.com>
Date: Tue, 5 Mar 2024 03:44:03 -0500
Subject: [PATCH] added buttons

---
 astro-web/src/components/Button.astro | 16 ++++++++++++++++
 astro-web/src/pages/index.astro       |  8 +++++++-
 2 files changed, 23 insertions(+), 1 deletion(-)
 create mode 100644 astro-web/src/components/Button.astro

diff --git a/astro-web/src/components/Button.astro b/astro-web/src/components/Button.astro
new file mode 100644
index 0000000..124f918
--- /dev/null
+++ b/astro-web/src/components/Button.astro
@@ -0,0 +1,16 @@
+---
+export interface Props {
+    light?: boolean
+    href?: string
+}
+
+const { light, href } = Astro.props
+
+const className = `inline-flex center items-center justify-center rounded-full pr-4 pl-4 lg:pl-6 lg:pr-6 py-3 text-sm font-semibold transition ${ light ? 'bg-white text-neutral-dark hover:bg-neutral' : 'bg-neutral-dark text-white hover:bg-neutral-gray'}`;
+
+---
+<a href={ href || '#' }>
+    <button class={className}>
+        <slot />    
+    </button>
+</a>
diff --git a/astro-web/src/pages/index.astro b/astro-web/src/pages/index.astro
index 20cf158..692aacc 100644
--- a/astro-web/src/pages/index.astro
+++ b/astro-web/src/pages/index.astro
@@ -4,6 +4,7 @@ import Hero from "../components/Hero.astro";
 import Container from "../components/Container.astro";
 import FeatureTabs from "../components/FeatureTabs";
 import ProjectCard from "../components/ProjectCard.astro";
+import Button from "../components/Button.astro";
 import lizard from "../assets/footer/MKLizard.png";
 import nsf from "../assets/footer/NSF.png";
 import pss from "../assets/footer/Performant_Logo.svg";
@@ -20,7 +21,9 @@ import { Image } from "astro:assets";
 			<p class="text-neutral-gray">
 				EditionCrafter is an easy-to-use tool for scholars, educators, and research institutions to publish digital critical editions in a low-cost and sustainable manner.
 			</p>
-			<!-- button -->
+			<Button>
+				Get Started &rarr;
+			</Button>
 		</div>
 	</Hero>
 
@@ -88,6 +91,9 @@ import { Image } from "astro:assets";
 				<p class="text-neutral-gray">
 					Lorem ipsum dolor sit amet consectetur. Auctor quam arcu magna curabitur pulvinar. Volutpat mauris faucibus nunc leo nullam nulla. Ultrices orci nulla elementum tincidunt non odio volutpat. Tincidunt mauris justo nam.
 				</p>
+				<Button>
+					Get Started &rarr;
+				</Button>
 			</div>
 			<div class="flex flex-col gap-6 md:w-1/2">
 				<div class="w-full">