diff --git a/app/components/FloatingDonateButton.tsx b/app/components/FloatingDonateButton.tsx new file mode 100644 index 0000000..15d3b66 --- /dev/null +++ b/app/components/FloatingDonateButton.tsx @@ -0,0 +1,59 @@ +"use client"; + +import { useEffect, useState } from "react"; +import { motion } from "framer-motion"; +import Image from "next/image"; + +export function FloatingDonateButton() { + const [shake, setShake] = useState(false); + + useEffect(() => { + // Primeira animação após 5 segundos + const initialTimer = setTimeout(() => { + setShake(true); + setTimeout(() => setShake(false), 1000); + }, 5000); + + // Animação repetida a cada 30 segundos + const interval = setInterval(() => { + setShake(true); + setTimeout(() => setShake(false), 1000); + }, 30000); + + return () => { + clearTimeout(initialTimer); + clearInterval(interval); + }; + }, []); + + return ( + + + Buy Me a Coffee + + + ); +} diff --git a/app/layout.tsx b/app/layout.tsx index 6785154..b84eb2f 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -2,6 +2,7 @@ import "./globals.css"; import { Metadata } from "next"; import { Inter } from "next/font/google"; import { ThemeProvider } from "@/app/providers"; +import { FloatingDonateButton } from "@/app/components/FloatingDonateButton"; // Use Inter como fallback já que é uma fonte similar à Geist const inter = Inter({ subsets: ["latin"] }); @@ -64,6 +65,7 @@ export default function RootLayout({ {children} + );