From eb05b1f7b5ccd844634d71369a87a9ebd071bbc6 Mon Sep 17 00:00:00 2001
From: Beau Findlay <me@beaufindlay.com>
Date: Tue, 30 Apr 2024 20:53:07 +0100
Subject: [PATCH] Extract contact me section to component

---
 src/Client/src/components/ContactMe.tsx | 16 ++++++++++++++++
 src/Client/src/pages/WorkPage.tsx       | 13 ++-----------
 2 files changed, 18 insertions(+), 11 deletions(-)
 create mode 100644 src/Client/src/components/ContactMe.tsx

diff --git a/src/Client/src/components/ContactMe.tsx b/src/Client/src/components/ContactMe.tsx
new file mode 100644
index 0000000..6aed821
--- /dev/null
+++ b/src/Client/src/components/ContactMe.tsx
@@ -0,0 +1,16 @@
+import { FaRegPaperPlane } from "react-icons/fa6";
+import Text from "../components/Text";
+
+export default function ContactMe() {
+  return (
+    <div className="mb-10 mt-12 text-center">
+      <Text>If you think I can help with your project...</Text>
+      <a
+        href="mailto:me@beaufindlay.com"
+        className="inline-flex items-center border-0 ring-1 ring-inset ring-gray-300 bg-black px-3.5 py-2.5 mt-2 text-sm font-semibold text-white shadow hover:bg-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600"
+      >
+        Get in touch <FaRegPaperPlane className="ml-2" />
+      </a>
+    </div>
+  );
+}
diff --git a/src/Client/src/pages/WorkPage.tsx b/src/Client/src/pages/WorkPage.tsx
index 59cd6d6..ab65dbc 100644
--- a/src/Client/src/pages/WorkPage.tsx
+++ b/src/Client/src/pages/WorkPage.tsx
@@ -1,5 +1,4 @@
-import { FaRegPaperPlane } from "react-icons/fa6";
-import Text from "../components/Text";
+import ContactMe from "../components/ContactMe";
 import Title from "../components/Title";
 import WorkTimeline from "../components/WorkTimeline";
 
@@ -11,15 +10,7 @@ export default function WorkPage() {
         Freelance Software Engineer since 2018
       </p>
       <WorkTimeline />
-      <div className="mb-10 mt-12 text-center">
-        <Text>If you think I can help with your project...</Text>
-        <a
-          href="mailto:me@beaufindlay.com"
-          className="inline-flex items-center border-0 ring-1 ring-inset ring-gray-300 bg-black px-3.5 py-2.5 mt-2 text-sm font-semibold text-white shadow hover:bg-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600"
-        >
-          Get in touch <FaRegPaperPlane className="ml-2" />
-        </a>
-      </div>
+      <ContactMe />
     </>
   );
 }