style: improve padding + hover effects on leaderboard + settings page

kevinjosethomas · kevinjosethomas · commit 32f20cdaced7 · 2025-08-28T00:03:53.000-07:00
diff --git a/src/components/Settings/SettingsPage.tsx b/src/components/Settings/SettingsPage.tsx
@@ -49,7 +49,7 @@ export const SettingsPage: React.FC = () => {
       animate="visible"
       exit="exit"
       style={{ willChange: 'transform, opacity' }}
-      className="container relative mx-auto flex flex-col gap-6 px-6 py-8 md:gap-8"
+      className="relative mx-auto flex w-full flex-col gap-6 px-4 py-8 md:w-[90%] md:gap-8 md:px-0"
     >
       {/* Header */}
       <motion.div variants={itemVariants} className="flex flex-col gap-2">
diff --git a/src/pages/leaderboard.tsx b/src/pages/leaderboard.tsx
@@ -130,7 +130,7 @@ const Leaderboard: React.FC = () => {
               animate="visible"
               exit="exit"
               style={{ willChange: 'transform, opacity' }}
-              className="container relative mx-auto px-6 py-8"
+              className="relative mx-auto w-full px-4 py-8 md:w-[90%] md:px-0"
             >
               <Head>
                 <title>Leaderboard – Maia Chess</title>

Original file line number	Diff line number	Diff line change
`@@ -49,7 +49,7 @@ export const SettingsPage: React.FC = () => {`
`49`	`49`	`animate="visible"`
`50`	`50`	`exit="exit"`
`51`	`51`	`style={{ willChange: 'transform, opacity' }}`
`52`		`- className="container relative mx-auto flex flex-col gap-6 px-6 py-8 md:gap-8"`
	`52`	`+ className="relative mx-auto flex w-full flex-col gap-6 px-4 py-8 md:w-[90%] md:gap-8 md:px-0"`
`53`	`53`	`>`
`54`	`54`	`{/* Header */}`
`55`	`55`	`<motion.div variants={itemVariants} className="flex flex-col gap-2">`
Original file line number	Diff line number	Diff line change
`@@ -130,7 +130,7 @@ const Leaderboard: React.FC = () => {`
`130`	`130`	`animate="visible"`
`131`	`131`	`exit="exit"`
`132`	`132`	`style={{ willChange: 'transform, opacity' }}`
`133`		`- className="container relative mx-auto px-6 py-8"`
	`133`	`+ className="relative mx-auto w-full px-4 py-8 md:w-[90%] md:px-0"`
`134`	`134`	`>`
`135`	`135`	`<Head>`
`136`	`136`	`<title>Leaderboard – Maia Chess</title>`