-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
88010c9
commit c398b5e
Showing
3 changed files
with
131 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,46 @@ | ||
<section class="pt-24 md:pt-40 xl:pb-40 bg-gray-900 relative overflow-hidden"> | ||
<div class="container px-4 mx-auto"> | ||
<img class="hidden xl:block absolute top-0 right-0 w-1/4 mt-10 h-full object-cover" src="https://shuffle.dev/wrexa-assets/images/women-right-messages.png" alt=""> | ||
<div class="w-full xl:w-4/5"> | ||
<div class="flex items-center mb-12"> | ||
<span class="font-heading text-xl text-white">07</span> | ||
<div class="mx-4 rounded-full bg-gray-200 h-1 w-1"></div> | ||
<span class="font-heading text-xl text-white">Contact us</span> | ||
</div> | ||
<h2 class="font-heading text-5xl sm:text-6xl xl:text-7xl text-white mb-24">Have a question?</h2> | ||
<form action="#" method="post"> | ||
<div class="max-w-xs lg:max-w-none mx-auto"> | ||
<div class="flex flex-wrap -mb-6"> | ||
<span class="mr-4 mb-6 text-2xl xl:text-3xl text-white font-heading">Hello, my name is</span> | ||
<div> | ||
<input class="block max-w-xs mr-4 px-6 pb-2 mb-6 text-center text-2xl xl:text-3xl font-heading border-b border-gray-700 bg-transparent text-gray-700 placeholder-gray-700 outline-none" type="text" placeholder="type here"> | ||
</div> | ||
<span class="mb-6 text-2xl xl:text-3xl text-white font-heading">and I’m looking</span> | ||
</div> | ||
<div class="flex flex-wrap mt-6 -mb-6"> | ||
<span class="mr-4 mb-6 text-2xl xl:text-3xl text-white font-heading">for a</span> | ||
<div> | ||
<select class="block max-w-xs mr-4 px-6 pb-2 mb-6 text-center text-2xl xl:text-3xl font-heading border-b border-gray-700 bg-transparent text-gray-700 outline-none" aria-label="New select example"> | ||
<option selected="">select here</option> | ||
<option value="1">job</option> | ||
<option value="1">work</option> | ||
</select> | ||
</div> | ||
</div> | ||
<div class="flex flex-wrap mt-6 -mb-6"> | ||
<span class="mr-4 mb-6 text-2xl xl:text-3xl text-white font-heading">Get in touch with me at</span> | ||
<div> | ||
<input class="block max-w-xs mr-4 px-6 pb-2 mb-6 text-center text-2xl xl:text-3xl font-heading border-b border-gray-700 bg-transparent text-gray-700 placeholder-gray-700 outline-none" type="email" placeholder="your Email here"> | ||
</div> | ||
</div> | ||
<div class="flex items-center mt-16 mb-24"> | ||
<input type="checkbox" value="" id=""> | ||
<label class="ml-6 text-gray-600" for="">Accept all terms and conditions</label> | ||
</div> | ||
<a class="inline-block w-full lg:w-auto px-7 py-4 text-center font-medium bg-indigo-500 hover:bg-indigo-600 text-white rounded transition duration-250" href="#">Send message!</a> | ||
</div> | ||
</form> | ||
</div> | ||
</div> | ||
<img class="xl:hidden block mt-24 w-full h-128 object-cover" src="https://shuffle.dev/wrexa-assets/images/women-right-messages.png" alt=""> | ||
</section> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
<section class="py-24 md:pb-40 md:pt-52 relative"> | ||
<div class="container px-4 mx-auto"> | ||
<div class="flex flex-wrap items-center -mx-4"> | ||
<div class="w-full lg:w-1/2 px-4 mb-24 lg:mb-0"> | ||
<div class="mb-14"> | ||
<h2 class="font-heading text-5xl sm:text-7xl mb-2">Contact</h2> | ||
<h3 class="font-heading text-2xl sm:text-4xl mb-10">Have any question? Text me!</h3> | ||
<p class="mb-2 font-light">Mon - Fr 8:00 - 20:00 CET</p> | ||
<p class="mb-14 font-light">Hotline +44 223 448 0171</p> | ||
<div class="pb-20 border-b -mb-6"> | ||
<a class="inline-flex mb-6 mr-14 items-center" href="#"> | ||
<img class="mr-4" src="https://shuffle.dev/wrexa-assets/logos/brands/messenger.svg" alt=""> | ||
<span class="font-light">chatshxxk</span> | ||
</a> | ||
<a class="inline-flex mb-6 items-center" href="#"> | ||
<img class="mr-4" src="https://shuffle.dev/wrexa-assets/logos/brands/snapchat.svg" alt=""> | ||
<span class="font-light">snapshxxk</span> | ||
</a> | ||
</div> | ||
</div> | ||
<div><a class="inline-block w-full sm:w-auto px-7 py-4 mb-4 sm:mb-0 sm:mr-5 text-center font-medium bg-indigo-500 hover:bg-indigo-600 text-white rounded transition duration-250" href="#">Send a message</a><a class="inline-block w-full sm:w-auto px-7 py-4 text-center font-medium border border-gray-900 hover:text-gray-700 rounded transition duration-250" href="#">Live chat</a></div> | ||
</div> | ||
<div class="w-full lg:w-1/2 px-4"> | ||
<img class="block mx-auto" src="https://shuffle.dev/wrexa-assets/images/message-photo-writing-women.png" alt=""> | ||
</div> | ||
</div> | ||
</div> | ||
</section> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,57 @@ | ||
<section class="py-24 md:py-40"> | ||
<div class="container px-4 mx-auto"> | ||
<div class="pb-10 mb-20 border-b"> | ||
<h2 class="font-heading text-5xl sm:text-6xl xl:text-7xl">Have a question?</h2> | ||
</div> | ||
<div class="flex flex-wrap -mx-4 mb-24"> | ||
<div class="w-full lg:w-3/12 px-4 mb-12 lg:mb-0"> | ||
<h4 class="font-heading text-3xl">Your message</h4> | ||
</div> | ||
<div class="w-full lg:w-6/12 px-4 mb-12 lg:mb-0"> | ||
<form action="#" method="post"> | ||
<textarea class="block w-full h-30 py-6 px-10 mb-5 border rounded-lg outline-none resize-none" placeholder="Let's talk now!" name="" id=""></textarea> | ||
<div class="flex flex-wrap -mx-3 mb-10"> | ||
<div class="w-full md:w-1/2 px-3 mb-5 md:mb-0"> | ||
<input class="block w-full px-10 py-6 border rounded-lg outline-none" type="text" placeholder="Your name"> | ||
</div> | ||
<div class="w-full md:w-1/2 px-3"> | ||
<input class="block w-full px-10 py-6 border rounded-lg outline-none" type="email" placeholder="Your email"> | ||
</div> | ||
</div> | ||
<button class="inline-block w-full px-7 py-4 mb-10 text-center font-medium bg-indigo-500 hover:bg-indigo-600 text-white rounded transition duration-250">Send your message!</button> | ||
<div class="flex items-center"> | ||
<input class="w-5 h-5" type="checkbox" value="" id=""> | ||
<label class="ml-4 text-gray-400 font-light" for="">Accept all terms and conditions</label> | ||
</div> | ||
</form> | ||
</div> | ||
<div class="w-full lg:w-3/12 px-4"> | ||
<div class="flex items-center"> | ||
<div class="flex items-center justify-center w-16 h-16 bg-white shadow rounded-full relative"> | ||
<img class="w-14 h-14 rounded-full" src="https://shuffle.dev/wrexa-assets/images/avatar-male2.png" alt=""> | ||
<div class="absolute bottom-0 right-0 mb-1 mr-1 w-3 h-3 rounded-full bg-green-800"></div> | ||
</div> | ||
<div class="ml-5 pl-5 border-l"> | ||
<span>Livechat</span> | ||
<a class="flex items-center font-light" href="#"> | ||
<span class="mr-2">Text us now!</span> | ||
<svg width="14" height="12" viewbox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg"> | ||
<path d="M7.96952 0.863281L7.00551 1.80277L10.8104 5.51092L0.921875 5.51092L0.921875 6.83882L10.8104 6.83882L7.00551 10.547L7.96952 11.4865L13.4197 6.17487L7.96952 0.863281Z" fill="#232126"></path> | ||
</svg> | ||
</a> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="pt-20 border-t -mb-6"> | ||
<a class="inline-flex mb-6 mr-14 items-center" href="#"> | ||
<img class="mr-4" src="https://shuffle.dev/wrexa-assets/logos/brands/messenger.svg" alt=""> | ||
<span class="font-light">chatshxxk</span> | ||
</a> | ||
<a class="inline-flex mb-6 items-center" href="#"> | ||
<img class="mr-4" src="https://shuffle.dev/wrexa-assets/logos/brands/snapchat.svg" alt=""> | ||
<span class="font-light">snapshxxk</span> | ||
</a> | ||
</div> | ||
</div> | ||
</section> |