From 99c813855014a48981e39b1662835071bd7828ff Mon Sep 17 00:00:00 2001
From: Beau Findlay <me@beaufindlay.com>
Date: Mon, 29 Apr 2024 21:58:33 +0100
Subject: [PATCH] Update homepage styling

---
 src/Client/src/components/TechIcons.tsx |  4 +++-
 src/Client/src/pages/HomePage.tsx       | 15 ++++++++++++---
 src/Client/src/pages/Layout.tsx         |  2 +-
 3 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/src/Client/src/components/TechIcons.tsx b/src/Client/src/components/TechIcons.tsx
index 5a89adf..9bc9f23 100644
--- a/src/Client/src/components/TechIcons.tsx
+++ b/src/Client/src/components/TechIcons.tsx
@@ -42,7 +42,9 @@ export default function TechIcons({ className }: Props) {
 
   return (
     <div className={styles}>
-      <p className="text-xl text-center mb-10 font-bold">Tech</p>
+      <p className="text-xl text-center mb-10 font-semibold">
+        Tech i'm working with at the moment:
+      </p>
       <div className="flex flex-col md:flex-row md:justify-evenly space-y-10 md:space-y-0 text-center mx-auto mt-4">
         {techIcons.map((techIcon, index) => (
           <div key={index}>
diff --git a/src/Client/src/pages/HomePage.tsx b/src/Client/src/pages/HomePage.tsx
index d21aaee..c4b7a2e 100644
--- a/src/Client/src/pages/HomePage.tsx
+++ b/src/Client/src/pages/HomePage.tsx
@@ -1,3 +1,4 @@
+import { FaRegPaperPlane } from "react-icons/fa6";
 import AnchorLink from "../components/AnchorLink";
 import Subtitle from "../components/Subtitle";
 import TechIcons from "../components/TechIcons";
@@ -11,8 +12,6 @@ export default function HomePage() {
       <Text>
         I'm a UK-based software engineer and I love building cool stuff.
       </Text>
-
-      <Subtitle className="mt-12">A bit about me</Subtitle>
       <Text>
         I mostly specialise in back-end C#/.NET development and I've built
         systems that scale for hundreds-of-thousands of global users.
@@ -23,7 +22,17 @@ export default function HomePage() {
         <AnchorLink href="https://unhurdmusic.com">un:hurd music</AnchorLink>.
       </Text>
 
-      <TechIcons className="mt-20 mb-10" />
+      <TechIcons className="mt-20" />
+
+      <div className="mt-24 mb-10 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/Layout.tsx b/src/Client/src/pages/Layout.tsx
index d7b33e5..6b87bc4 100644
--- a/src/Client/src/pages/Layout.tsx
+++ b/src/Client/src/pages/Layout.tsx
@@ -4,7 +4,7 @@ import Footer from "../components/Footer";
 
 export default function Layout() {
   return (
-    <div className="bg-black font-mono text-slate-50 antialiased px-6 lg:px-8">
+    <div className="bg-black font-mono text-slate-50 antialiased px-6 lg:px-10">
       <div className="flex flex-col min-h-screen mx-auto max-w-7xl fade-in">
         <NavBar />
         <div className="flex-1 py-8">