Visual edit in Lovable

Edited UI in Lovable

src/pages/Login.tsx

@@ -1,4 +1,3 @@
-
 import React, { useState } from "react";
 import { Link, useNavigate } from "react-router-dom";
 import { Label } from "@/components/ui/label";
@@ -6,43 +5,39 @@ import { Input } from "@/components/ui/input";
 import { Button } from "@/components/ui/button";
 import { ArrowRight, Mail, KeyRound, Eye, EyeOff } from "lucide-react";
 import { useToast } from "@/components/ui/use-toast";
-
 const Login = () => {
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
   const [showPassword, setShowPassword] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
-  const { toast } = useToast();
+  const {
+    toast
+  } = useToast();
   const navigate = useNavigate();
-
   const handleLogin = async (e: React.FormEvent) => {
     e.preventDefault();
-    
     if (!email || !password) {
       toast({
         title: "입력 오류",
         description: "이메일과 비밀번호를 모두 입력해주세요.",
-        variant: "destructive",
+        variant: "destructive"
       });
       return;
     }
-    
     setIsLoading(true);
-    
+
     // 실제 로그인 로직은 추후 구현
     // 임시로 2초 후 로그인 성공으로 처리
     setTimeout(() => {
       setIsLoading(false);
       toast({
         title: "로그인 성공",
-        description: "환영합니다!",
+        description: "환영합니다!"
       });
       navigate("/");
     }, 2000);
   };
-
+  return <div className="min-h-screen flex flex-col items-center justify-center p-6 bg-neuro-background">
-  return (
-    <div className="min-h-screen flex flex-col items-center justify-center p-6 bg-neuro-background">
       <div className="w-full max-w-md">
         <div className="text-center mb-8">
           <h1 className="text-3xl font-bold text-neuro-accent mb-2">뉴모파이낸스</h1>
@@ -56,14 +51,7 @@ const Login = () => {
                 <Label htmlFor="email" className="text-base">이메일</Label>
                 <div className="relative">
                   <Mail className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-500 h-5 w-5" />
-                  <Input
+                  <Input id="email" type="email" placeholder="your@email.com" value={email} onChange={e => setEmail(e.target.value)} className="pl-10 neuro-pressed" />
-                    id="email"
-                    type="email"
-                    placeholder="your@email.com"
-                    value={email}
-                    onChange={(e) => setEmail(e.target.value)}
-                    className="pl-10 neuro-pressed"
-                  />
                 </div>
               </div>
               
@@ -71,19 +59,8 @@ const Login = () => {
                 <Label htmlFor="password" className="text-base">비밀번호</Label>
                 <div className="relative">
                   <KeyRound className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-500 h-5 w-5" />
-                  <Input
+                  <Input id="password" type={showPassword ? "text" : "password"} placeholder="••••••••" value={password} onChange={e => setPassword(e.target.value)} className="pl-10 neuro-pressed" />
-                    id="password"
+                  <button type="button" onClick={() => setShowPassword(!showPassword)} className="absolute right-3 top-1/2 transform -translate-y-1/2 text-gray-500">
-                    type={showPassword ? "text" : "password"}
-                    placeholder="••••••••"
-                    value={password}
-                    onChange={(e) => setPassword(e.target.value)}
-                    className="pl-10 neuro-pressed"
-                  />
-                  <button
-                    type="button"
-                    onClick={() => setShowPassword(!showPassword)}
-                    className="absolute right-3 top-1/2 transform -translate-y-1/2 text-gray-500"
-                  >
                     {showPassword ? <EyeOff className="h-5 w-5" /> : <Eye className="h-5 w-5" />}
                   </button>
                 </div>
@@ -95,11 +72,7 @@ const Login = () => {
                 </Link>
               </div>
               
-              <Button
+              <Button type="submit" disabled={isLoading} className="w-full hover:bg-neuro-accent-light text-white py-6 h-auto bg-neuro-income">
-                type="submit"
-                className="w-full bg-neuro-accent hover:bg-neuro-accent-light text-white py-6 h-auto"
-                disabled={isLoading}
-              >
                 {isLoading ? "로그인 중..." : "로그인"} {!isLoading && <ArrowRight className="ml-2 h-5 w-5" />}
               </Button>
             </div>
@@ -115,8 +88,6 @@ const Login = () => {
           </p>
         </div>
       </div>
-    </div>
+    </div>;
-  );
 };
-
+export default Login;
-export default Login;