refactor: make email clickable (#44)

src/components/contact.tsx

@@ -54,7 +54,23 @@ export const Contact = () => {
     >
       <SectionHeading
         heading="Get In Touch"
-        content="Please contact me directly at [email protected] or through this form."
+        content={
+          <>
+            Please contact me directly at{' '}
+            <Button
+              variant="link"
+              className="text-muted-foreground p-0 font-medium"
+            >
+              <a
+                className="underline-offset-4 hover:underline"
+                href="mailto:[email protected]"
+              >
+                [email protected]
+              </a>
+            </Button>{' '}
+            or through this form.
+          </>
+        }
       />
       <form
         onSubmit={handleSubmit(onSubmit)}

src/components/section-heading.tsx

@@ -1,6 +1,8 @@
+import { ReactNode } from 'react';
+
 type TProps = {
   heading: string;
-  content?: string | undefined;
+  content?: string | ReactNode | undefined;
 };
 
 export const SectionHeading = ({ heading, content }: TProps) => {