diff --git a/public/assets/Activities/activity-finance.svg b/public/assets/Activities/activity-finance.svg new file mode 100644 index 00000000..52783f5c --- /dev/null +++ b/public/assets/Activities/activity-finance.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/assets/Activities/activity-journal.svg b/public/assets/Activities/activity-journal.svg new file mode 100644 index 00000000..57293fe2 --- /dev/null +++ b/public/assets/Activities/activity-journal.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/assets/Activities/activity-maze.svg b/public/assets/Activities/activity-maze.svg new file mode 100644 index 00000000..7e24cce1 --- /dev/null +++ b/public/assets/Activities/activity-maze.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/assets/Activities/activity-measure.svg b/public/assets/Activities/activity-measure.svg new file mode 100644 index 00000000..65cefe24 --- /dev/null +++ b/public/assets/Activities/activity-measure.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/assets/Activities/activity-numbers.svg b/public/assets/Activities/activity-numbers.svg new file mode 100644 index 00000000..28af8dc7 --- /dev/null +++ b/public/assets/Activities/activity-numbers.svg @@ -0,0 +1 @@ +9 \ No newline at end of file diff --git a/public/assets/Activities/activity-recall.svg b/public/assets/Activities/activity-recall.svg new file mode 100644 index 00000000..f07bfa96 --- /dev/null +++ b/public/assets/Activities/activity-recall.svg @@ -0,0 +1 @@ +? \ No newline at end of file diff --git a/public/assets/Activities/activity-ruler.svg b/public/assets/Activities/activity-ruler.svg new file mode 100644 index 00000000..49bf2333 --- /dev/null +++ b/public/assets/Activities/activity-ruler.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/assets/Activities/activity-star-chart.svg b/public/assets/Activities/activity-star-chart.svg new file mode 100644 index 00000000..c0efb6bc --- /dev/null +++ b/public/assets/Activities/activity-star-chart.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/assets/Activities/activity-turtle3d.svg b/public/assets/Activities/activity-turtle3d.svg new file mode 100644 index 00000000..de32e58c --- /dev/null +++ b/public/assets/Activities/activity-turtle3d.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/assets/Activities/activity-turtlepond.svg b/public/assets/Activities/activity-turtlepond.svg new file mode 100644 index 00000000..bf5f738f --- /dev/null +++ b/public/assets/Activities/activity-turtlepond.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/assets/Activities/activity-typing.svg b/public/assets/Activities/activity-typing.svg new file mode 100644 index 00000000..08ef564c --- /dev/null +++ b/public/assets/Activities/activity-typing.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/assets/Activities/activity-words.svg b/public/assets/Activities/activity-words.svg new file mode 100644 index 00000000..d380d7cd --- /dev/null +++ b/public/assets/Activities/activity-words.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/TryMore3D.tsx b/src/components/TryMore3D.tsx index 638166b7..ee2e42eb 100644 --- a/src/components/TryMore3D.tsx +++ b/src/components/TryMore3D.tsx @@ -16,27 +16,32 @@ import { const ReviewCard = ({ img, - name, - username, - body, + title, + description, + buttonText, }: { img: string; - name: string; - username: string; - body: string; + title: string; + description: string; + buttonText: string; }) => { return ( -
-
- -
-
- {name} -
-

{username}

-
-
-
{body}
+
+ {/* SVG Icon */} + {title} + + {/* Title */} +
+ {title} +
+ + {/* Description */} +

{description}

+ + {/* Button */} +
); }; @@ -45,6 +50,7 @@ export function TryMore() { return (
+ {/* Left Side Content */} + {/* Marquee Section */}
{firstRow.map((review) => ( - + ))} {secondRow.map((review) => ( - + ))} {thirdRow.map((review) => ( - + ))} {fourthRow.map((review) => ( - + ))}
diff --git a/src/constants/TryMore3D.ts b/src/constants/TryMore3D.ts index 77217991..a83ffbdd 100644 --- a/src/constants/TryMore3D.ts +++ b/src/constants/TryMore3D.ts @@ -1,25 +1,31 @@ -export const tryMoreReviews = [ +export const tryMoreActivities = [ { - name: 'Jack', - username: '@jack', - body: "I've never seen anything like this before. It's amazing. I love it.", - img: 'https://avatar.vercel.sh/jack', + title: 'Finance', + description: 'Roleplay with money', + buttonText: 'Get Finance', + img: 'assets/Activities/activity-finance.svg', // Update with actual SVG path }, { - name: 'Jill', - username: '@jill', - body: "I don't know what to say. I'm speechless. This is amazing.", - img: 'https://avatar.vercel.sh/jill', + title: 'Maze', + description: 'Have fun with progressive challenges', + buttonText: 'Get Maze', + img: 'assets/Activities/activity-maze.svg', // Update with actual SVG path }, { - name: 'John', - username: '@john', - body: "I'm at a loss for words. This is amazing. I love it.", - img: 'https://avatar.vercel.sh/john', + title: 'Paint', + description: 'Express your creativity', + buttonText: 'Get Paint', + img: 'assets/Activities/activity-finance.svg', // Example, add more as needed }, ]; -export const firstRow = tryMoreReviews.slice(0, tryMoreReviews.length / 2); -export const secondRow = tryMoreReviews.slice(tryMoreReviews.length / 2); -export const thirdRow = tryMoreReviews.slice(0, tryMoreReviews.length / 2); -export const fourthRow = tryMoreReviews.slice(tryMoreReviews.length / 2); +export const firstRow = tryMoreActivities.slice( + 0, + tryMoreActivities.length / 2, +); +export const secondRow = tryMoreActivities.slice(tryMoreActivities.length / 2); +export const thirdRow = tryMoreActivities.slice( + 0, + tryMoreActivities.length / 2, +); +export const fourthRow = tryMoreActivities.slice(tryMoreActivities.length / 2);