feat(loginPage): add LoginPage component to handle user login functionality
The LoginPage component is added to handle the user login functionality. It includes UI elements such as buttons, icons, and input fields for email address and password. The component also includes a login button and a sign-up button for users who don't have an account.
This commit is contained in:
parent
9106b6d482
commit
61d1e13644
1 changed files with 39 additions and 0 deletions
39
src/frontend/src/pages/loginPage/index.tsx
Normal file
39
src/frontend/src/pages/loginPage/index.tsx
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
import { FaApple, FaGithub } from "react-icons/fa";
|
||||
import { Button } from "../../components/ui/button";
|
||||
import { Input } from "../../components/ui/input";
|
||||
import { GoogleIcon } from "../../icons/Google";
|
||||
|
||||
export default function LoginPage() {
|
||||
return (
|
||||
<div className="flex h-full w-full flex-col items-center justify-center bg-muted">
|
||||
<div className="flex w-72 flex-col items-center justify-center gap-2">
|
||||
<span className="mb-4 text-5xl">⛓️</span>
|
||||
<span className="mb-6 text-2xl font-semibold text-primary">
|
||||
Log in to LangFlow
|
||||
</span>
|
||||
<div className="flex w-full items-center justify-center gap-2">
|
||||
<Button variant="primary" className="w-full py-6">
|
||||
<FaApple className="h-6 w-6" />
|
||||
</Button>
|
||||
<Button variant="primary" className="w-full py-6">
|
||||
<FaGithub className="h-6 w-6" />
|
||||
</Button>
|
||||
<Button variant="primary" className="w-full py-6">
|
||||
<div className="h-6 w-6">
|
||||
<GoogleIcon />
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
<span className="text-sm text-muted-foreground">or</span>
|
||||
<Input className="bg-background" placeholder="Email address" />
|
||||
<Input className="bg-background" placeholder="Password" />
|
||||
<Button variant="default" className="w-full">
|
||||
Login
|
||||
</Button>
|
||||
<Button variant="outline" className="mt-6 w-full">
|
||||
Don't have an account? <b>Sign Up</b>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue