Update page layouts

app/dashboard/layout.tsx

@@ -4,7 +4,7 @@ export default function DashboardLayout({
 	children: React.ReactNode
 }) {
 	return (
-		<section className='flex flex-col items-center justify-center gap-4'>
+		<section className='flex flex-col items-center justify-center gap-4 pt-10 sm:pt-16'>
 			{children}
 		</section>
 	)

app/layout.tsx

@@ -62,7 +62,7 @@ export default async function RootLayout({
 							user={user}
 							categories={bookmarkCategories}
 						/>
-						<main className='container mx-auto max-w-7xl flex-grow px-6 pt-16'>
+						<main className='container mx-auto max-w-7xl flex-grow px-6'>
 							{children}
 						</main>
 						<footer className='flex w-full items-center justify-center py-3'>

app/page.tsx

@@ -14,7 +14,7 @@ export default function Home() {
 	}
 
 	return (
-		<section className='flex flex-col items-center justify-center gap-4 py-8 md:py-10'>
+		<section className='md:py-26 flex flex-col items-center justify-center gap-4 py-24'>
 			<div className='inline-block max-w-lg justify-center text-center'>
 				<h1 className={title({ color: 'blue' })}>Beautiful&nbsp;</h1>
 				<h1 className={title()}>Dashboard&nbsp;</h1>
@@ -26,7 +26,7 @@ export default function Home() {
 			</div>
 
 			<div className='my-4'>
-				<Card className='w-96 grow select-none'>
+				<Card className='max-w-96 grow select-none'>
 					<CardHeader className='flex gap-3'>
 						<Image
 							alt='nextui logo'
@@ -34,6 +34,7 @@ export default function Home() {
 							radius='sm'
 							src='https://avatars.githubusercontent.com/u/86160567?s=200&v=4'
 							width={40}
+							removeWrapper
 						/>
 						<Link
 							isExternal