imnyang
aa721322da- Updated dependencies in bun.lock and package.json to specific versions for better stability. - Added a new Contact component to display contact methods with tooltips. - Introduced a Banner component for notifications with customizable actions. - Enhanced the Dialog, Checkbox, Button, Input, and Label components for better usability and styling. - Integrated react-snowfall for a snow effect in the main page. - Added a Discord SVG icon to the project.
55 lines
No EOL
1.6 KiB
TypeScript
55 lines
No EOL
1.6 KiB
TypeScript
import { Github, Instagram, MailIcon } from "lucide-react";
|
|
import {
|
|
Tooltip,
|
|
TooltipContent,
|
|
TooltipTrigger,
|
|
} from "@/components/ui/tooltip";
|
|
import Image from "next/image";
|
|
|
|
const contact = [
|
|
{
|
|
"name": "Email",
|
|
"url": "mailto:me@imnya.ng",
|
|
"icon": <MailIcon className="w-5 h-5" />,
|
|
},
|
|
{
|
|
"name": "GitHub",
|
|
"url": "https://github.com/imnyang",
|
|
"icon": <Github className="w-5 h-5" />
|
|
},
|
|
{
|
|
"name": "Instagram",
|
|
"url": "https://instagram.com/imnya.ng",
|
|
"icon": <Instagram className="w-5 h-5" />
|
|
},
|
|
{
|
|
"name": "Discord",
|
|
"url": "https://imnya.ng/discord",
|
|
"icon": <Image src="/icon/discord.svg" alt="Discord" width={20} height={20} className="w-5 h-5" />
|
|
},
|
|
|
|
]
|
|
|
|
export default function Contact() {
|
|
return (
|
|
<div className="flex flex-row space-x-4">
|
|
{contact.map((method) => (
|
|
<Tooltip key={method.name} >
|
|
<TooltipTrigger asChild>
|
|
<a
|
|
href={method.url}
|
|
className="flex items-center space-x-2 text-foreground/80 hover:text-foreground transition-colors"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
{method.icon}
|
|
</a>
|
|
</TooltipTrigger>
|
|
<TooltipContent>
|
|
<p>{method.name}</p>
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
))}
|
|
</div>
|
|
);
|
|
} |