A simple animation for the shadcn Button using Motion

// Detect dark theme var iframe = document.getElementById('tweet-2033684954526196158-298'); if (document.body.className.includes('dark-theme')) { iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=2033684954526196158&theme=dark" } A small hover effect can already make the UI feel more polished. Here’s a simple example using Motion with a shadcn Button. import { Star } from ' lucide-react ' import { AnimatePresence , motion } from ' motion/react ' import Link from ' next/link ' import { useState } from ' react ' import { Button } from ' @/components/ui/button ' export function ButtonGithub () { const [ isHovered , setIsHovered ] = useState ( false ) return ( < Button asChild size = "sm" variant = "ghost" className = "rounded-xl" onMouseEnter = { () => setIsHovered ( true ) } onMouseLeave = { () => setIsHovered ( false ) } > < Link href = "https://github.com/felipemenezes098/ui-flx" target = "_blank" className = "flex items-center gap-2" > < span className = "relative size-4"