Rafael Bueno
<div class="relative flex min-h-screen flex-col justify-center overflow-hidden bg-gray-50 py-6 sm:py-12"> <div class="absolute inset-0 bg-center [mask-image:linear-gradient(180deg,white,rgba(255,255,255,0))]"></div> <div class="relative bg-white px-6 pt-10 pb-8 shadow-xl ring-1 ring-gray-900/5 sm:mx-auto sm:max-w-lg sm:rounded-lg sm:px-10"> <h1 class="text-3xl font-bold text-center mb-6">Parking Lot Management</h1> <form> <div class="mb-4"> <label for="license-plate" class="block text-gray-700 mb-2">License Plate</label> <input type="text" id="license-plate" class="w-full p-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter license plate"> </div> <div class="mb-4"> <label for="duration" class="block text-gray-700 mb-2">Duration (hours)</label> <input type="number" id="duration" class="w-full p-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter duration"> </div> <div class="mb-6"> <label for="payment-method" class="block text-gray-700 mb-2">Payment Method</label> <select id="payment-method" class="w-full p-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"> <option value="">Select payment method</option> <option value="credit-card">Credit Card</option> <option value="cash">Cash</option> <option value="mobile-payment">Mobile Payment</option> </select> </div> <button type="submit" class="w-full bg-blue-500 text-white p-3 rounded-lg hover:bg-blue-400 transition-all duration-300 ease-in-out">Submit</button> </form> <div class="mt-6"> <h2 class="text-xl font-semibold text-center mb-4">Current Parking Status</h2> <div class="bg-gray-100 p-4 rounded-lg shadow-md"> <p class="text-gray-700">Total Cars Parked: <span class="font-bold">25</span></p> <p class="text-gray-700">Available Spots: <span class="font-bold">15</span></p> </div> </div> </div> </div>