run prettier formatting on all files

client/components/home/sections/Hero.tsx

@@ -0,0 +1,50 @@
+import Tilt from 'react-parallax-tilt';
+
+import { defaultTiltProps } from '@/constants/tilt';
+
+import HomeActions from '../Actions';
+import HeroBackground from '../Background';
+import HeroPattern from '../Pattern';
+
+const HeroSection = () => (
+  <section className="relative">
+    <HeroPattern />
+    <HeroBackground />
+
+    <div className="mx-auto max-w-7xl px-6 pb-24 pt-10 sm:pb-32 lg:flex lg:px-8 lg:py-52">
+      <div className="mx-auto max-w-2xl shrink-0 lg:mx-0 lg:max-w-xl lg:pt-12">
+        <div className="mt-10 space-y-2">
+          <h6 className="text-base font-bold tracking-wide">Finally,</h6>
+          <h1 className="text-4xl font-bold !leading-[1.15] tracking-tight sm:text-6xl">
+            A free and open-source resume builder
+          </h1>
+        </div>
+
+        <p className="prose prose-base prose-zinc mt-6 text-lg leading-8 dark:prose-invert">
+          Reactive Resume is a free and open-source resume builder that simplifies the tasks of creating, updating, and
+          sharing your resume.
+        </p>
+
+        <div className="mt-12 space-x-4">
+          <HomeActions />
+        </div>
+      </div>
+
+      <div className="mx-auto mt-16 flex max-w-2xl sm:mt-24 lg:ml-10 lg:mr-0 lg:mt-0 lg:max-w-none lg:flex-none xl:ml-32">
+        <div className="max-w-3xl flex-none sm:max-w-5xl lg:max-w-none">
+          <Tilt {...defaultTiltProps}>
+            <img
+              width={2432}
+              height={1442}
+              src="/images/screenshots/builder.png"
+              alt="Reactive Resume Screenshot - Builder Screen"
+              className="w-[76rem] rounded-lg bg-zinc-50/5 shadow-2xl ring-1 ring-zinc-950/10 dark:bg-zinc-950/5 dark:ring-zinc-50/10"
+            />
+          </Tilt>
+        </div>
+      </div>
+    </div>
+  </section>
+);
+
+export default HeroSection;