diff options
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/Desktop.tsx | 2 | ||||
| -rw-r--r-- | src/components/Mobile.tsx | 2 | ||||
| -rw-r--r-- | src/components/RsvpForm.tsx | 2 | ||||
| -rw-r--r-- | src/components/Schedule.tsx | 48 |
4 files changed, 34 insertions, 20 deletions
diff --git a/src/components/Desktop.tsx b/src/components/Desktop.tsx index 72b583d..13de4ee 100644 --- a/src/components/Desktop.tsx +++ b/src/components/Desktop.tsx @@ -20,7 +20,7 @@ function Desktop() { </Button> ))} <IconButton color="inherit" onClick={toggleColorMode}> - {theme.palette.mode === 'dark' ? <DarkModeIcon /> : <LightModeIcon />} + {theme.palette.mode === 'dark' ? <LightModeIcon /> : <DarkModeIcon />} </IconButton> </div> ); diff --git a/src/components/Mobile.tsx b/src/components/Mobile.tsx index 7d790e1..2e7b15c 100644 --- a/src/components/Mobile.tsx +++ b/src/components/Mobile.tsx @@ -25,7 +25,7 @@ function Mobile() { return ( <> <IconButton color="inherit" onClick={toggleColorMode}> - {theme.palette.mode === 'dark' ? <DarkModeIcon /> : <LightModeIcon />} + {theme.palette.mode === 'dark' ? <LightModeIcon /> : <DarkModeIcon />} </IconButton> <IconButton color="inherit" diff --git a/src/components/RsvpForm.tsx b/src/components/RsvpForm.tsx index 9e957f8..99d3059 100644 --- a/src/components/RsvpForm.tsx +++ b/src/components/RsvpForm.tsx @@ -95,7 +95,7 @@ function RsvpForm() { > <Grid container spacing={2} sx={{ mt: 8 }}> <Grid item xs={12}> - <p style={{ textAlign: 'center' }}> + <p> Please RSVP for the wedding by March 10, 2025. The ceremony will commence at 3 pm on April 26 in Divine Shepherd. The reception will follow at 5 pm in A Venue on the Ridge. diff --git a/src/components/Schedule.tsx b/src/components/Schedule.tsx index 08b10e2..d941a18 100644 --- a/src/components/Schedule.tsx +++ b/src/components/Schedule.tsx @@ -1,20 +1,20 @@ import React from 'react'; -import { Container, Paper } from '@mui/material'; -import PlaceIcon from '@mui/icons-material/Place'; +import { Container, Paper, Typography, useTheme } from '@mui/material'; function Schedule() { + const theme = useTheme(); return ( <Container maxWidth="md" - style={{ - top: '1800', + sx={{ display: 'flex', justifyContent: 'center', }} > <Paper elevation={3} - style={{ + sx={{ + mt: 8, height: '50%', width: '100%', display: 'flex', @@ -40,21 +40,36 @@ function Schedule() { }} > <div style={{ width: '35%' }}> - <h2>2:00 PM</h2> + <p>April 26, 2025</p> </div> <div style={{ width: '65%' }}> - <h2>Ceremony</h2> - <h3> + <Typography variant="h5">Wedding Schedule</Typography> + </div> + </div> + <hr style={{ width: '100%' }} /> + <div + style={{ + height: '100%', + width: '100%', + display: 'flex', + alignItems: 'center', + }} + > + <div style={{ width: '35%' }}> + <p>2:00 PM</p> + </div> + <div style={{ width: '65%' }}> + <Typography variant="h6">Ceremony</Typography> + <p> Divine Shepherd <br /> <a href="https://maps.app.goo.gl/dGWvmjPiVjNGBVkZ9" - style={{ color: 'inherit', textDecoration: 'none' }} + style={{ color: theme.palette.primary.main }} > 15005 Q St, Omaha, NE 68137 - <PlaceIcon /> </a> - </h3> + </p> </div> </div> <hr style={{ width: '100%' }} /> @@ -67,21 +82,20 @@ function Schedule() { }} > <div style={{ width: '35%' }}> - <h2>4:00 PM</h2> + <p>4:00 PM</p> </div> <div style={{ width: '65%' }}> - <h2>Reception</h2> - <h3> + <Typography variant="h6">Reception</Typography> + <p> A Venue on the Ridge <br /> <a href="https://maps.app.goo.gl/35RRqxzQdq6E4eSMA" - style={{ color: 'inherit', textDecoration: 'none' }} + style={{ color: theme.palette.primary.main }} > 20033 Elkhorn Ridge Dr, Elkhorn, NE 68022 - <PlaceIcon /> </a> - </h3> + </p> </div> </div> </div> |