Files
7d9d4027-c066-469d-8d84-eb9…/src/components/common/GlassmorphicBadge.tsx

22 lines
594 B
TypeScript

"use client";
import { useState, useEffect } from "react";
import { getRandomFact } from "@/utils/facts";
export default function GlassmorphicBadge() {
const [fact, setFact] = useState<string>("");
useEffect(() => {
setFact(getRandomFact());
}, []);
if (!fact) return null;
return (
<div className="absolute bottom-4 right-4 z-20 max-w-[250px] p-3 rounded-[var(--radius)] shadow-lg text-xs
bg-card/50 backdrop-blur-md border border-foreground/10 text-foreground">
<p className="font-bold mb-1">Fun Fact!</p>
<p>{fact}</p>
</div>
);
}