summaryrefslogtreecommitdiff
path: root/apps/web/src/components/ui/sponsor-button.tsx
diff options
context:
space:
mode:
authorHyteq <DerpsDer.es@gmail.com>2025-07-20 11:00:22 +0300
committerHyteq <DerpsDer.es@gmail.com>2025-07-20 11:00:22 +0300
commitbe1ae20d9089e81cb84a8294be76fe680a24b60f (patch)
tree48472c1122d35f45f802bbd1c3cf2c15f653f9cf /apps/web/src/components/ui/sponsor-button.tsx
parentede08dac416b47eac2db151969c164bdf0f06002 (diff)
downloadopencut-be1ae20d9089e81cb84a8294be76fe680a24b60f.tar.gz
format
Diffstat (limited to 'apps/web/src/components/ui/sponsor-button.tsx')
-rw-r--r--apps/web/src/components/ui/sponsor-button.tsx57
1 files changed, 28 insertions, 29 deletions
diff --git a/apps/web/src/components/ui/sponsor-button.tsx b/apps/web/src/components/ui/sponsor-button.tsx
index 79c708a2..ffbd8a4f 100644
--- a/apps/web/src/components/ui/sponsor-button.tsx
+++ b/apps/web/src/components/ui/sponsor-button.tsx
@@ -2,39 +2,38 @@ import { motion } from "motion/react";
import { ComponentType } from "react";
interface SponsorButtonProps {
- href: string;
- logo: ComponentType<{ className?: string }>;
- companyName: string;
- className?: string;
+ href: string;
+ logo: ComponentType<{ className?: string }>;
+ companyName: string;
+ className?: string;
}
export function SponsorButton({
- href,
- logo: Logo,
- companyName,
- className = "",
+ href,
+ logo: Logo,
+ companyName,
+ className = "",
}: SponsorButtonProps) {
+ return (
+ <motion.a
+ href={href}
+ target="_blank"
+ rel="noopener noreferrer"
+ className={`inline-flex items-center gap-2 px-3 py-2 rounded-full border border-white/10 bg-white/5 backdrop-blur-sm hover:bg-white/10 hover:border-white/20 transition-all duration-200 group shadow-lg ${className}`}
+ >
+ <span className="text-xs font-medium text-zinc-400 group-hover:text-zinc-300 transition-colors">
+ Sponsored by
+ </span>
- return (
- <motion.a
- href={href}
- target="_blank"
- rel="noopener noreferrer"
- className={`inline-flex items-center gap-2 px-3 py-2 rounded-full border border-white/10 bg-white/5 backdrop-blur-sm hover:bg-white/10 hover:border-white/20 transition-all duration-200 group shadow-lg ${className}`}
- >
- <span className="text-xs font-medium text-zinc-400 group-hover:text-zinc-300 transition-colors">
- Sponsored by
- </span>
+ <div className="flex items-center gap-1.5">
+ <div className="text-zinc-100 group-hover:text-white transition-colors">
+ <Logo className="w-4 h-4" />
+ </div>
- <div className="flex items-center gap-1.5">
- <div className="text-zinc-100 group-hover:text-white transition-colors">
- <Logo className="w-4 h-4" />
- </div>
-
- <span className="text-xs font-medium text-zinc-100 group-hover:text-white transition-colors">
- {companyName}
- </span>
- </div>
- </motion.a>
- );
+ <span className="text-xs font-medium text-zinc-100 group-hover:text-white transition-colors">
+ {companyName}
+ </span>
+ </div>
+ </motion.a>
+ );
}