update: edit styles of some pages

src/app/page.tsx

@@ -1,3 +1,4 @@
+import AddBotButton from '@/components/buttons/AddBotButton'
 import DashboardButton from '@/components/buttons/DashboardButton'
 import DiscordLoginButton from '@/components/buttons/DiscordLoginButton'
 import features from '@/constants/Features'
@@ -25,14 +26,18 @@ const Home = () => {
         <h1 className="text-center text-5xl font-bold">Features</h1>
         {features.map((i) => (
           <div key={i.title} className="flex flex-col items-center  gap-2 md:flex-row w-full h-full">
-            <Image className="rounded-md flex-1 object-cover" src={i.image} alt={i.title} height={1000} width={1000} />
+            <Image className="rounded-2xl flex-1 object-cover shadow-md" src={i.image} alt={i.title} height={1000} width={1000} />
             <div className="flex flex-col items-center flex-1">
               <h2 className="font-bold text-xl text-center md:text-2xl lg:text-3xl">{i.title}</h2>
               <h3 className="text-lg text-center md:text-xl lg:text-2xl">{i.description}</h3>
             </div>
           </div>
         ))}
       </section>
+      <section className="section flex flex-col items-center justify-between gap-5">
+        <h1 className="text-center text-5xl font-bold">Interested in?</h1>
+        <AddBotButton />
+      </section>
     </main>
   )
 }

src/components/buttons/AddBotButton.tsx

@@ -3,8 +3,8 @@ import React from 'react'
 
 const AddBotButton = () => {
   return (
-    <Link href={process.env.NEXT_PUBLIC_BOTAUTHURL as string} className=" bg-blue-600 p-2 rounded-lg">
-      Add bot to server
+    <Link href={process.env.NEXT_PUBLIC_BOTAUTHURL as string} className=" bg-blue-600 p-3 rounded-lg">
+      <h1 className="font-bold text-xl">Add bot to server</h1>
     </Link>
   )
 }