diff --git a/src/components/Dashboard.tsx b/src/components/Dashboard.tsx new file mode 100644 index 0000000..14c799b --- /dev/null +++ b/src/components/Dashboard.tsx @@ -0,0 +1,260 @@ +import * as React from "react"; + +function UpdatedComponent(props: any) { + return ( +
+
+

Compound

+ + +
+
+ +
+
+

+ Welcome back, Jyaleen! +

+

+ Some text here +

+
+
+
+

Profile

+ +
+
+
+
+ + +

+ 128 points +

+
+
+
+

+ Jyaleen Wu +

+

+ Salt Lake City, Utah +

+

+ xxxxxx +

+
+
+ +

+ 128 points +

+
+
+
+ +

+ 128 points +

+
+
+
+
+ +
+

+ Recently completed +

+

+ See all +

+
+
+
+
+
+
+
+ +

+ Lesson Title +

+
+
+
+
+ +

+ Lesson Title +

+
+
+
+
+ +

+ Lesson Title +

+
+
+
+
+
+
+

+ Achievements +

+

See all

+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

+ Jump back in! +

+ +
+
+
+
+
+

+ Lesson Title +

+

+ Short description +

+ +
+
+ 3/5 +
+
+
+
+
+ +

+ View all +

+
+
+
+
+
+
+ Financial Wellness +
+
+
+
+
+

+ My Mentors +

+

+ This is a product description. +

+ +
+
+
+
+

+ Financial Tools +

+

+ This is a product description. +

+ +
+
+
+
+
+ ); +} + +export default UpdatedComponent; diff --git a/src/components/FinancialLiteracyComponent.tsx b/src/components/FinancialLiteracyComponent.tsx new file mode 100644 index 0000000..329e07c --- /dev/null +++ b/src/components/FinancialLiteracyComponent.tsx @@ -0,0 +1,320 @@ +import * as React from "react"; + +export function LearningComponent(props: any) { + return ( +
+

+ How you'll learn +

+ Learning Image +
+ ); +} + +export function Carousel(props: any) { + return ( +
+

+ What you'll learn +

+
+
+
+ +
+
+
+

+ Budgeting +

+
+

+ Preview of what the module contains +

+
+ Module Preview + + Learn More Icon +
+
+
+
+ +
+
+
+
+ ); +} + +function FinancialLiteracyComponent(props: any) { + return ( +
+
+

Compound

+ + Log in + +
+
+
+
+
+
+

+ Empower & Educate: Financial Literacy for All +

+

+ We're here to bridge the knowledge gap and level the playing + field, one lesson at a time. +

+
+
+
+
+ +
+ +
+ +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+

+ Turn Pennies into Prosperity:
Begin your Financial + Adventure Here +

+
+
+
+

+ Compound offers a diverse range of interactive courses to + empower minorities, women, and teenagers with the financial + knowledge they need to thrive. +

+ +
+
+
+
+
+
+
+
+ 30% +
+ +
+ of Black Americans are financially literate compared to 55% of white + Americans +
+
+ +
+
+ 35% +
+ +
+ of women could answer four or five basic financial literacy + questions correctly, compared to 55% of men +
+
+ +
+
+ 17 +
+ +
+ 17 states in the United States require high school students to take + a course in personal finance +
+
+
+ + + {/*
+ + + +
*/} +
+

+ What our users say +

+
+
+
+
+
+
+
+
+ Aisha +
+
+

+ Super easy and clear! I can not recommend it enough Super + easy and clear! I can not recommend it enough. +

+
+
+
+
+
+
+
+
+
+
+
+ Youssef +
+
+ Wanted to learn about investing, and Compound made it + 10x easier +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

+ A message from our founder... +

+

+ "As the founder of Compound, I've seen firsthand the + life-changing impact of financial literacy. Understanding + money isn't just about dollars and cents; it's about + empowerment, security, and creating a brighter future. That's + why we're dedicated to bringing this knowledge to those who + need it most. With the right education, we can break barriers, + build wealth, and thrive. Together, let's embark on this + journey to financial freedom." +
+ -Amanda, founder at Compound +

+
+
+
+
+
+
+
+ ); +} + +export default FinancialLiteracyComponent; diff --git a/src/components/ProgressThing.tsx b/src/components/ProgressThing.tsx new file mode 100644 index 0000000..f1f9f64 --- /dev/null +++ b/src/components/ProgressThing.tsx @@ -0,0 +1,132 @@ +import * as React from "react"; + +export function Carousel(props: any) { + return ( +
+

+ What you'll learn +

+
+
+
+ +
+
+
+

+ Budgeting +

+
+

+ Preview of what the module contains +

+
+ Module Preview + + Learn More Icon +
+
+
+
+ +
+
+
+
+ ); +} +function ProgressComponent(props: any) { + return ( +
+
+

+ 30% +

+ +
+ +
+

+ + 35% + + +

+ +
+ +
+

+ 17 +

+ +
+
+ ); +} + +export default ProgressComponent; diff --git a/src/pages/profile/index.tsx b/src/pages/profile/index.tsx index ec7c912..bb05540 100644 --- a/src/pages/profile/index.tsx +++ b/src/pages/profile/index.tsx @@ -1,12 +1,18 @@ import ProfileComponent from "@/components/ProfileComponent"; import ProfileSetup from "@/components/ProfileSetup"; import SkipSection from "@/components/Skip"; +import ProgressComponent from "@/components/ProgressThing"; +import FinancialLiteracyComponent from "@/components/FinancialLiteracyComponent"; +import Dashboard from "@/components/Dashboard"; export default function Home() { return (
- + {/* + */} {/* */} + {/* */} +
); }