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