MIF_E31230393/resources/views/auth/register.blade.php

67 lines
4.2 KiB
PHP

@extends('layouts.app')
@section('content')
<div class="min-h-[85vh] flex items-center justify-center px-6 bg-white relative overflow-hidden py-12">
<div class="absolute top-0 left-0 w-96 h-96 bg-orange-50 rounded-full blur-3xl opacity-50 -translate-y-1/2 -translate-x-1/2"></div>
<div class="max-w-md w-full relative z-10">
<div class="bg-white rounded-[3rem] border border-gray-100 shadow-2xl overflow-hidden">
<div class="bg-gray-900 p-10 text-center relative">
<h2 class="text-3xl font-black text-white italic tracking-tighter">Gabung Sekarang</h2>
<p class="text-gray-400 text-[10px] mt-2 uppercase tracking-[0.3em] font-bold">Mulai Perjalanan Kopi Anda</p>
</div>
<form action="{{ route('register') }}" method="POST" class="p-10 space-y-5">
@csrf
<div class="space-y-1">
<label class="text-[10px] font-black uppercase text-gray-400 ml-1 tracking-widest">Nama Lengkap</label>
<input type="text" name="name" value="{{ old('name') }}" required
class="w-full px-6 py-4 bg-gray-50 border @error('name') border-red-500 @else border-gray-100 @enderror rounded-2xl focus:ring-4 focus:ring-orange-700/5 focus:border-orange-700 outline-none transition-all text-sm font-medium"
placeholder="Masukkan nama Anda">
@error('name')
<span class="text-xs text-red-500 ml-1 block mt-1">{{ $message }}</span>
@enderror
</div>
<div class="space-y-1">
<label class="text-[10px] font-black uppercase text-gray-400 ml-1 tracking-widest">Alamat Email</label>
<input type="email" name="email" value="{{ old('email') }}" required
class="w-full px-6 py-4 bg-gray-50 border @error('email') border-red-500 @else border-gray-100 @enderror rounded-2xl focus:ring-4 focus:ring-orange-700/5 focus:border-orange-700 outline-none transition-all text-sm font-medium"
placeholder="email@anda.com">
@error('email')
<span class="text-xs text-red-500 ml-1 block mt-1">{{ $message }}</span>
@enderror
</div>
<div class="space-y-1">
<label class="text-[10px] font-black uppercase text-gray-400 ml-1 tracking-widest">Password</label>
<input type="password" name="password" required
class="w-full px-6 py-4 bg-gray-50 border @error('password') border-red-500 @else border-gray-100 @enderror rounded-2xl focus:ring-4 focus:ring-orange-700/5 focus:border-orange-700 outline-none transition-all text-sm font-medium"
placeholder="••••••••">
@error('password')
<span class="text-xs text-red-500 ml-1 block mt-1">{{ $message }}</span>
@enderror
</div>
<div class="space-y-1">
<label class="text-[10px] font-black uppercase text-gray-400 ml-1 tracking-widest">Konfirmasi Password</label>
<input type="password" name="password_confirmation" required
class="w-full px-6 py-4 bg-gray-50 border border-gray-100 rounded-2xl focus:ring-4 focus:ring-orange-700/5 focus:border-orange-700 outline-none transition-all text-sm font-medium"
placeholder="••••••••">
</div>
<button type="submit" class="w-full py-4 bg-orange-700 text-white rounded-2xl font-bold shadow-xl shadow-orange-700/30 hover:bg-orange-800 hover:-translate-y-1 active:scale-95 transition-all duration-300 mt-4">
Buat Akun Gratis
</button>
<p class="text-center text-xs text-gray-400 font-semibold pt-2">
Sudah punya akun?
<a href="{{ route('login') }}" class="text-orange-700 font-bold hover:underline">Masuk di sini</a>
</p>
</form>
</div>
</div>
</div>
@endsection