please generate a registration form for Ubuntu Connect Launch with the following details. Make it nice and clean background should be white with text being #2b2a16 with an accent color: ab8037. Please include all files necessary, from css to javascript and PHP. make it look really beautiful
ea069c7 verified | <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Registration Success | Ubuntu Connect</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <style> | |
| body { | |
| font-family: 'Ubuntu', sans-serif; | |
| color: #2b2a16; | |
| } | |
| .success-box { | |
| border-left: 4px solid #ab8037; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-white min-h-screen flex items-center justify-center"> | |
| <div class="max-w-md w-full p-8 bg-white rounded-lg shadow-lg"> | |
| <?php if (isset($success)): ?> | |
| <div class="success-box bg-green-50 p-6 mb-6 rounded"> | |
| <div class="flex items-center"> | |
| <i data-feather="check-circle" class="text-green-600 mr-2" stroke-width="2"></i> | |
| <h2 class="text-xl font-bold text-green-800">Registration Successful!</h2> | |
| </div> | |
| <p class="mt-2 text-green-600">Thank you for registering with Ubuntu Connect. We'll be in touch soon.</p> | |
| </div> | |
| <div class="text-center"> | |
| <div class="inline-flex items-center px-4 py-2 bg-accent text-white rounded-lg hover:bg-accent-dark transition"> | |
| <i data-feather="home" class="mr-2"></i> | |
| <a href="/" class="font-medium">Return to Homepage</a> | |
| </div> | |
| </div> | |
| <?php elseif (isset($error)): ?> | |
| <div class="bg-red-50 p-6 mb-6 rounded border-l-4 border-red-500"> | |
| <div class="flex items-center"> | |
| <i data-feather="alert-circle" class="text-red-600 mr-2" stroke-width="2"></i> | |
| <h2 class="text-xl font-bold text-red-800">Registration Failed</h2> | |
| </div> | |
| <p class="mt-2 text-red-600"><?php echo htmlspecialchars($error); ?></p> | |
| </div> | |
| <div class="text-center"> | |
| <a href="/" class="text-accent hover:underline font-medium">Try again</a> | |
| </div> | |
| <?php endif; ?> | |
| </div> | |
| <script> | |
| feather.replace(); | |
| </script> | |
| </body> | |
| </html> | |