diff options
| author | Michael Hunteman <michael@huntm.net> | 2024-07-28 15:24:21 -0700 |
|---|---|---|
| committer | Michael Hunteman <michael@huntm.net> | 2024-07-28 15:24:21 -0700 |
| commit | 491ae774cf68ffaad8e6957d818c6e2e6588016e (patch) | |
| tree | cb97b7f4a63d3f3921e2a56c6da96d93aae5d5dd /client/src/components/Schedule.tsx | |
| parent | 145bf9aeedb88ded671b1f1b4700235379a11143 (diff) | |
Add photos
Diffstat (limited to 'client/src/components/Schedule.tsx')
| -rw-r--r-- | client/src/components/Schedule.tsx | 126 |
1 files changed, 57 insertions, 69 deletions
diff --git a/client/src/components/Schedule.tsx b/client/src/components/Schedule.tsx index bb5f809..cc6e8bd 100644 --- a/client/src/components/Schedule.tsx +++ b/client/src/components/Schedule.tsx @@ -1,12 +1,11 @@ import React from 'react'; -import { Container, Paper, Typography, useTheme } from '@mui/material'; +import { Paper, Typography, useTheme } from '@mui/material'; +import divineShepherd from '/divine-shepherd.jpg'; const FlexBox = (props: any) => { return ( <div style={{ - height: '100%', - width: '100%', display: 'flex', alignItems: 'center', }} @@ -19,83 +18,72 @@ const FlexBox = (props: any) => { function Schedule() { const theme = useTheme(); return ( - <Container - maxWidth="sm" - sx={{ + <div + style={{ + height: '100%', display: 'flex', justifyContent: 'center', + alignItems: 'center', + backgroundImage: `url(${divineShepherd})`, + backgroundSize: 'cover', }} > <Paper elevation={3} sx={{ - mt: 10, + width: 512, + mx: 0.5, px: 2, - height: '100%', - width: '100%', - display: 'flex', - flexDirection: 'column', - alignItems: 'center', }} > - <div - style={{ - height: '100%', - width: '100%', - display: 'flex', - flexDirection: 'column', - justifyContent: 'center', - }} - > - <FlexBox> - <div style={{ width: '35%' }}> - <p>April 26, 2025</p> - </div> - <div style={{ width: '65%' }}> - <Typography variant="h5">Wedding Schedule</Typography> - </div> - </FlexBox> - <hr style={{ width: '100%' }} /> - <FlexBox> - <div style={{ width: '35%' }}> - <p>3: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: theme.palette.primary.main }} - > - 15005 Q St, Omaha, NE 68137 - </a> - </p> - </div> - </FlexBox> - <hr style={{ width: '100%' }} /> - <FlexBox> - <div style={{ width: '35%' }}> - <p>5:00 PM</p> - </div> - <div style={{ width: '65%' }}> - <Typography variant="h6">Reception</Typography> - <p> - A Venue on the Ridge - <br /> - <a - href="https://maps.app.goo.gl/35RRqxzQdq6E4eSMA" - style={{ color: theme.palette.primary.main }} - > - 20033 Elkhorn Ridge Dr, Elkhorn, NE 68022 - </a> - </p> - </div> - </FlexBox> - </div> + <FlexBox> + <div style={{ width: '35%' }}> + <p>April 26, 2025</p> + </div> + <div style={{ width: '65%' }}> + <Typography variant="h5">Wedding Schedule</Typography> + </div> + </FlexBox> + <hr style={{ width: '100%' }} /> + <FlexBox> + <div style={{ width: '35%' }}> + <p>3: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: theme.palette.primary.main }} + > + 15005 Q St, Omaha, NE 68137 + </a> + </p> + </div> + </FlexBox> + <hr style={{ width: '100%' }} /> + <FlexBox> + <div style={{ width: '35%' }}> + <p>5:00 PM</p> + </div> + <div style={{ width: '65%' }}> + <Typography variant="h6">Reception</Typography> + <p> + A Venue on the Ridge + <br /> + <a + href="https://maps.app.goo.gl/35RRqxzQdq6E4eSMA" + style={{ color: theme.palette.primary.main }} + > + 20033 Elkhorn Ridge Dr, Elkhorn, NE 68022 + </a> + </p> + </div> + </FlexBox> </Paper> - </Container> + </div> ); } |