feat: remove bottom padding from landing page sections

- Change all sections from py (vertical padding) to pt/pb split
- Set pb (bottom padding) to 0 for all sections
- Keep pt (top padding) at original values (xs: 10-12, md: 16-20)
- Removes 128px bottom spacing on desktop (md breakpoint)
- Creates tighter, more cohesive visual flow between sections

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-10-11 07:37:37 +00:00
parent c4be60e387
commit 69bcbbb594

View File

@@ -75,7 +75,8 @@ export default function Home() {
sx={{
background: 'linear-gradient(135deg, #009688 0%, #00796B 100%)',
color: 'white',
py: { xs: 12, md: 20 },
pt: { xs: 12, md: 20 },
pb: 0,
textAlign: 'center',
position: 'relative',
overflow: 'hidden',
@@ -149,7 +150,7 @@ export default function Home() {
</Box>
{/* Mission Section */}
<Container maxWidth="md" sx={{ py: { xs: 10, md: 16 }, textAlign: 'center' }}>
<Container maxWidth="md" sx={{ pt: { xs: 10, md: 16 }, pb: 0, textAlign: 'center' }}>
<Typography
variant="h2"
sx={{
@@ -219,7 +220,7 @@ export default function Home() {
<Divider sx={{ maxWidth: 200, mx: 'auto', borderColor: 'grey.300' }} />
{/* Donation Pitch Section */}
<Container maxWidth="md" sx={{ py: { xs: 10, md: 16 }, textAlign: 'center' }}>
<Container maxWidth="md" sx={{ pt: { xs: 10, md: 16 }, pb: 0, textAlign: 'center' }}>
<Typography
variant="h2"
sx={{
@@ -289,7 +290,7 @@ export default function Home() {
</Container>
{/* Features Section */}
<Box sx={{ bgcolor: 'grey.50', py: { xs: 10, md: 16 } }}>
<Box sx={{ bgcolor: 'grey.50', pt: { xs: 10, md: 16 }, pb: 0 }}>
<Container maxWidth="lg">
<Typography
variant="h2"
@@ -353,7 +354,7 @@ export default function Home() {
</Box>
{/* Donation Options Section */}
<Container maxWidth="md" sx={{ py: { xs: 10, md: 16 }, textAlign: 'center' }}>
<Container maxWidth="md" sx={{ pt: { xs: 10, md: 16 }, pb: 0, textAlign: 'center' }}>
<Typography
variant="h2"
sx={{
@@ -420,7 +421,7 @@ export default function Home() {
</Container>
{/* Why It Matters Section */}
<Box sx={{ bgcolor: 'grey.900', color: 'white', py: { xs: 10, md: 16 } }}>
<Box sx={{ bgcolor: 'grey.900', color: 'white', pt: { xs: 10, md: 16 }, pb: 0 }}>
<Container maxWidth="md" sx={{ textAlign: 'center' }}>
<Typography
variant="h2"
@@ -479,7 +480,7 @@ export default function Home() {
</Box>
{/* Join the Mission Section */}
<Container maxWidth="md" sx={{ py: { xs: 10, md: 16 }, textAlign: 'center' }}>
<Container maxWidth="md" sx={{ pt: { xs: 10, md: 16 }, pb: 0, textAlign: 'center' }}>
<Typography
variant="h2"
sx={{
@@ -559,7 +560,8 @@ export default function Home() {
sx={{
background: 'linear-gradient(135deg, #009688 0%, #00796B 100%)',
color: 'white',
py: 8,
pt: 8,
pb: 0,
textAlign: 'center',
}}
>