Files
tailShape/public/componets/hero/10_hero.html

71 lines
3.3 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en" class="">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hero 10</title>
<link rel="stylesheet" href="./../../../dist/tailshape.css">
</head>
<body>
<!-- hero 10 start -->
<section class="section_divider">
<div>Hero 10</div>
</section>
<section class=" dark:bg-gray-800">
<div class="max-w-7xl px-4 py-24 grid items-center w-full grid-cols-1 gap-0 mx-auto lg:grid-cols-11 lg:gap-24 xl:w-11/12">
<div class="col-auto text-center md:col-span-7 lg:text-left">
<h1 class="mb-4 text-3xl font-bold leading-tight text-gray-900 dark:text-yellow-300 md:text-4xl md:leading-none tracking-none md:tracking-tight">Ready to start your journey?</h1>
<p class="mb-10 text-lg font-light text-gray-500 md:text-xl md:tracking-relaxed md:mb-4">
Low-latency voice and video feels like youre in the same room. Wave hello over video, watch friends stream their games, or gather up and have a drawing session with screen share.
</p>
</div>
<div class="col-auto md:col-span-4">
<form class="mb-6 border-0 rounded-lg shadow-xl ">
<div class="text-center text-gray-700 dark:text-yellow-200 uppercase font-semibold mb-4 border-0 card-header">
<p class="pt-2"> talk with us</p>
</div>
<div class="grid">
<label class="mx-auto ">
<span class="sr-only">First Name</span>
<input class=" bg-transparent px-5 pb-1 mt-5 border-b-2 outline-none text-gray-800 dark:text-yellow-300 border-gray-500 dark:border-yellow-300" type="text" placeholder="First Name" required="true" />
</label>
<label class="mx-auto">
<span class="sr-only">Email Address</span>
<input class=" bg-transparent px-5 pb-1 mt-5 border-b-2 outline-none text-gray-800 dark:text-yellow-300 border-gray-500 dark:border-yellow-300 " type="email" placeholder="Email Address" required="true" />
</label>
<label class="mx-auto">
<span class="sr-only">Password</span>
<input class=" bg-transparent px-5 pb-1 mt-5 border-b-2 outline-none text-gray-800 dark:text-yellow-300 border-gray-500 dark:border-yellow-300" type="password" placeholder="Password" required="true" />
</label>
<div class="px-6 py-4 ">
<button class="w-full py-2 rounded-lg bg-gray-800 text-gray-300 dark:text-gray-800 dark:bg-yellow-400" type="submit">Sign up for free</button>
</div>
</div>
<div class="px-6 py-4 ">
<button class="w-full py-2 rounded-lg bg-blue-500 hover:bg-blue-400">
Continue with Google
</button>
</div>
</form>
<p class="text-xs text-center text-gray-600 dark:text-yellow-300">By signing up you agree to our <a href="#" class="text-primary">Terms of Service</a></p>
</div>
</div>
</section>
<!-- hero 10 end -->
</body>
</html>