Minor UI Updates

frontend/app/about/page.tsx

@@ -8,7 +8,7 @@ export default function About() {
   return (
     <Main>
       <Header />
-      <div className="rounded-xl shadow-xl p-4 mb-8 z-10 max-w-5xl w-full">
+      <div className="rounded-xl shadow-xl p-4 mb-8 max-w-5xl w-full">
         <div className="max-w-2xl mx-auto p-4">
           <div className="bg-gradient-to-r from-blue-500 to-indigo-500 text-white p-8 rounded-lg shadow-lg">
             <h1 className="text-2xl md:text-4xl font-bold mb-4">About Smart Retrieval</h1>

frontend/app/page.tsx

@@ -3,18 +3,18 @@
 import Header from "@/app/components/header";
 import Image from 'next/image';
 import Link from 'next/link';
-import * as React from 'react'
+import { useState } from 'react'
 import { IconSpinner } from '@/app/components/ui/icons'
 import logo from '../public/smart-retrieval-logo.webp'
 import Main from "@/app/components/ui/main-container";
 
 export default function Home() {
-  const [isLoading, setIsLoading] = React.useState(false);
+  const [isLoading, setIsLoading] = useState(false);
 
   return (
     <Main>
       <Header />
-      <div className="rounded-xl shadow-xl p-4 mb-8 z-10 max-w-5xl w-full">
+      <div className="rounded-xl shadow-xl p-4 mb-8 max-w-5xl w-full">
         <div className="max-w-2xl mx-auto p-4 text-center">
           <div className="flex flex-col items-center mb-4 bg-gradient-to-r from-blue-500 to-indigo-500 text-white p-8 rounded-lg shadow-lg">
             <div className="flex flex-col md:flex-row items-center md:items-start">
@@ -23,6 +23,7 @@ export default function Home() {
                 alt="Smart Retrieval Logo"
                 width={150}
                 height={150}
+                priority
                 className="rounded-lg mb-4 md:mb-0 md:mr-4"
               />
               <div className='flex flex-col mt-4'>
@@ -38,7 +39,7 @@ export default function Home() {
               Experience the power of Smart Retrieval today!
             </p>
             <Link href="/chat" onClick={() => { setIsLoading(true); }}>
-              <div className="flex text-center items-center text-xl bg-blue-500 text-white px-6 py-3 rounded-full font-bold transition duration-300 ease-in-out transform hover:scale-125">
+              <div className="flex text-center items-center text-xl bg-blue-500 text-white px-6 py-3 rounded-md font-bold transition duration-300 ease-in-out transform hover:scale-125">
                 {isLoading ? (
                   <IconSpinner className="mr-2 animate-spin" />
                 ) : null}