NIM_E31222534/resources/views/petugas/create.blade.php

40 lines
2.8 KiB
PHP

@extends('layouts.app')
@section('content')
<div class="min-h-screen bg-gradient-to-br from-[#63BE9A] to-[#06B3BF] p-6">
<div class="max-w-5xl mx-auto relative mb-8">
<div class="flex flex-col md:flex-row md:items-center md:justify-between gap-2">
<h2 class="text-3xl font-bold text-black">Tambah Petugas</h2>
<nav class="text-gray-600 text-sm bg-white/60 px-4 py-2 rounded-xl shadow border border-white/40">
<a href="{{ route('petugas.index') }}" class="text-[#06B3BF] font-semibold hover:underline">Petugas</a> / <span>Tambah Petugas</span>
</nav>
</div>
</div>
<div class="w-full max-w-5xl bg-white/70 backdrop-blur-md rounded-2xl shadow-xl p-8 mx-auto mt-8 border border-white/40">
<form action="{{ route('petugas.store') }}" method="POST">
@csrf
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label class="block text-sm font-semibold text-black">Username*</label>
<input type="text" name="username" class="w-full p-3 border border-gray-200 rounded-xl focus:border-2 focus:border-[#06B3BF] focus:ring-1 focus:ring-[#06B3BF] focus:bg-blue-50 transition-all duration-300 @error('username') border-red-500 @enderror" placeholder="Username" value="{{ old('username') }}">
@error('username')
<p class="text-red-500 text-xs mt-1">{{ $message }}</p>
@enderror
</div>
<div>
<label class="block text-sm font-semibold text-black">Password*</label>
<input type="password" name="password" class="w-full p-3 border border-gray-200 rounded-xl focus:border-2 focus:border-[#06B3BF] focus:ring-1 focus:ring-[#06B3BF] focus:bg-blue-50 transition-all duration-300 @error('password') border-red-500 @enderror" placeholder="Password">
@error('password')
<p class="text-red-500 text-xs mt-1">{{ $message }}</p>
@enderror
</div>
</div>
<div class="mt-8 flex justify-end">
<a href="{{ route('petugas.index') }}" class="bg-gray-400 hover:bg-gray-500 text-white px-6 py-3 rounded-xl font-semibold shadow hover:shadow-md transform hover:scale-105 transition-all duration-300 border border-transparent hover:border-white mr-4">Kembali</a>
<button type="submit" class="bg-gradient-to-r from-[#63BE9A] to-[#06B3BF] hover:from-[#06B3BF] hover:to-[#63BE9A] text-white px-6 py-3 rounded-xl font-semibold shadow hover:shadow-lg transform hover:scale-105 transition-all duration-300 border border-transparent hover:border-white">Simpan</button>
</div>
</form>
</div>
</div>
@endsection