Mirrors/tailShape
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

added other tempalte parts

Browse Source
This commit is contained in:
merajjahir
2022-03-09 20:14:06 +06:00
parent 8ce2e56c27
commit 9fd68f660c
37 changed files with 5753 additions and 658 deletions
Download Patch File Download Diff File Expand all files Collapse all files

360
public/template/contact_page/1_contact_page.html Normal file
View File

@@ -0,0 +1,360 @@
<!DOCTYPE html>
<html lang="en" class="dark">
<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">
<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
<title>Contact page 1</title>
</head>
<body>
<button class="dark_mode_button_custom_style" id="dark_mood_toogler">
d
</button>
<!-- header 24 start -->
<style>
@media(max-width:1520px) {
.left-svg {
display: none;
}
}
/* small css for the mobile nav close */
#nav-mobile-btn.close span:first-child {
transform: rotate(45deg);
top: 4px;
position: relative;
background: #a0aec0;
}
#nav-mobile-btn.close span:nth-child(2) {
transform: rotate(-45deg);
margin-top: 0px;
background: #a0aec0;
}
</style>
<header class="relative z-50 w-full h-24 overflow-hidden dark:bg-gray-900 ">
<div
class="container flex items-center justify-center h-full max-w-6xl px-8 mx-auto sm:justify-between xl:px-0">
<a href="/" class="relative flex flex-row items-center h-full font-black leading-none">
<svg class="w-auto h-6 text-indigo-600 fill-current" viewBox="0 0 194 116"
xmlns="http://www.w3.org/2000/svg">
<g fill-rule="evenodd">
<path
d="M96.869 0L30 116h104l-9.88-17.134H59.64l47.109-81.736zM0 116h19.831L77 17.135 67.088 0z" />
<path d="M87 68.732l9.926 17.143 29.893-51.59L174.15 116H194L126.817 0z" />
</g>
</svg>
<span class="ml-3 text-xl text-gray-800 dark:text-red-300">Brand Logo<span class="text-pink-500">.</span></span>
</a>
<nav id="nav"
class="absolute top-0 left-0 z-50 flex flex-col items-center justify-between hidden w-full h-64 pt-5 mt-24 text-sm text-gray-800 bg-white border-t border-gray-200 md:w-auto md:flex-row md:h-24 lg:text-base md:bg-transparent md:mt-0 md:border-none md:py-0 md:flex md:relative">
<a href="#"
class="ml-0 mr-0 font-bold duration-100 md:ml-12 md:mr-3 lg:mr-8 transition-color dark:text-pink-500 dark:hover:text-indigo-600 hover:text-indigo-600 ">Home</a>
<a href="#features"
class="mr-0 font-bold duration-100 md:mr-3 lg:mr-8 transition-color dark:text-pink-500 dark:hover:text-indigo-600 hover:text-indigo-600">Features</a>
<a href="#pricing"
class="mr-0 font-bold duration-100 md:mr-3 lg:mr-8 transition-color dark:text-pink-500 dark:hover:text-indigo-600 hover:text-indigo-600">Pricing</a>
<a href="#testimonials"
class="font-bold duration-100 transition-color hover:text-indigo-600 dark:text-pink-500 dark:hover:text-indigo-600">Testimonials</a>
<div class="flex flex-col w-full font-medium border-t border-gray-200 md:hidden">
<a href="#_" class="w-full py-2 font-bold text-center text-pink-500 ">Login</a>
<a href="#_"
class="relative inline-block w-full px-5 py-3 text-sm leading-none text-center text-white bg-indigo-700 fold-bold">Get
Started</a>
</div>
</nav>
<div
class="absolute left-0 flex-col items-center justify-center hidden w-full pb-8 mt-48 border-b border-gray-200 md:relative md:w-auto md:bg-transparent md:border-none md:mt-0 md:flex-row md:p-0 md:items-end md:flex md:justify-between">
<a href="#_"
class="relative z-40 px-3 py-2 mr-0 text-sm font-bold text-pink-500 md:px-5 lg:text-white sm:mr-3 md:mt-0">Login</a>
<a href="#_"
class="relative z-40 inline-block w-auto h-full px-5 py-3 text-sm font-bold leading-none text-white transition-all transition duration-100 duration-300 bg-indigo-700 rounded shadow-md fold-bold lg:bg-white lg:text-indigo-700 sm:w-full lg:shadow-none hover:shadow-xl">Get
Started</a>
<svg class="absolute top-0 left-0 hidden w-screen max-w-3xl -mt-64 -ml-12 lg:block"
viewBox="0 0 818 815" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<linearGradient x1="0%" y1="0%" x2="100%" y2="100%" id="c">
<stop stop-color="#E614F2" offset="0%" />
<stop stop-color="#FC3832" offset="100%" />
</linearGradient>
<linearGradient x1="0%" y1="0%" x2="100%" y2="100%" id="f">
<stop stop-color="#657DE9" offset="0%" />
<stop stop-color="#1C0FD7" offset="100%" />
</linearGradient>
<filter x="-4.7%" y="-3.3%" width="109.3%" height="109.3%" filterUnits="objectBoundingBox"
id="a">
<feOffset dy="8" in="SourceAlpha" result="shadowOffsetOuter1" />
<feGaussianBlur stdDeviation="8" in="shadowOffsetOuter1" result="shadowBlurOuter1" />
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0" in="shadowBlurOuter1" />
</filter>
<filter x="-4.7%" y="-3.3%" width="109.3%" height="109.3%" filterUnits="objectBoundingBox"
id="d">
<feOffset dy="8" in="SourceAlpha" result="shadowOffsetOuter1" />
<feGaussianBlur stdDeviation="8" in="shadowOffsetOuter1" result="shadowBlurOuter1" />
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0" in="shadowBlurOuter1" />
</filter>
<path
d="M160.52 108.243h497.445c17.83 0 24.296 1.856 30.814 5.342 6.519 3.486 11.635 8.602 15.12 15.12 3.487 6.52 5.344 12.985 5.344 30.815v497.445c0 17.83-1.857 24.296-5.343 30.814-3.486 6.519-8.602 11.635-15.12 15.12-6.52 3.487-12.985 5.344-30.815 5.344H160.52c-17.83 0-24.296-1.857-30.814-5.343-6.519-3.486-11.635-8.602-15.12-15.12-3.487-6.52-5.343-12.985-5.343-30.815V159.52c0-17.83 1.856-24.296 5.342-30.814 3.486-6.519 8.602-11.635 15.12-15.12 6.52-3.487 12.985-5.343 30.815-5.343z"
id="b" />
<path
d="M159.107 107.829H656.55c17.83 0 24.296 1.856 30.815 5.342 6.518 3.487 11.634 8.602 15.12 15.12 3.486 6.52 5.343 12.985 5.343 30.816V656.55c0 17.83-1.857 24.296-5.343 30.815-3.486 6.518-8.602 11.634-15.12 15.12-6.519 3.486-12.985 5.343-30.815 5.343H159.107c-17.83 0-24.297-1.857-30.815-5.343-6.519-3.486-11.634-8.602-15.12-15.12-3.487-6.519-5.343-12.985-5.343-30.815V159.107c0-17.83 1.856-24.297 5.342-30.815 3.487-6.519 8.602-11.634 15.12-15.12 6.52-3.487 12.985-5.343 30.816-5.343z"
id="e" />
</defs>
<g fill="none" fill-rule="evenodd" opacity=".9">
<g transform="rotate(65 416.452 409.167)">
<use fill="#000" filter="url(#a)" xlink:href="#b" />
<use fill="url(#c)" xlink:href="#b" />
</g>
<g transform="rotate(29 421.929 414.496)">
<use fill="#000" filter="url(#d)" xlink:href="#e" />
<use fill="url(#f)" xlink:href="#e" />
</g>
</g>
</svg>
</div>
<div id="nav-mobile-btn"
class="absolute top-0 right-0 z-50 block w-6 mt-8 mr-10 cursor-pointer select-none md:hidden sm:mt-10">
<span class="block w-full h-1 mt-2 duration-200 transform bg-gray-800 rounded-full sm:mt-1"></span>
<span class="block w-full h-1 mt-1 duration-200 transform bg-gray-800 rounded-full"></span>
</div>
</div>
</header>
<script>
if (document.getElementById('nav-mobile-btn')) {
document.getElementById('nav-mobile-btn').addEventListener('click', function () {
if (this.classList.contains('close')) {
document.getElementById('nav').classList.add('hidden');
this.classList.remove('close');
} else {
document.getElementById('nav').classList.remove('hidden');
this.classList.add('close');
}
});
}
</script>
<!-- header 24 end -->
<!-- contact 5 start -->
<section class="text-gray-600 body-font relative dark:bg-gray-800">
<h2 class="text-3xl font-bold text-black dark:text-white pt-24 text-center">
Visit , Call or Email Us
</h2>
<div class="container px-5 py-24 mx-auto flex sm:flex-nowrap flex-wrap">
<div class="lg:w-2/3 md:w-1/2 bg-gray-300 rounded-lg overflow-hidden sm:mr-10 p-10 flex items-end justify-start relative">
<iframe class="absolute inset-0" style="filter: grayscale(1) contrast(1.2) opacity(0.4);" title="map" marginheight="0" marginwidth="0" scrolling="no" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d101408.032631041!2d-122.15130744474018!3d37.41345079210977!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x808fb7495bec0189%3A0x7c17d44a466baf9b!2z4Kau4Ka-4KaJ4Kao4KeN4Kaf4KeH4KaH4KaoIOCmreCmv-CmiSwg4KaV4KeN4Kav4Ka-4Kay4Ka_4Kar4KeL4Kaw4KeN4Kao4Ka_4Kav4Ka84Ka-LCDgpq7gpr7gprDgp43gppXgpr_gpqgg4Kav4KeB4KaV4KeN4Kak4Kaw4Ka-4Ka34KeN4Kaf4KeN4Kaw!5e0!3m2!1sbn!2sbd!4v1646216286435!5m2!1sbn!2sbd" width="100%" height="100%" frameborder="0"></iframe>
<div class="bg-white relative flex flex-wrap py-6 rounded shadow-md">
<div class="lg:w-1/2 px-6">
<h2 class="title-font font-semibold text-gray-900 tracking-widest text-xs">ADDRESS</h2>
<p class="mt-1">Photo booth tattooed prism, portland taiyaki hoodie neutra typewriter</p>
</div>
<div class="lg:w-1/2 px-6 mt-4 lg:mt-0">
<h2 class="title-font font-semibold text-gray-900 tracking-widest text-xs">EMAIL</h2>
<a class="text-indigo-500 leading-relaxed">example@email.com</a>
<h2 class="title-font font-semibold text-gray-900 tracking-widest text-xs mt-4">PHONE</h2>
<p class="leading-relaxed">123-456-7890</p>
</div>
</div>
</div>
<div class="lg:w-1/3 md:w-1/2 bg-white dark:bg-gray-800 rounded-lg flex flex-col md:ml-auto w-full md:py-8 mt-8 md:mt-0">
<div class=" bg-white dark:bg-gray-800 rounded-lg border-2 p-8 flex flex-col md:ml-auto w-full mt-10 md:mt-0 relative z-10 shadow-md">
<h2 class="text-gray-900 dark:text-emerald-300 text-lg mb-1 font-medium title-font">Feedback</h2>
<p class="leading-relaxed mb-5 text-gray-600 dark:text-cyan-100">Post-ironic portland shabby chic echo park, banjo fashion axe</p>
<div class="relative mb-4">
<label for="email" class="leading-7 text-sm text-gray-600 dark:text-emerald-300 font-bold">Email</label>
<input type="email" id="email" name="email" class="w-full bg-white rounded border border-gray-300 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out">
</div>
<div class="relative mb-4">
<label for="message" class="leading-7 text-sm text-gray-600 dark:text-emerald-300 font-bold">Message</label>
<textarea id="message" name="message" class="w-full bg-white rounded border border-gray-300 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-200 h-32 text-base outline-none text-gray-700 py-1 px-3 resize-none leading-6 transition-colors duration-200 ease-in-out"></textarea>
</div>
<button class="text-white bg-indigo-500 border-0 py-2 px-6 focus:outline-none hover:bg-indigo-600 dark:bg-cyan-100 dark:hover:bg-emerald-100 dark:text-gray-800 dark:font-bold rounded text-lg">Button</button>
<p class="text-xs text-gray-500 dark:text-cyan-100 mt-3">Chicharrones blog helvetica normcore iceland tousled brook viral artisan.</p>
</div>
</div>
</div>
</section>
<!-- contact 5 end -->
<!-- faq 2 start -->
<section class="dark:bg-gray-800 dark:text-gray-100">
<div class="container flex flex-col items-center p-4 mx-auto md:p-8">
<h1 class="text-3xl font-bold leading-none text-center sm:text-4xl uppercase pb-4" >frequently asked questions</h1>
<div class="relative mt-6 mb-12">
<span class="absolute inset-y-0 flex items-center pl-2 mx-auto">
<button type="submit" title="Search" class="p-1 focus:outline-none focus:ring">
<svg fill="currentColor" viewBox="0 0 512 512" class="w-4 h-4 dark:text-gray-100">
<path d="M479.6,399.716l-81.084-81.084-62.368-25.767A175.014,175.014,0,0,0,368,192c0-97.047-78.953-176-176-176S16,94.953,16,192,94.953,368,192,368a175.034,175.034,0,0,0,101.619-32.377l25.7,62.2L400.4,478.911a56,56,0,1,0,79.2-79.195ZM48,192c0-79.4,64.6-144,144-144s144,64.6,144,144S271.4,336,192,336,48,271.4,48,192ZM456.971,456.284a24.028,24.028,0,0,1-33.942,0l-76.572-76.572-23.894-57.835L380.4,345.771l76.573,76.572A24.028,24.028,0,0,1,456.971,456.284Z"></path>
</svg>
</button>
</span>
<input type="search" name="Search" placeholder="Search..." class="w-full py-3 pl-12 text-sm rounded-full border-2 sm:w-96 focus:outline-none dark:bg-gray-800 dark:text-gray-100 focus:dark:bg-gray-900">
</div>
<div class="flex flex-col w-full divide-y sm:flex-row sm:divide-y-0 sm:divide-x sm:px-8 lg:px-12 xl:px-32 dark:divide-gray-700 divide-indigo-600">
<div class="flex flex-col w-full divide-y dark:divide-gray-700 divide-indigo-600 ">
<a rel="noopener noreferrer" href="#" class="flex items-center justify-center p-4 sm:py-8 lg:py-12">Billing</a>
<a rel="noopener noreferrer" href="#" class="flex items-center justify-center p-4 sm:py-8 lg:py-12">Support</a>
<a rel="noopener noreferrer" href="#" class="flex items-center justify-center p-4 sm:py-8 lg:py-12">Account</a>
</div>
<div class="flex flex-col w-full divide-y dark:divide-gray-700 divide-indigo-600">
<a rel="noopener noreferrer" href="#" class="flex items-center justify-center p-4 sm:py-8 lg:py-12">Features</a>
<a rel="noopener noreferrer" href="#" class="flex items-center justify-center p-4 sm:py-8 lg:py-12">Contact us</a>
<a rel="noopener noreferrer" href="#" class="flex items-center justify-center p-4 sm:py-8 lg:py-12">My orders</a>
</div>
<div class="hidden w-full divide-y sm:flex-col sm:flex dark:divide-gray-700 divide-indigo-600">
<a rel="noopener noreferrer" href="#" class="flex items-center justify-center p-4 sm:py-8 lg:py-12">Enterprise</a>
<a rel="noopener noreferrer" href="#" class="flex items-center justify-center p-4 sm:py-8 lg:py-12">Privacy</a>
<a rel="noopener noreferrer" href="#" class="flex items-center justify-center p-4 sm:py-8 lg:py-12">Developers</a>
</div>
</div>
</div>
</section>
<!-- faq 2 end -->
<!-- footer 47 start -->
<footer class="px-4 pt-24 pb-8 text-gray-400 bg-white dark:bg-gray-900 border-t border-gray-200">
<div class="container flex flex-col justify-between max-w-6xl px-4 mx-auto overflow-hidden lg:flex-row">
<div class="w-full pl-12 mr-4 text-left lg:w-1/4 sm:text-center sm:pl-0 lg:text-left">
<a href="/"
class="flex justify-start text-left sm:text-center lg:text-left sm:justify-center lg:justify-start">
<span class="flex items-start sm:items-center">
<svg class="w-auto h-6 text-gray-900 dark:text-cyan-300 fill-current" viewBox="0 0 194 116"
xmlns="http://www.w3.org/2000/svg">
<g fill-rule="evenodd">
<path
d="M96.869 0L30 116h104l-9.88-17.134H59.64l47.109-81.736zM0 116h19.831L77 17.135 67.088 0z">
</path>
<path d="M87 68.732l9.926 17.143 29.893-51.59L174.15 116H194L126.817 0z"></path>
</g>
</svg>
</span>
</a>
<p class="mt-6 mr-4 text-base text-gray-500 dark:text-gray-300">Crafting the next-level of user experience and engagement.
</p>
</div>
<div class="block w-full pl-10 mt-6 text-sm lg:w-3/4 sm:flex lg:mt-0">
<ul class="flex flex-col w-full p-0 font-medium text-left text-gray-700 list-none">
<li class="inline-block px-3 py-2 mt-5 font-bold tracking-wide text-gray-800 uppercase md:mt-0">
Product</li>
<li><a href="#_"
class="inline-block px-3 py-2 text-gray-500 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300">Features</a>
</li>
<li><a href="#_"
class="inline-block px-3 py-2 text-gray-500 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300">Integrations</a>
</li>
<li><a href="#_"
class="inline-block px-3 py-2 text-gray-500 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300 ">Pricing</a>
</li>
<li><a href="#_"
class="inline-block px-3 py-2 text-gray-500 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300 ">FAQ</a></li>
</ul>
<ul class="flex flex-col w-full p-0 font-medium text-left text-gray-700 list-none">
<li class="inline-block px-3 py-2 mt-5 font-bold tracking-wide text-gray-800 uppercase md:mt-0">
Company</li>
<li><a href="#_"
class="inline-block px-3 py-2 text-gray-500 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300 ">Privacy</a>
</li>
<li><a href="#_" class="inline-block px-3 py-2 text-gray-500 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300">Terms
of
Service</a></li>
</ul>
<ul class="flex flex-col w-full p-0 font-medium text-left text-gray-700 list-none">
<li class="inline-block px-3 py-2 mt-5 font-bold tracking-wide text-gray-800 uppercase md:mt-0">
TailwindCSS
</li>
<li><a href="https://devdojo.com/tailwindcss/components"
class="inline-block px-3 py-2 text-gray-500 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300">Tailwind
Components</a></li>
<li><a href="https://devdojo.com/tailwindcss/templates"
class="inline-block px-3 py-2 text-gray-500 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300">Tailwind
Templates</a></li>
<li><a href="https://devdojo.com/tails"
class="inline-block px-3 py-2 text-gray-500 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300">Tails</a></li>
</ul>
<div class="flex flex-col w-full text-gray-700">
<div class="inline-block px-3 py-2 mt-5 font-bold text-gray-800 uppercase md:mt-0">Follow Us</div>
<div class="flex justify-start pl-4 mt-2">
<a class="flex items-center block mr-6 text-gray-400 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300"
target="_blank" rel="noopener noreferrer" href="https://devdojo.com">
<svg viewBox="0 0 24 24" class="w-5 h-5 fill-current" xmlns="http://www.w3.org/2000/svg">
<path
d="M23.998 12c0-6.628-5.372-12-11.999-12C5.372 0 0 5.372 0 12c0 5.988 4.388 10.952 10.124 11.852v-8.384H7.078v-3.469h3.046V9.356c0-3.008 1.792-4.669 4.532-4.669 1.313 0 2.686.234 2.686.234v2.953H15.83c-1.49 0-1.955.925-1.955 1.874V12h3.328l-.532 3.469h-2.796v8.384c5.736-.9 10.124-5.864 10.124-11.853z" />
</svg>
</a>
<a class="flex items-center block mr-6 text-gray-400 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300"
target="_blank" rel="noopener noreferrer" href="https://devdojo.com">
<svg viewBox="0 0 24 24" class="w-5 h-5 fill-current" xmlns="http://www.w3.org/2000/svg">
<path
d="M23.954 4.569a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.691 8.094 4.066 6.13 1.64 3.161a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.061a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.937 4.937 0 004.604 3.417 9.868 9.868 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.054 0 13.999-7.496 13.999-13.986 0-.209 0-.42-.015-.63a9.936 9.936 0 002.46-2.548l-.047-.02z" />
</svg>
</a>
<a class="flex items-center block text-gray-400 no-underline hover:text-gray-600 dark:text-gray-300 dark:hover:text-cyan-300"
target="_blank" rel="noopener noreferrer" href="https://devdojo.com">
<svg viewBox="0 0 24 24" class="w-5 h-5 fill-current" xmlns="http://www.w3.org/2000/svg">
<path
d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" />
</svg>
</a>
</div>
</div>
</div>
</div>
<div class=" pt-6 mt-10 text-center text-gray-400 dark:text-cyan-300 border-t border-gray-100">© 2020 Landmark. All rights
reserved.</div>
</footer>
<!-- footer 47 end -->
<!-- start of script section -->
<script type="text/javascript">
let toogler = document.getElementById("dark_mood_toogler");
let doc_html_el = document.getElementsByTagName('html')[0];
doc_html_el.addEventListener('keyup',(e)=>{
// key 220 is the backward slash , need to press ctrl+ \ to activate or deactivate darkmode
if(e.ctrlKey && e.keyCode =='220'){
doc_html_el.className =='' ? doc_html_el.classList.add('dark'):doc_html_el.classList.remove('dark');
}
})
doc_html_el.addEventListener('keyup',(e)=>{
// key 191 is the forward slash , need to press ctrl+ / to show or hide the darkmode button
if(e.ctrlKey && e.keyCode =='191'){
toogler.style.display =='block'? toogler.style.display = 'none':toogler.style.display ='block';
}
})
toogler.addEventListener('click',()=>{
doc_html_el.className =='' ? doc_html_el.classList.add('dark'):doc_html_el.classList.remove('dark');
console.log(doc_html_el.className);
})
</script>
<!-- end of script section -->
</body>
</html>

46
public/template/contact_page/2_contact_page.html Normal file
View File

@@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="en" class="dark">
<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">
<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
<title>About page 2</title>
</head>
<body>
<button class="dark_mode_button_custom_style" id="dark_mood_toogler">
d
</button>
<!-- start of script section -->
<script type="text/javascript">
let toogler = document.getElementById("dark_mood_toogler");
let doc_html_el = document.getElementsByTagName('html')[0];
doc_html_el.addEventListener('keyup',(e)=>{
// key 220 is the backward slash , need to press ctrl+ \ to activate or deactivate darkmode
if(e.ctrlKey && e.keyCode =='220'){
doc_html_el.className =='' ? doc_html_el.classList.add('dark'):doc_html_el.classList.remove('dark');
}
})
doc_html_el.addEventListener('keyup',(e)=>{
// key 191 is the forward slash , need to press ctrl+ / to show or hide the darkmode button
if(e.ctrlKey && e.keyCode =='191'){
toogler.style.display =='block'? toogler.style.display = 'none':toogler.style.display ='block';
}
})
toogler.addEventListener('click',()=>{
doc_html_el.className =='' ? doc_html_el.classList.add('dark'):doc_html_el.classList.remove('dark');
console.log(doc_html_el.className);
})
</script>
<!-- end of script section -->
</body>
</html>

46
public/template/contact_page/3_contact_page.html Normal file
View File

@@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="en" class="dark">
<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">
<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
<title>About page 3</title>
</head>
<body>
<button class="dark_mode_button_custom_style" id="dark_mood_toogler">
d
</button>
<!-- start of script section -->
<script type="text/javascript">
let toogler = document.getElementById("dark_mood_toogler");
let doc_html_el = document.getElementsByTagName('html')[0];
doc_html_el.addEventListener('keyup',(e)=>{
// key 220 is the backward slash , need to press ctrl+ \ to activate or deactivate darkmode
if(e.ctrlKey && e.keyCode =='220'){
doc_html_el.className =='' ? doc_html_el.classList.add('dark'):doc_html_el.classList.remove('dark');
}
})
doc_html_el.addEventListener('keyup',(e)=>{
// key 191 is the forward slash , need to press ctrl+ / to show or hide the darkmode button
if(e.ctrlKey && e.keyCode =='191'){
toogler.style.display =='block'? toogler.style.display = 'none':toogler.style.display ='block';
}
})
toogler.addEventListener('click',()=>{
doc_html_el.className =='' ? doc_html_el.classList.add('dark'):doc_html_el.classList.remove('dark');
console.log(doc_html_el.className);
})
</script>
<!-- end of script section -->
</body>
</html>