diff --git a/src/app/page.tsx b/src/app/page.tsx index 473d389..ac8f20d 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,3 +1,8 @@ +import Image from "next/image" +import { FiFacebook, FiGithub, FiInstagram, FiLinkedin } from "react-icons/fi" +import discord from "@/assets/icons/discord.svg" +import telegram from "@/assets/icons/telegram.svg" +import { CardMultipleIcons } from "@/components/card-multiple-icons" import { Hero } from "@/components/home/hero" import { Materials } from "@/components/home/materials" @@ -6,6 +11,18 @@ export default function Home() {
+
+ , + , + , + , + Discord, + , + ]} + /> +
) } diff --git a/src/assets/icons/discord.svg b/src/assets/icons/discord.svg new file mode 100644 index 0000000..4ca8133 --- /dev/null +++ b/src/assets/icons/discord.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/assets/icons/telegram.svg b/src/assets/icons/telegram.svg new file mode 100644 index 0000000..b2516ca --- /dev/null +++ b/src/assets/icons/telegram.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/card-multiple-icons/index.tsx b/src/components/card-multiple-icons/index.tsx new file mode 100644 index 0000000..b2d60d8 --- /dev/null +++ b/src/components/card-multiple-icons/index.tsx @@ -0,0 +1,28 @@ +import * as React from "react" +import { Glass } from "@/components/glass" +import { cn } from "@/lib/utils" +import type { CardMultipleIconsProps } from "./types" + +export function CardMultipleIcons({ icons, className }: CardMultipleIconsProps) { + const iconItems = React.Children.toArray(icons) + + return ( + +
+ {iconItems.map((icon) => ( + + {icon} + + ))} +
+ + ) +} diff --git a/src/components/card-multiple-icons/types.ts b/src/components/card-multiple-icons/types.ts new file mode 100644 index 0000000..e8a12ff --- /dev/null +++ b/src/components/card-multiple-icons/types.ts @@ -0,0 +1,6 @@ +import type * as React from "react" + +export type CardMultipleIconsProps = { + icons: React.ReactNode[] + className?: string +}