import {merge} from '@/lib/utils'
import Image from 'next/image'
import logo from '@/assets/logo.webp'
import bg from './_assets/bg.webp'
import Link from 'next/link'
import LoginCard from './login-card'

export type LoginPageProps = {}

export default async function LoginPage(props: LoginPageProps) {
  return (
    <main className={merge(
      `relative`,
      `h-screen w-screen xl:pr-64 bg-cover bg-left`,
      `flex justify-center xl:justify-end items-center`,
    )}>
      <Image src={bg} alt="背景图" fill priority className="absolute -z-20 object-cover"/>
      <Link href="/">
        <Image src={logo} alt="logo" priority height={64} className="absolute top-8 left-8 z-10"/>
      </Link>

      {/* 登录表单 */}
      <LoginCard/>
    </main>
  )
}
