diff --git a/app/about_us/Boulder_Worldcup_Vienna_28-05-2010_quali-w100_Alex_Johnson.jpg b/app/about_us/Boulder_Worldcup_Vienna_28-05-2010_quali-w100_Alex_Johnson.jpg new file mode 100644 index 00000000..94784464 Binary files /dev/null and b/app/about_us/Boulder_Worldcup_Vienna_28-05-2010_quali-w100_Alex_Johnson.jpg differ diff --git a/app/about_us/D52_5662.jpg b/app/about_us/D52_5662.jpg new file mode 100644 index 00000000..fef96b8a Binary files /dev/null and b/app/about_us/D52_5662.jpg differ diff --git a/app/about_us/Jordan-M-Smith.webp b/app/about_us/Jordan-M-Smith.webp new file mode 100644 index 00000000..69e2fc92 Binary files /dev/null and b/app/about_us/Jordan-M-Smith.webp differ diff --git a/app/about_us/Morgan.webp b/app/about_us/Morgan.webp new file mode 100644 index 00000000..ad3f328c Binary files /dev/null and b/app/about_us/Morgan.webp differ diff --git a/app/about_us/OurCrew.js b/app/about_us/OurCrew.js new file mode 100644 index 00000000..4de1cf03 --- /dev/null +++ b/app/about_us/OurCrew.js @@ -0,0 +1,25 @@ +const OurCrew = () => { + const crewMembers = [ + { name: "Alex Johnson", role: "Captain", image: "react-1-hw/app/about_us/Boulder_Worldcup_Vienna_28-05-2010_quali-w100_Alex_Johnson.jpg" }, + { name: "Jordan Smith", role: "Engineer", image: "D:\HYF\Homework\class30-homework\react\react1\week1\react-1-hw\app\about_us\D52_5662.jpg" }, + { name: "Taylor Lee", role: "Navigator", image: "D:\HYF\Homework\class30-homework\react\react1\week1\react-1-hw\app\about_us\Taylor-Lee-scaled.jpg" }, + { name: "Morgan Davis", role: "Communications", image: "D:\HYF\Homework\class30-homework\react\react1\week1\react-1-hw\app\about_us\Morgan.webp"}, + ]; + + return ( +
+
+ {crewMembers.map((member, index) => ( +
+ {member.name} +

{member.name}

+

{member.role}

+
+ ))} +
+
+ ); + }; \ No newline at end of file diff --git a/app/about_us/OurPartners.js b/app/about_us/OurPartners.js new file mode 100644 index 00000000..3e942923 --- /dev/null +++ b/app/about_us/OurPartners.js @@ -0,0 +1,24 @@ +const OurPartners = () => { + const partners = [ + { name: "TechCorp", logo: "/partners/techcorp.png" }, + { name: "InnovateX", logo: "/partners/innovatex.png" }, + ]; + + return ( +
+
+ {partners.map((partner, index) => ( +
+ {partner.name} +

{partner.name}

+
+ ))}; +
+
+ ); + }; + \ No newline at end of file diff --git a/app/about_us/OurValues.js b/app/about_us/OurValues.js new file mode 100644 index 00000000..9e9df7b6 --- /dev/null +++ b/app/about_us/OurValues.js @@ -0,0 +1,20 @@ +const OurValues = () => { + const values = [ + { title: "Integrity", description: "We uphold the highest standards of honesty and ethics in all we do." }, + { title: "Innovation", description: "We embrace creativity and strive for continuous improvement." }, + { title: "Collaboration", description: "We work together to achieve more than we could alone." }, + { title: "Customer Focus", description: "Our customers are at the center of everything we do." }, + ]; + return ( +
+
+ {values.map((value, index) => ( +
+

{value.title}

+

{value.description}

+
+ ))} +
+
+ ); + }; \ No newline at end of file diff --git a/app/about_us/Taylor-Lee-scaled.jpg b/app/about_us/Taylor-Lee-scaled.jpg new file mode 100644 index 00000000..a031576e Binary files /dev/null and b/app/about_us/Taylor-Lee-scaled.jpg differ diff --git a/app/about_us/page.js b/app/about_us/page.js index 880ec427..8019e203 100644 --- a/app/about_us/page.js +++ b/app/about_us/page.js @@ -1,41 +1,7 @@ import styles from './page.module.css'; - -// TASK - React 1 week 1 -// After you are finished with creating the page, move the OurValues, OurCrew, OurPartners components into their own files -// OurValues.js, OurCrew.js, OurPartners.js should live in this folder -// import and use the components from the newly created files - -const OurValues = () => { - // TASK - React 1 week 1 - // Create the "Our Values" section - // Use the descriptions provided in /app/about_us/README.md - // Some inspiration ideas found in /data/inspiration_about_us - return ( -

ADD OUR VALUES HERE

- ); -}; - -const OurCrew = () => { - // TASK - React 1 week 1 - // Create the "Our Crew section" - // Use the descriptions provided in /app/about_us/README.md - // Use the pictures from /public/crew - // Some inspiration ideas found in /data/inspiration_about_us - return ( -

ADD OUR CREW HERE

- ); -} - -const OurPartners = () => { - // TASK - React 1 week 1 - // Create the "Our Crew section" - // Use the descriptions provided in /app/about_us/README.md - // Use the pictures from /public/crew - // Some inspiration ideas found in /data/inspiration_about_us - return ( -

ADD OUR Partners HERE

- ); -} +import OurValues from './OurValues.js'; +import OurCrew from './OurCrew.js'; +import OurPartners from './OurPartners.js'; export const Crew = () => { @@ -51,9 +17,10 @@ export const Crew = () => {

The crew

- - {/* TASK - React 1 week 1 */} - {/* Add in the "OurPartners" component here */} +
+

Our Partners

+ +
); diff --git a/app/layout.js b/app/layout.js index 87ee54a8..3b5d987e 100644 --- a/app/layout.js +++ b/app/layout.js @@ -17,9 +17,7 @@ export const RootLayout = ({ children }) => { {children} - {/* TASK - React 1 week 1 */} - {/* Import and use the Footer component here */} - {/* Footer found in the ui/Footer.js folder */} +