added other tempalte parts
This commit is contained in:
merajjahir
@@ -21,31 +21,34 @@
|
||||
<section class="section_divider">
|
||||
<div>Contact 2</div>
|
||||
</section>
|
||||
<div class="grid max-w-screen-xl grid-cols-1 gap-8 px-8 py-16 mx-auto rounded-lg md:grid-cols-2 md:px-12 lg:px-16 xl:px-32 dark:bg-gray-800 dark:text-gray-100">
|
||||
<div class="flex flex-col justify-between">
|
||||
<div class="space-y-2">
|
||||
<h2 class="text-4xl font-bold leading-tight lg:text-5xl">Let's talk!</h2>
|
||||
<div class="dark:text-gray-400">Vivamus in nisl metus? Phasellus.</div>
|
||||
</div>
|
||||
<img src="assets/svg/doodle.svg" alt="" class="p-6 h-52 md:h-64">
|
||||
</div>
|
||||
<form novalidate="" class="space-y-6 ng-untouched ng-pristine ng-valid">
|
||||
<div>
|
||||
<label for="name" class="text-sm">Full name</label>
|
||||
<input id="name" type="text" placeholder="" class="w-full p-3 rounded dark:bg-gray-800">
|
||||
</div>
|
||||
<div>
|
||||
<label for="email" class="text-sm">Email</label>
|
||||
<input id="email" type="email" class="w-full p-3 rounded dark:bg-gray-800">
|
||||
</div>
|
||||
<div>
|
||||
<label for="message" class="text-sm">Message</label>
|
||||
<textarea id="message" rows="3" class="w-full p-3 rounded dark:bg-gray-800"></textarea>
|
||||
</div>
|
||||
<button type="submit" class="w-full p-3 text-sm font-bold tracking-wide uppercase rounded dark:bg-green-400 dark:text-gray-900">Send Message</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<section class="dark:bg-gray-900 dark:text-gray-100">
|
||||
|
||||
<div class="grid max-w-screen-xl grid-cols-1 gap-8 px-8 py-24 mx-auto rounded-lg md:grid-cols-2 md:px-12 xl:px-32 ">
|
||||
<div class="flex flex-col justify-between">
|
||||
<div class="space-y-2">
|
||||
<h2 class="text-4xl font-bold leading-tight lg:text-5xl">Let's talk!</h2>
|
||||
<div class="dark:text-gray-400">Vivamus in nisl metus? Phasellus.</div>
|
||||
</div>
|
||||
<img src="https://www.mambaui.com/assets/svg/doodle.svg" alt="" class="p-6 h-52 md:h-64">
|
||||
</div>
|
||||
<form novalidate="" class="space-y-6 ng-untouched ng-pristine ng-valid">
|
||||
<div>
|
||||
<label for="name" class="text-sm">Full name</label>
|
||||
<input id="name" type="text" placeholder="" class="w-full p-3 rounded dark:bg-gray-800">
|
||||
</div>
|
||||
<div>
|
||||
<label for="email" class="text-sm">Email</label>
|
||||
<input id="email" type="email" class="w-full p-3 rounded dark:bg-gray-800">
|
||||
</div>
|
||||
<div>
|
||||
<label for="message" class="text-sm">Message</label>
|
||||
<textarea id="message" rows="3" class="w-full p-3 rounded dark:bg-gray-800"></textarea>
|
||||
</div>
|
||||
<button type="submit" class="w-full p-3 text-sm font-bold tracking-wide uppercase rounded dark:bg-green-400 dark:text-gray-900">Send Message</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<!-- contact 2 end -->
|
||||
|
||||
|
||||
|
||||
@@ -1418,6 +1418,97 @@
|
||||
<!-- contact 9 end -->
|
||||
|
||||
|
||||
<!-- contact 10 start -->
|
||||
<section class="section_divider">
|
||||
<div>Contact 10</div>
|
||||
</section>
|
||||
<div class="px-4 py-6 sm:grid grid-cols-2 gap-x-6 max-w-4xl mx-auto">
|
||||
<div class="mb-8">
|
||||
<h2 class="text-center text-2xl font-bold text-blue-800">Add Contact</h2>
|
||||
<div class="mt-6">
|
||||
<div class="flex-col space-y-4">
|
||||
<input type="text" placeholder="Name" class="border-2 w-full px-4 py-2 rounded-md text-md text-gray-700 outline-none" />
|
||||
<input type="text" placeholder="Name" class="border-2 w-full px-4 py-2 rounded-md text-md text-gray-700 outline-none" />
|
||||
<input type="text" placeholder="Name" class="border-2 w-full px-4 py-2 rounded-md text-md text-gray-700 outline-none" />
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<p class="mb-1 text-gray-700 font-semibold text-sm">Contact Type</p>
|
||||
<div class="flex space-x-4 my-2 items-center">
|
||||
<div class="flex items-center space-x-1">
|
||||
<input type="radio" id="personal" class="cursor-pointer">
|
||||
<label for="personal" class="cursor-pointer">Personal</span>
|
||||
</div>
|
||||
<div class="flex items-center space-x-1">
|
||||
<input type="radio" id="professional" class="cursor-pointer">
|
||||
<label for="professional" class="cursor-pointer">Professional</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button class="w-full mt-4 bg-gradient-to-tr from-indigo-600 to-purple-600 text-white py-2 rounded-md text-lg font-semibold">Add Contact</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="space-y-4">
|
||||
<div class=" p-6 rounded-md bg-indigo-50">
|
||||
<div class="flex justify-between mb-2 items-center">
|
||||
<p class="text-lg font-semibold items-center">Jill Johson</p>
|
||||
<p class="bg-indigo-500 text-indigo-50 px-3 py-1 rounded-md text-sm">Personal</p>
|
||||
</div>
|
||||
<div>
|
||||
<div class="flex items-center space-x-2">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M3 19v-8.93a2 2 0 01.89-1.664l7-4.666a2 2 0 012.22 0l7 4.666A2 2 0 0121 10.07V19M3 19a2 2 0 002 2h14a2 2 0 002-2M3 19l6.75-4.5M21 19l-6.75-4.5M3 10l6.75 4.5M21 10l-6.75 4.5m0 0l-1.14.76a2 2 0 01-2.22 0l-1.14-.76" />
|
||||
</svg>
|
||||
<p class="text-md font-semibold">jill@gmail.com</p>
|
||||
</div>
|
||||
<div class="flex mt-3 text-sm">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M16 8l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2M5 3a2 2 0 00-2 2v1c0 8.284 6.716 15 15 15h1a2 2 0 002-2v-3.28a1 1 0 00-.684-.948l-4.493-1.498a1 1 0 00-1.21.502l-1.13 2.257a11.042 11.042 0 01-5.516-5.517l2.257-1.128a1 1 0 00.502-1.21L9.228 3.683A1 1 0 008.279 3H5z" />
|
||||
</svg>
|
||||
<p class="text-md mb-6">111-111-111</p>
|
||||
</div>
|
||||
<div class="space-x-1">
|
||||
<span class="text-md px-6 py-2 rounded-md bg-green-500 text-indigo-50 font-semibold cursor-pointer" text-indigo-50 font-semibold cursor-pointer>Edit</span>
|
||||
<span class="text-md px-6 py-2 rounded-md bg-red-500 text-indigo-50 font-semibold cursor-pointer">Delete</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class=" p-4 rounded-md bg-indigo-50">
|
||||
<div class="flex justify-between mb-2 items-center">
|
||||
<p class="text-lg font-semibold items-center">Jill Johson</p>
|
||||
<p class="bg-indigo-500 text-indigo-50 px-3 py-1 rounded-md text-sm">Personal</p>
|
||||
</div>
|
||||
<div>
|
||||
<div class="flex items-center space-x-2">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M3 19v-8.93a2 2 0 01.89-1.664l7-4.666a2 2 0 012.22 0l7 4.666A2 2 0 0121 10.07V19M3 19a2 2 0 002 2h14a2 2 0 002-2M3 19l6.75-4.5M21 19l-6.75-4.5M3 10l6.75 4.5M21 10l-6.75 4.5m0 0l-1.14.76a2 2 0 01-2.22 0l-1.14-.76" />
|
||||
</svg>
|
||||
<p class="text-md font-semibold">jill@gmail.com</p>
|
||||
</div>
|
||||
<div class="flex mt-3 text-sm">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M16 8l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2M5 3a2 2 0 00-2 2v1c0 8.284 6.716 15 15 15h1a2 2 0 002-2v-3.28a1 1 0 00-.684-.948l-4.493-1.498a1 1 0 00-1.21.502l-1.13 2.257a11.042 11.042 0 01-5.516-5.517l2.257-1.128a1 1 0 00.502-1.21L9.228 3.683A1 1 0 008.279 3H5z" />
|
||||
</svg>
|
||||
<p class="text-md mb-6">111-111-111</p>
|
||||
</div>
|
||||
<div class="space-x-1">
|
||||
<span class="text-md px-6 py-2 rounded-md bg-green-500 text-indigo-50 font-semibold cursor-pointer" >Edit</span>
|
||||
<span class="text-md px-6 py-2 rounded-md bg-red-500 text-indigo-50 font-semibold cursor-pointer">Delete</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- contact 10 end -->
|
||||
|
||||
<!-- start of script section -->
|
||||
<script type="text/javascript">
|
||||
let toogler = document.getElementById("dark_mood_toogler");
|
||||
|
||||
Reference in New Issue
Block a user