src/pages/login.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

import Head from "next/head";
import Image from "next/image";
import Link from "next/link";
import Logo from "../images/logo.png";

export default function Login() {
  return (
    <>
      <Head>
        <title>Masuk - Indoteknik</title>
      </Head>
      <main className="max-w-lg mx-auto flex flex-col items-center px-4">
        <Link href="/" className="mt-16">
          <Image src={Logo} alt="Logo Indoteknik" width={165} height={42} />
        </Link>
        <h1 className="text-xl sm:text-2xl text-gray-900 mt-4">Mulai Belanja Sekarang</h1>
        <h2 className="text-gray-800 mt-2 mb-4">Masuk ke akun kamu untuk belanja</h2>
        <input 
          type="text"
          className="form-input bg-gray-100 mt-4 focus:ring-1 focus:ring-yellow-900" 
          placeholder="johndoe@gmail.com"
        />
        <input 
          type="password"
          className="form-input bg-gray-100 mt-4 focus:ring-1 focus:ring-yellow-900" 
          placeholder="**********"
        />
        <div className="flex justify-end mt-4 w-full">
          <Link href="/forgot-password" className="text-sm">Lupa kata sandi?</Link>
        </div>
        <button className="btn-yellow font-semibold mt-4 w-full">Masuk</button>
        <p className="text-gray-700 mt-4 text-sm">Belum punya akun Indoteknik? <Link href="/register">Daftar</Link></p>
      </main>
    </>
  )
}