mango-web/components/EmailSection.tsx

37 lines
1.5 KiB
TypeScript

const EmailSection = () => {
return (
<div class="container mx-auto px-4">
<section class="py-8 px-4">
<div class="flex flex-wrap items-center text-center md:text-left -mx-2">
<div class="lg:w-1/2 px-2 lg:pl-16 mt-10 lg:mt-0 order-1 lg:order-none">
<h2 class="text-4xl mb-6 font-semibold font-heading">
Keep in touch through email.
</h2>
<form class="w-full max-w-lg mx-auto sm:mx-0">
<div class="flex flex-wrap">
<div class="w-full md:w-2/3 mb-4">
<input
class="appearance-none block w-full py-3 px-4 leading-snug text-gray-700 bg-gray-50 focus:bg-white border border-gray-200 focus:border-gray-500 rounded md:rounded-r-none focus:outline-none"
type="text"
placeholder="Your email @protnmail.com.."
/>
</div>
<div class="w-full md:w-1/3 mb-4">
<button class="inline-block w-full py-4 px-8 leading-none text-white bg-indigo-600 hover:bg-indigo-700 font-semibold rounded md:rounded-l-none">
Subscribe
</button>
</div>
<div class="w-full">
<p>We promise to never spam and only send alpha.</p>
</div>
</div>
</form>
</div>
</div>
</section>
</div>
)
}
export default EmailSection