mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-28 13:10:21 +08:00
53 lines
2.6 KiB
HTML
53 lines
2.6 KiB
HTML
<!-- From Uiverse.io by themrsami - Tags: simple, material design, black, form, dark, tailwind, tailwindbutton -->
|
|
<div class="flex flex-col items-center justify-center h-screen dark">
|
|
<div class="w-full max-w-md bg-gray-800 rounded-lg shadow-md p-6">
|
|
<h2 class="text-2xl font-bold text-gray-200 mb-4">Contact Form</h2>
|
|
|
|
<form class="flex flex-wrap">
|
|
<input
|
|
type="text"
|
|
class="bg-gray-700 text-gray-200 border-0 rounded-md p-2 mb-4 focus:bg-gray-600 focus:outline-none focus:ring-1 focus:ring-blue-500 transition ease-in-out duration-150 w-full md:w-[48%] mr-[2%]"
|
|
placeholder="Full Name"
|
|
/>
|
|
<input
|
|
type="email"
|
|
class="bg-gray-700 text-gray-200 border-0 rounded-md p-2 mb-4 focus:bg-gray-600 focus:outline-none focus:ring-1 focus:ring-blue-500 transition ease-in-out duration-150 w-full md:w-[48%] ml-[2%]"
|
|
placeholder="Email"
|
|
/>
|
|
<input
|
|
type="number"
|
|
class="bg-gray-700 text-gray-200 border-0 rounded-md p-2 mb-4 focus:bg-gray-600 focus:outline-none focus:ring-1 focus:ring-blue-500 transition ease-in-out duration-150 w-full md:w-[48%] mr-[2%]"
|
|
placeholder="Phone Number"
|
|
/>
|
|
<input
|
|
type="text"
|
|
class="bg-gray-700 text-gray-200 border-0 rounded-md p-2 mb-4 focus:bg-gray-600 focus:outline-none focus:ring-1 focus:ring-blue-500 transition ease-in-out duration-150 w-full md:w-[48%] ml-[2%]"
|
|
placeholder="Company Name"
|
|
/>
|
|
<input
|
|
type="text"
|
|
class="bg-gray-700 text-gray-200 border-0 rounded-md p-2 mb-4 focus:bg-gray-600 focus:outline-none focus:ring-1 focus:ring-blue-500 transition ease-in-out duration-150 w-full md:w-[48%] mr-[2%]"
|
|
placeholder="Job Title"
|
|
/>
|
|
<input
|
|
type="date"
|
|
class="bg-gray-700 text-gray-200 border-0 rounded-md p-2 mb-4 focus:bg-gray-600 focus:outline-none focus:ring-1 focus:ring-blue-500 transition ease-in-out duration-150 w-full md:w-[48%] ml-[2%]"
|
|
placeholder="Date of Birth"
|
|
/>
|
|
<textarea
|
|
name="message"
|
|
class="bg-gray-700 text-gray-200 border-0 rounded-md p-2 mb-auto md:mb-auto md:w-full md:h-auto md:min-h-[100px] md:max-h-[100px] md:flex-grow md:flex-shrink md:flex-auto focus:bg-gray-md:focus:outline-none:focus:ring-blue-md:focus:border-transparent transition ease-in-out duration-fastest"
|
|
placeholder="Message"
|
|
></textarea>
|
|
|
|
<button
|
|
type="submit"
|
|
class="bg-gradient-to-r from-indigo-500 to-blue-500 text-white font-bold py-2 px-4 rounded-md mt-4 hover:bg-indigo-600 hover:to-blue-600 transition ease-in-out duration-150"
|
|
>
|
|
Submit
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
|