Files
tailShape/public/componets/footer/11_footer.html
2022-02-16 12:25:09 +06:00

114 lines
4.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<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">
<link rel="stylesheet" href="./../../../dist/tailshape.css">
<title>footer 11</title>
</head>
<body>
<!-- footer 11 start -->
<section class="section_divider">
<div>Footer 11</div>
</section>
<footer class="bg-gray-900">
<div class="grid max-w-screen-xl grid-cols-1 mx-auto lg:grid-cols-2">
<div class="px-4 py-16 border-b border-gray-800 md:border-b-0 md:border-l lg:pl-12 lg:order-last">
<div class="block lg:hidden">
<span class="inline-block w-32 h-10 bg-gray-700 rounded-lg"> </span>
</div>
<div class="mt-12 space-y-4 lg:mt-0">
<span class="block w-10 h-1 bg-indigo-500 rounded"></span>
<div>
<h5 class="text-2xl font-medium text-white">
Request a Demo
</h5>
<p class="max-w-xs mt-1 text-xs text-gray-500">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro voluptatum debitis quia pariatur iusto in nisi expedita placeat vero magni.
</p>
</div>
<form>
<div class="relative max-w-lg">
<label class="sr-only" for="email"> Email </label>
<input class="w-full py-4 pl-3 pr-16 text-sm bg-gray-800 border-none rounded-lg" id="email" type="email" placeholder="Enter your email">
<button class="absolute p-3 text-white -translate-y-1/2 bg-blue-600 rounded-md top-1/2 right-1.5" type="button">
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
</svg>
</button>
</div>
</form>
</div>
</div>
<div class="px-4 py-16 lg:pr-12">
<div class="hidden lg:block">
<span class="inline-block w-32 p-4 bg-gray-700 rounded-lg text-center text-white"> Logo </span>
</div>
<div class="grid grid-cols-3 gap-8 lg:mt-12">
<div>
<p class="font-bold text-white">
Helpful
</p>
<nav class="flex flex-col mt-2 space-y-1 text-xs text-gray-400">
<a class="hover:opacity-75" href=""> Contact </a>
<a class="hover:opacity-75" href=""> Live Chat </a>
<a class="hover:opacity-75" href=""> Resources </a>
</nav>
</div>
<div>
<p class="font-bold text-white">
Solutions
</p>
<nav class="flex flex-col mt-2 space-y-1 text-xs text-gray-400">
<a class="hover:opacity-75" href=""> Instant Checkout </a>
<a class="hover:opacity-75" href=""> Product Upsells </a>
<a class="hover:opacity-75" href=""> Slideout Cart </a>
<a class="hover:opacity-75" href=""> User Dashboards </a>
</nav>
</div>
<div>
<p class="font-bold text-white">
About
</p>
<nav class="flex flex-col mt-2 space-y-1 text-xs text-gray-400">
<a class="hover:opacity-75" href=""> About Us </a>
<a class="hover:opacity-75" href=""> Meet the Team </a>
<a class="hover:opacity-75" href=""> History </a>
<a class="hover:opacity-75" href=""> Careers </a>
</nav>
</div>
</div>
<div class="flex mt-12 space-x-6 text-xs text-white">
<p> © 2022 Company Name </p>
<a class="underline hover:opacity-75" href=""> Privacy Policy </a>
<a class="underline hover:opacity-75" href=""> Terms &amp; Conditions </a>
<a class="underline hover:opacity-75" href=""> Cookies </a>
</div>
</div>
</div>
</footer>
<!-- footer 11 end -->
</body>
</html>