From 0f257786c4385fd3b8e3ff341eac7aa93449603a Mon Sep 17 00:00:00 2001 From: Rong Chen Date: Fri, 25 Aug 2023 19:43:30 -0400 Subject: [PATCH 1/2] progress --- src/assets/images/applyButton.svg | 40 +++++++++++++++ src/assets/images/felizSponsor.svg | 25 ++++++++++ src/assets/images/schedule.svg | 29 +++++++++++ src/assets/images/scheduleHeader.svg | 49 +++++++++++++++++++ src/assets/images/sponsorFaceBox.svg | 9 ++++ src/assets/images/sponsorHeader.svg | 49 +++++++++++++++++++ src/assets/images/sponsorHeartGroup.svg | 21 ++++++++ .../LandingPageComponents/Schedule.jsx | 11 +++++ .../LandingPageComponents/Sponsor.jsx | 26 ++++++++++ src/pages/LandingPage.jsx | 5 +- 10 files changed, 263 insertions(+), 1 deletion(-) create mode 100644 src/assets/images/applyButton.svg create mode 100644 src/assets/images/felizSponsor.svg create mode 100644 src/assets/images/schedule.svg create mode 100644 src/assets/images/scheduleHeader.svg create mode 100644 src/assets/images/sponsorFaceBox.svg create mode 100644 src/assets/images/sponsorHeader.svg create mode 100644 src/assets/images/sponsorHeartGroup.svg create mode 100644 src/components/LandingPageComponents/Schedule.jsx create mode 100644 src/components/LandingPageComponents/Sponsor.jsx diff --git a/src/assets/images/applyButton.svg b/src/assets/images/applyButton.svg new file mode 100644 index 0000000..0fc9827 --- /dev/null +++ b/src/assets/images/applyButton.svg @@ -0,0 +1,40 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/felizSponsor.svg b/src/assets/images/felizSponsor.svg new file mode 100644 index 0000000..4037624 --- /dev/null +++ b/src/assets/images/felizSponsor.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/schedule.svg b/src/assets/images/schedule.svg new file mode 100644 index 0000000..a19e11a --- /dev/null +++ b/src/assets/images/schedule.svg @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/scheduleHeader.svg b/src/assets/images/scheduleHeader.svg new file mode 100644 index 0000000..e7e2368 --- /dev/null +++ b/src/assets/images/scheduleHeader.svg @@ -0,0 +1,49 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/sponsorFaceBox.svg b/src/assets/images/sponsorFaceBox.svg new file mode 100644 index 0000000..eedc42f --- /dev/null +++ b/src/assets/images/sponsorFaceBox.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/assets/images/sponsorHeader.svg b/src/assets/images/sponsorHeader.svg new file mode 100644 index 0000000..551883b --- /dev/null +++ b/src/assets/images/sponsorHeader.svg @@ -0,0 +1,49 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/sponsorHeartGroup.svg b/src/assets/images/sponsorHeartGroup.svg new file mode 100644 index 0000000..bd9a188 --- /dev/null +++ b/src/assets/images/sponsorHeartGroup.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/LandingPageComponents/Schedule.jsx b/src/components/LandingPageComponents/Schedule.jsx new file mode 100644 index 0000000..76d9535 --- /dev/null +++ b/src/components/LandingPageComponents/Schedule.jsx @@ -0,0 +1,11 @@ +import React from 'react' +import scheduleTimeLine from '../../assets/images/schedule.svg' +import scheduleHeader from '../../assets/images/scheduleHeader.svg' +export default function Schedule() { + return ( +
+ schedule + schedule +
+ ) +} diff --git a/src/components/LandingPageComponents/Sponsor.jsx b/src/components/LandingPageComponents/Sponsor.jsx new file mode 100644 index 0000000..529f5fd --- /dev/null +++ b/src/components/LandingPageComponents/Sponsor.jsx @@ -0,0 +1,26 @@ +import React from "react"; +import felizSponsor from "../../assets/images/felizSponsor.svg"; +import sponsorHeader from "../../assets/images/sponsorHeader.svg"; +import sponsorFaceBox from "../../assets/images/sponsorFaceBox.svg"; +import sponsorHeartGroup from "../../assets/images/sponsorHeartGroup.svg"; +import applyButton from "../../assets/images/applyButton.svg"; +export default function Sponsor() { + const sponsors = [1, 2, 3, 4, 5, 6, 7, 8, 9, 11, 13, 14]; + return ( +
+ schedule + schedule +
+ {sponsors.map(() => ( +
+ + +
+ ))} +
+ +
+ ); +} diff --git a/src/pages/LandingPage.jsx b/src/pages/LandingPage.jsx index f12fb81..be25a9d 100644 --- a/src/pages/LandingPage.jsx +++ b/src/pages/LandingPage.jsx @@ -7,7 +7,8 @@ import LandingNav from '../components/LandingPageComponents/LandingNav'; import SponsorButton from '../components/SponsorPageComponents/SponsorButton'; import NatureBG from '../components/LandingPageComponents/NatureBG'; import TrackModals from '../components/LandingPageComponents/TrackModals'; - +import Schedule from '../components/LandingPageComponents/Schedule'; +import Sponsor from '../components/LandingPageComponents/Sponsor'; const LandingPage = () => { return (
{ + +
); From f87718038ec1269855964fceb8d5c39ac3fb298e Mon Sep 17 00:00:00 2001 From: DanYu12 Date: Sat, 26 Aug 2023 00:20:58 -0400 Subject: [PATCH 2/2] added track titles --- .../images/LandingPage/TracksTitleBG.svg | 48 ++++++ .../images/{faq_title.svg => TitleBG.svg} | 0 src/components/LandingPageComponents/FAQ.jsx | 2 +- .../LandingPageComponents/Schedule.jsx | 19 ++- .../LandingPageComponents/Sponsor.jsx | 21 ++- .../LandingPageComponents/TrackModals.tsx | 149 ++++++++++-------- .../SponsorPageComponents/SectionTitle.jsx | 22 +-- 7 files changed, 170 insertions(+), 91 deletions(-) create mode 100644 src/assets/images/LandingPage/TracksTitleBG.svg rename src/assets/images/{faq_title.svg => TitleBG.svg} (100%) diff --git a/src/assets/images/LandingPage/TracksTitleBG.svg b/src/assets/images/LandingPage/TracksTitleBG.svg new file mode 100644 index 0000000..f1ea110 --- /dev/null +++ b/src/assets/images/LandingPage/TracksTitleBG.svg @@ -0,0 +1,48 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/faq_title.svg b/src/assets/images/TitleBG.svg similarity index 100% rename from src/assets/images/faq_title.svg rename to src/assets/images/TitleBG.svg diff --git a/src/components/LandingPageComponents/FAQ.jsx b/src/components/LandingPageComponents/FAQ.jsx index 29ce4ec..c435c47 100644 --- a/src/components/LandingPageComponents/FAQ.jsx +++ b/src/components/LandingPageComponents/FAQ.jsx @@ -1,5 +1,5 @@ import { React, useState } from 'react'; -import faq_title from '../../assets/images/faq_title.svg'; +import faq_title from '../../assets/images/TitleBG.svg'; import OpenChest from '../../assets/images/BigTreasureChest_Open.png'; import ClosedChest from '../../assets/images/BigTreasureChest_Closed.png'; diff --git a/src/components/LandingPageComponents/Schedule.jsx b/src/components/LandingPageComponents/Schedule.jsx index 76d9535..87171b2 100644 --- a/src/components/LandingPageComponents/Schedule.jsx +++ b/src/components/LandingPageComponents/Schedule.jsx @@ -1,11 +1,18 @@ -import React from 'react' -import scheduleTimeLine from '../../assets/images/schedule.svg' -import scheduleHeader from '../../assets/images/scheduleHeader.svg' +import React from 'react'; +import scheduleTimeLine from '../../assets/images/schedule.svg'; +import scheduleHeader from '../../assets/images/scheduleHeader.svg'; +import TitleBG from '../../assets/images/TitleBG.svg'; + export default function Schedule() { return (
- schedule - schedule +
+

+ SCHEDULE +

+ TitleBG +
+ schedule
- ) + ); } diff --git a/src/components/LandingPageComponents/Sponsor.jsx b/src/components/LandingPageComponents/Sponsor.jsx index 529f5fd..c17cef3 100644 --- a/src/components/LandingPageComponents/Sponsor.jsx +++ b/src/components/LandingPageComponents/Sponsor.jsx @@ -1,15 +1,22 @@ -import React from "react"; -import felizSponsor from "../../assets/images/felizSponsor.svg"; -import sponsorHeader from "../../assets/images/sponsorHeader.svg"; -import sponsorFaceBox from "../../assets/images/sponsorFaceBox.svg"; -import sponsorHeartGroup from "../../assets/images/sponsorHeartGroup.svg"; -import applyButton from "../../assets/images/applyButton.svg"; +import React from 'react'; +import felizSponsor from '../../assets/images/felizSponsor.svg'; +import sponsorHeader from '../../assets/images/sponsorHeader.svg'; +import sponsorFaceBox from '../../assets/images/sponsorFaceBox.svg'; +import sponsorHeartGroup from '../../assets/images/sponsorHeartGroup.svg'; +import applyButton from '../../assets/images/applyButton.svg'; +import TitleBG from '../../assets/images/TitleBG.svg'; + export default function Sponsor() { const sponsors = [1, 2, 3, 4, 5, 6, 7, 8, 9, 11, 13, 14]; return (
schedule - schedule +
+

+ SPONSORS +

+ TitleBG +
{sponsors.map(() => (
diff --git a/src/components/LandingPageComponents/TrackModals.tsx b/src/components/LandingPageComponents/TrackModals.tsx index 5884176..de6ed67 100644 --- a/src/components/LandingPageComponents/TrackModals.tsx +++ b/src/components/LandingPageComponents/TrackModals.tsx @@ -4,6 +4,7 @@ import track2 from '../../assets/images/LandingPage/track2.png'; import track3 from '../../assets/images/LandingPage/track3.png'; import Modal from '@mui/material/Modal'; import test from '../../assets/images/LandingPage/test.svg'; +import TracksTitleBG from '../../assets/images/LandingPage/TracksTitleBG.svg'; const TrackModals = () => { const [track1Open, setTrack1Open] = useState(false); @@ -11,81 +12,93 @@ const TrackModals = () => { const [track3Open, setTrack3Open] = useState(false); return ( -
-
- + + +
+ { + setTrack1Open(false); }} > - track 1 - - - + test +
- { - setTrack1Open(false); - }} - > - test - - { - setTrack2Open(false); - }} - > - test - - { - setTrack3Open(false); - }} - > - test -
); }; diff --git a/src/components/SponsorPageComponents/SectionTitle.jsx b/src/components/SponsorPageComponents/SectionTitle.jsx index d191b53..d7f9cb4 100644 --- a/src/components/SponsorPageComponents/SectionTitle.jsx +++ b/src/components/SponsorPageComponents/SectionTitle.jsx @@ -1,14 +1,18 @@ -import { ReactComponent as SponsorFAQ} from '../../assets/images/faq_title.svg'; +import { ReactComponent as SponsorFAQ } from '../../assets/images/TitleBG.svg'; -const SectionTitle = ({extraStyling, text}) => { - return ( -
+const SectionTitle = ({ extraStyling, text }) => { + return ( +
-
-

{text}

+
+

+ {text} +

- ); -} + ); +}; -export default SectionTitle; \ No newline at end of file +export default SectionTitle;