2025-12-26 13:12:37 +00:00

79 lines
3.5 KiB
TypeScript

import React from "react";
import IconGoogle from "@/components/icon/icon-google";
import Link from "next/link";
import ComponentsAuthForgotForm from '@/components/auth/components-auth-forgot-form';
import ComponentsAuthUnlockForm from "@/components/auth/components-auth-unlock-form";
import ResetPasswordForm from "@/components/auth/components-auth-reset-password-form";
export default function PremiumLoginPage() {
return (
<div className="min-h-screen w-full flex items-center justify-center bg-black relative overflow-hidden">
{/* Background abstract neon lines */}
{/* <div
className="absolute inset-0 bg-cover bg-center opacity-60"
style={{
backgroundImage:
"url('https://as2.ftcdn.net/jpg/03/43/34/57/1000_F_343345747_wJfBUpacjstgfxqK6XyH45jXXZTeHx44.jpg')",
}}
></div> */}
{/* 🔥 Background YouTube Video */}
<div className="absolute inset-0 w-full h-full overflow-hidden">
{/* <iframe
className="w-full h-full object-cover"
src="https://www.youtube.com/embed/g6qV2cQ2Fhw?autoplay=1&mute=1&controls=0&showinfo=0&rel=0&loop=1&playlist=g6qV2cQ2Fhw"
allow="autoplay; fullscreen"
allowFullScreen
/> */}
<video
className="w-full h-full object-cover"
autoPlay
loop
muted
playsInline
>
<source src="/assets/images/auth/D4A_ebay_background-1.mp4" type="video/mp4" />
</video>
</div>
{/* Glass card */}
<div className="relative z-10 bg-white/10 backdrop-blur-xl border border-white/20 shadow-2xl rounded-2xl p-10 w-full max-w-md text-white animate-fadeIn">
{/* <h2 className="text-3xl font-semibold text-center mb-8">Login</h2> */}
{/* Login Form Section */}
<div className="w-full max-w-[440px] ">
<div className="mb-10">
<h1 className="text-xl font-extrabold uppercase !leading-snug text-[#19d4fb] md:text-3xl">
Reset Password
</h1>
<p className="text-base font-bold leading-normal text-white">
Enter your email to recover your ID
</p>
</div>
{/* Forgot form */}
<ResetPasswordForm />
{/* <div className="text-center mt-4">
<a href="/forgot-password" className="text-sm text-blue-500 hover:underline">
Forgot Password?
</a>
</div> */}
{/* Divider */}
{/* Sign-in link */}
{/* <div className="text-center dark:text-white mt-5">
Remember your password? &nbsp;
<Link
href="/login"
className="uppercase text-[#19d4fb] underline transition hover:text-black dark:hover:text-white"
>
SIGN IN
</Link>
</div> */}
</div>
</div>
</div>
);
}