update: revision for register

This commit is contained in:
abiyasa05 2024-09-18 13:50:31 +07:00
parent dfda61bf11
commit 31777d7124
2 changed files with 18 additions and 17 deletions

View File

@ -66,4 +66,8 @@
body {
@apply bg-background text-foreground;
}
}
:root {
--primary-color: #2555FF;
}

View File

@ -88,33 +88,31 @@ export default function RegisterPage() {
return (
<div className="flex flex-col lg:flex-row min-h-screen overflow-hidden">
{/* Bagian Gambar */}
<div className="flex w-screen h-screen items-start lg:items-center justify-center lg:justify-start absolute -top-56 lg:top-0 left-0 lg:-translate-x-[400px] overflow-hidden lg:overflow-visible">
<div className="flex absolute border border-slate-300 rounded-2xl w-[480px] h-[455px] lg:w-[800px] lg:h-[900px] lg:top-11 items-center justify-center -rotate-[19deg] lg:-rotate-[12deg]">
<div className="flex absolute border border-slate-400 rounded-2xl w-2/3 h-2/3 lg:w-4/5 lg:h-4/5 items-center justify-center">
<div className="flex absolute border border-slate-500 rounded-2xl w-3/5 h-3/5 lg:w-3/4 lg:h-3/4 items-center justify-center">
<div className="hidden lg:flex absolute border border-slate-600 rounded-2xl w-3/5 h-3/5">
</div>
</div>
</div>
{/* Image */}
<div className="relative h-[40vw] lg:h-screen -z-20 lg:mt-24">
<div className="-translate-y-[calc(35vw+1rem)] lg:translate-y-0 w-full lg:translate-x-[calc(10vh-45vw)] ">
<span className="absolute scale-50 lg:scale-50 -rotate-12 w-[100vw] h-[100vw] lg:w-[140vh] lg:h-[140vh] border border-gray-300 flex rounded-3xl"></span>
<span className="absolute scale-[85%] lg:scale-[70%] -rotate-12 w-[100vw] h-[100vw] lg:w-[140vh] lg:h-[140vh] border border-gray-300 flex rounded-3xl"></span>
<span className="absolute scale-[120%] lg:scale-90 -rotate-12 w-[100vw] h-[100vw] lg:w-[140vh] lg:h-[140vh] border border-gray-300 flex rounded-3xl"></span>
<span className="absolute scale-150 lg:scale-110 -rotate-12 w-[100vw] h-[100vw] lg:w-[140vh] lg:h-[140vh] border border-gray-300 hidden lg:flex rounded-3xl"></span>
</div>
</div>
{/* Title */}
<div className="absolute top-6 left-6 text-base font-bold z-20">
<div className="absolute top-6 left-6 text-base font-bold">
Amati
</div>
{/* Main content */}
<div className="flex-1 flex flex-col md:flex-row items-center justify-center pt-[151.2px] lg:pt-[82.4px] lg:pl-[224px] md:justify-center lg:justify-end space-x-12 px-6 md:px-0 z-20">
<div className="flex-1 flex flex-col md:flex-row items-center justify-center pt-10 lg:pt-20 lg:pl-56 md:justify-center lg:justify-end space-x-12 px-6 md:px-0">
{/* Form column */}
<div className="w-[306px] max-w-lg md:w-1/2 mx-auto md:mx-20">
<div className="w-full md:w-1/2 mx-auto md:mx-20">
{/* Title and Already have an account */}
<div className="mb-12 h-[75px]">
<h1 className="h-[51px] text-[33px] lg:text-[42px] font-extrabold leading-[56px] tracking-[-0.8px] text-left">Register an Account</h1>
<p className="w-[229.5px] text-sm md:text-sm leading-[15.944px] tracking-[-0.8px] text-[#00000099]">
<div className="flex flex-col gap-1 mb-7">
<h1 className="text-3xl lg:text-4xl font-extrabold text-left">Register an Account</h1>
<p className="text-sm md:text-sm text-gray-400">
Already have an account?{' '}
<a href="/login" className="text-blue-500 font-semibold hover:text-blue-800">
Sign In now
@ -307,8 +305,7 @@ export default function RegisterPage() {
<div className="flex justify-end">
<Button
type="submit"
style={{ backgroundColor: "#2555FF", color: "white" }}
className="w-full flex items-center justify-between text-base font-medium md:w-auto"
className="w-full flex items-center justify-between text-base font-medium md:w-auto bg-[--primary-color] text-white"
>
<span className="flex-grow text-left">Create Account</span>
<TbArrowNarrowRight className="ml-12 h-5 w-5" />