Login Page

1"use client"
2 
3import { useState } from "react"
4import { Eye, EyeOff, LogIn } from "lucide-react"
5import { GlassCard, GlassCardContent, GlassCardDescription, GlassCardHeader, GlassCardTitle } from "@/registry/liquid-glass/glass-card"
6import { GlassInput } from "@/registry/liquid-glass/glass-input"
7import { GlassButton } from "@/registry/liquid-glass/glass-button"
8import { Label } from "@/components/ui/label"
9 
10export default function LoginPageBlock() {
11  const [showPassword, setShowPassword] = useState(false)
12  const [email, setEmail] = useState("")
13  const [password, setPassword] = useState("")
14  const [isLoading, setIsLoading] = useState(false)
15 
16  const handleSubmit = async (e: React.FormEvent) => {
17    e.preventDefault()
18    setIsLoading(true)
19    // Simulate API call
20    await new Promise((resolve) => setTimeout(resolve, 2000))
21    setIsLoading(false)
22    alert(`Logged in with email: ${email}`)
23  }
24 
25  return (
26    <div className="min-full py-4 flex items-center justify-center bg-linear-to-br from-slate-950 via-purple-900 to-slate-950 px-4">
27      <GlassCard className="w-full max-w-md">
28        <GlassCardHeader className="space-y-2 text-center">
29          <div className="flex justify-center mb-2">
30            <div className="p-2 rounded-lg bg-linear-to-br from-cyan-400 to-blue-500">
31              <LogIn className="h-6 w-6 text-white" />
32            </div>
33          </div>
34          <GlassCardTitle className="text-xl">Welcome Back</GlassCardTitle>
35          <GlassCardDescription>Sign in to your account to continue</GlassCardDescription>
36        </GlassCardHeader>
37 
38        <GlassCardContent>
39          <form onSubmit={handleSubmit} className="space-y-5">
40            {/* Email Input */}
41            <div className="space-y-2">
42              <Label htmlFor="email" className="text-white/80">
43                Email Address
44              </Label>
45              <GlassInput
46                id="email"
47                type="email"
48                placeholder="you@example.com"
49                value={email}
50                onChange={(e) => setEmail(e.target.value)}
51                required
52                className="bg-white/5"
53              />
54            </div>
55 
56            {/* Password Input */}
57            <div className="space-y-2">
58              <div className="flex items-center justify-between">
59                <Label htmlFor="password" className="text-white/80">
60                  Password
61                </Label>
62// … truncated