<body class="bg-gray-100 font-sans leading-normal tracking-normal h-screen flex flex-col"> <header class="bg-white shadow-lg p-4 flex justify-center"> <div class="flex items-center space-x-4"> <i class="iconoir-clipboard-check text-3xl text-blue-600"></i> <span class="font-bold text-3xl text-gray-800">IT Equipment Invoice Parser</span> </div> </header> <main class="flex-1 flex items-center justify-center"> <div class="bg-white shadow-lg rounded-lg p-10 max-w-md w-full"> <h1 class="text-2xl font-bold mb-6 text-center text-gray-800">Upload Your Invoice</h1> <form> <div class="mb-6"> <label for="file-upload" class="block text-gray-700 mb-2">Scan or Upload Invoice</label> <input type="file" id="file-upload" class="w-full p-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" accept=".pdf, .jpg, .jpeg, .png"> </div> <div class="mb-6"> <label for="phone-scan" class="block text-gray-700 mb-2">Or Scan with Phone</label> <input type="text" id="phone-scan" class="w-full p-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter scan code or link"> </div> <button type="submit" class="w-full bg-blue-600 text-white p-3 rounded-lg hover:bg-blue-500 transition duration-300">Parse Invoice</button> </form> <p class="mt-4 text-center text-gray-600">The asset data will be processed and uploaded to the inventory system.</p> </div> </main> <footer class="bg-white shadow-md p-4"> <div class="max-w-6xl mx-auto text-center"> <p class="text-gray-600">© 2023 IT Equipment Invoice Parser. All rights reserved.</p> </div> </footer> </body>