'use client'; import { useState } from 'react'; import { motion, easeOut } from 'framer-motion'; import { MoveRight } from 'lucide-react'; export default function LoginPage() { const [email, setEmail] = useState(''); const containerVariants = { hidden: { opacity: 0 }, visible: { opacity: 1, transition: { duration: 0.8, staggerChildren: 0.1, }, }, }; const itemVariants = { hidden: { opacity: 0, y: 20 }, visible: { opacity: 1, y: 0, transition: { duration: 0.6, ease: easeOut }, }, }; const buttonVariants = { hover: { scale: 1.02, transition: { duration: 0.2 }, }, tap: { scale: 0.98 }, }; return (

Welcome back

setEmail(e.target.value)} placeholder="Please enter your Email" className="w-full bg-gray-100 dark:bg-[#1B1B1B] border border-gray-300 dark:border-white/20 rounded-full px-6 py-4 text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 focus:outline-none focus:border-gray-500 dark:focus:border-white/40 transition-colors" />

Continue with Twitter

Continue with Apple

Don't have an account? Sign up

); }

Login Card

Welcome back

Welcome back