diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx new file mode 100644 index 0000000..988e028 --- /dev/null +++ b/src/app/login/page.tsx @@ -0,0 +1,215 @@ +"use client"; + +import { useState } from "react"; +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen"; +import FooterBaseCard from "@/components/sections/footer/FooterBaseCard"; +import { Mail, Lock, ArrowRight, Eye, EyeOff } from "lucide-react"; + +export default function LoginPage() { + const [email, setEmail] = useState(""); + const [password, setPassword] = useState(""); + const [showPassword, setShowPassword] = useState(false); + const [isLoading, setIsLoading] = useState(false); + const [rememberMe, setRememberMe] = useState(false); + + const handleLogin = async (e: React.FormEvent) => { + e.preventDefault(); + setIsLoading(true); + // Simulate login + setTimeout(() => { + setIsLoading(false); + // Handle login logic here + }, 1000); + }; + + return ( + + + +
+
+
+
+

Welcome Back

+

Sign in to access your portfolio and market data

+
+ +
+ {/* Email Input */} +
+ +
+ + setEmail(e.target.value)} + placeholder="your@email.com" + className="w-full pl-10 pr-4 py-2 bg-background border border-accent/30 rounded-lg focus:outline-none focus:border-primary-cta transition-colors" + required + /> +
+
+ + {/* Password Input */} +
+ +
+ + setPassword(e.target.value)} + placeholder="••••••••" + className="w-full pl-10 pr-12 py-2 bg-background border border-accent/30 rounded-lg focus:outline-none focus:border-primary-cta transition-colors" + required + /> + +
+
+ + {/* Remember Me & Forgot Password */} +
+ + + Forgot password? + +
+ + {/* Login Button */} + +
+ + {/* Divider */} +
+
+
+
+
+ Or continue with +
+
+ + {/* Social Login */} +
+ + +
+ + {/* Sign Up Link */} +

+ Don't have an account?{" "} + + Start your free trial + +

+
+ + {/* Trial Info */} +
+

New to StockTracker? Get 3 days free access to all features

+
+
+
+ + + + ); +}