mirror of
https://github.com/istiyakaminsanto/tailShape.git
synced 2025-12-26 14:57:01 +00:00
138 lines
7.5 KiB
HTML
138 lines
7.5 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>Testimonial 8</title>
|
|
</head>
|
|
<body>
|
|
|
|
|
|
<button class="dark_mode_button_custom_style" id="dark_mood_toogler">
|
|
d
|
|
</button>
|
|
|
|
<!-- testimonial 8 start -->
|
|
<section class="section_divider">
|
|
<div>Testimonial 8</div>
|
|
</section>
|
|
<div class="bg-gray-100 dark:bg-gray-800">
|
|
<div class="max-w-6xl px-6 py-8 mx-auto md:px-12">
|
|
<div class="items-center -mx-6 md:flex md:-mx-12">
|
|
<div class="w-full px-10 mt-16 md:w-1/2 md:mt-0">
|
|
<div class="overflow-hidden bg-white dark:bg-gray-800 dark:border-2 dark:border-emerald-500 rounded-lg shadow-xl">
|
|
<img class="w-full" loading="lazy"
|
|
src="https://images.unsplash.com/photo-1542103749-8ef59b94f47e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2550&q=80"
|
|
alt="Portrait of Irene Sims, VP of Sales">
|
|
<div class="p-12">
|
|
<blockquote class="text-lg italic dark:text-emerald-400 text-gray-800">
|
|
<div class="absolute -mt-2 -ml-2 pin-t pin-l">
|
|
<svg class="w-8 h-8" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path
|
|
d="M15.264 19.552C15.264 23.2 17.664 25.12 20.352 25.12C23.328 25.12 26.112 22.624 26.112 19.456C26.112 16.864 24.288 15.136 22.08 15.136C21.888 15.136 21.408 15.136 21.312 15.136C22.368 12.064 25.824 8.8 29.376 7.072L26.4 4C20.448 6.976 15.264 13.504 15.264 19.552ZM0 19.552C0 23.2 2.304 25.12 5.088 25.12C8.064 25.12 10.848 22.624 10.848 19.456C10.848 16.864 8.928 15.136 6.72 15.136C6.528 15.136 6.048 15.136 5.952 15.136C7.008 12.064 10.56 8.8 14.016 7.072L11.136 4C5.184 6.976 0 13.504 0 19.552Z"
|
|
class="text-gray-300 dark:text-emerald-300 dark:opacity-25 fill-current"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="relative">
|
|
<p>
|
|
This service rocks on a whole new level. You've got to try it out for yourself.
|
|
</p>
|
|
</div>
|
|
</blockquote>
|
|
<div class="mt-10">
|
|
<div>
|
|
<div class="font-semibold tracking-wider text-gray-900 dark:text-white uppercase">
|
|
Irene Sims
|
|
</div>
|
|
<div class="text-gray-700 dark:text-emerald-400">VP of Sales, SomeCompany</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="w-full px-6 md:w-1/2 md:px-12 pt-5 md:pt-0">
|
|
<h2 class="text-2xl font-bold text-gray-900 dark:text-white dark:border-b-2 dark:text-center dark:border-emerald-400">Crafted with Awesomeness</h2>
|
|
<div class="flex mt-10 dark:text-emerald-500">
|
|
<div>
|
|
<svg class="w-10 h-10" fill="none" stroke="currentColor" viewBox="0 0 24 24"
|
|
xmlns="http://www.w3.org/2000/svg">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M17.657 18.657A8 8 0 016.343 7.343S7 9 9 10c0-2 .5-5 2.986-7C14 5 16.09 5.777 17.656 7.343A7.975 7.975 0 0120 13a7.975 7.975 0 01-2.343 5.657z">
|
|
</path>
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M9.879 16.121A3 3 0 1012.015 11L11 14H9c0 .768.293 1.536.879 2.121z"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="mt-2 ml-4">
|
|
<div class="text-lg font-semibold">Radical Feature Set</div>
|
|
<p class="mt-2 text-gray-700 dark:text-gray-300">
|
|
Filled to the rim with radical features and rock'n sock'n tools. You'll be glad you signed
|
|
up.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex mt-10 dark:text-emerald-500">
|
|
<div>
|
|
<svg class="w-10 h-10" fill="none" stroke="currentColor" viewBox="0 0 24 24"
|
|
xmlns="http://www.w3.org/2000/svg">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M13 10V3L4 14h7v7l9-11h-7z">
|
|
</path>
|
|
</svg>
|
|
</div>
|
|
<div class="mt-2 ml-4">
|
|
<div class="text-lg font-semibold">Lightning Fast Speed</div>
|
|
<p class="mt-2 text-gray-700 dark:text-gray-300">
|
|
Built and crafted with speed to take your game back to the next-level. 1.21 GigaWatts!
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex mt-10 dark:text-emerald-500">
|
|
<div>
|
|
<svg class="w-10 h-10" fill="none" stroke="currentColor" viewBox="0 0 24 24"
|
|
xmlns="http://www.w3.org/2000/svg">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z">
|
|
</path>
|
|
</svg>
|
|
</div>
|
|
<div class="mt-2 ml-4">
|
|
<div class="text-lg font-semibold">Fully Customizable</div>
|
|
<p class="mt-2 text-gray-700 dark:text-gray-300">
|
|
Every element and component is customizable to fit the needs of your application.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- testimonial 8 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');
|
|
|
|
}
|
|
})
|
|
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> |