Added the logo to the website

It was pretty annoying to make it look good but I did it yay

src/app/globals.css

@@ -13,5 +13,9 @@ h1, h2, h3, p {
 }
 
 .side-gradient {
-  @apply h-screen flex flex-col justify-center bg-gradient-to-r from-purple-900 via-black to-black;
+  @apply w-screen h-screen flex flex-col justify-center bg-gradient-to-r from-purple-900 via-black to-black;
+}
+
+.logo-container {
+  @apply fixed right-30 top-1/2 -translate-y-1/2;
 }

src/app/page.tsx

@@ -1,4 +1,6 @@
 import { Metadata } from 'next'
+import Image from 'next/image'
+import codefly from './assets/logo.png'
 
 export const metadata: Metadata = {
   title: 'Code Fly - Home'
@@ -7,9 +9,15 @@ export const metadata: Metadata = {
 export default function Home () {
   return (
     <>
-      <div className="side-gradient">
+      <div className='side-gradient'>
         <h1 className='side-text'>Code Fly is a suite of IDE&apos;s</h1>
-        <h1 className='side-text'>Made as a free alternative to the jetbrains suite</h1>
+        <h1 className='side-text'>
+          Made as a free alternative to the jetbrains suite
+        </h1>
+      </div>
+
+      <div className='logo-container'>
+        <Image src={codefly} alt='Code Fly Logo' width={600} height={600} />
       </div>
     </>
   )