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

added 15 templates

Browse Source
This commit is contained in:
merajjahir
2022-03-05 20:20:27 +06:00
parent 06099f5d1e
commit 1821d148e9
25 changed files with 5776 additions and 310 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
public/componets/navs_headers/6_header.html
View File

@@ -66,7 +66,7 @@
</svg>
<span class="sr-only">Open Menu</span>
</button>
<div class="absolute top-0 left-0 right-0 z-50 flex flex-col p-2 pb-4 m-2 space-y-3 bg-white rounded shadow" x-show.transition="open" @click.away="open = false" x-cloak>
<div class="absolute top-0 left-0 right-0 z-50 flex flex-col p-2 pb-4 m-2 space-y-3 bg-white dark:bg-gray-800 rounded shadow" x-show.transition="open" @click.away="open = false" x-cloak>
<button class="self-end flex-none px-2 ml-2 btn btn-link btn-icon" @click="open = false">
<svg
xmlns="http://www.w3.org/2000/svg"
@@ -85,11 +85,11 @@
</svg>
<span class="sr-only">Close Menu</span>
</button>
<a href="#" class="w-full font-semibold hover:bg-gray-600">Features</a>
<a href="#" class="w-full btn btn-link">Pricing</a>
<a href="#" class="w-full btn btn-link">Blog</a>
<a href="#" class="w-full btn btn-link">Company</a>
<a href="#" class="w-full btn btn-link">Sign in</a>
<a href="#" class="w-full font-semibold dark:text-cyan-300 dark:hover:text-gray-800 hover:bg-gray-300 focus:bg-gray-300 focus:ring-2 focus:ring-blue-500 transition p-1 text-xs">Features</a>
<a href="#" class="w-full dark:text-cyan-300 dark:hover:text-gray-800 hover:bg-gray-300 focus:bg-gray-300 focus:ring-2 focus:ring-blue-500 transition p-1 text-xs">Pricing</a>
<a href="#" class="w-full dark:text-cyan-300 dark:hover:text-gray-800 hover:bg-gray-300 focus:bg-gray-300 focus:ring-2 focus:ring-blue-500 transition p-1 text-xs">Blog</a>
<a href="#" class="w-full dark:text-cyan-300 dark:hover:text-gray-800 hover:bg-gray-300 focus:bg-gray-300 focus:ring-2 focus:ring-blue-500 transition p-1 text-xs">Company</a>
<a href="#" class="w-full dark:text-cyan-300 dark:hover:text-gray-800 hover:bg-gray-300 focus:bg-gray-300 focus:ring-2 focus:ring-blue-500 transition p-1 text-xs">Sign in</a>
</div>
</div>
</div>

30
public/componets/navs_headers/7_header.html
View File

@@ -22,10 +22,10 @@
<div>Header 7</div>
</section>
<section class=" dark:bg-gray-800 ">
<div class="px-4 py-6 mx-auto lg:py-8 sm:max-w-xl md:max-w-full lg:max-w-screen-xl md:px-24 lg:px-8">
<div x-data="{open_11_template_nav: false}" class="px-4 py-6 mx-auto lg:py-8 sm:max-w-xl md:max-w-full lg:max-w-screen-xl md:px-24 lg:px-8">
<div class="relative flex items-center justify-between lg:justify-center lg:space-x-16">
<ul class="flex items-center space-x-8 lg:flex">
<ul class=" hidden md:block flex items-center space-x-8 lg:flex">
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide dark:text-cyan-500 text-gray-700 transition-colors duration-200 hover:text-purple-400">Product</a></li>
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide dark:text-cyan-500 text-gray-700 transition-colors duration-200 hover:text-purple-400">Features</a></li>
<li><a href="#" aria-label="Product pricing" title="Product pricing" class="font-medium tracking-wide dark:text-cyan-500 text-gray-700 transition-colors duration-200 hover:text-purple-400">Pricing</a></li>
@@ -39,14 +39,14 @@
</svg>
<span class="ml-2 text-xl font-bold tracking-wide dark:text-gray-300 text-gray-800 uppercase">Company</span>
</a>
<ul class="flex items-center space-x-8 lg:flex">
<ul class=" hidden md:block flex items-center space-x-8 lg:flex">
<li><a href="#" aria-label="About us" title="About us" class="font-medium tracking-wide dark:text-cyan-500 text-gray-700 transition-colors duration-200 hover:text-purple-400">About us</a></li>
<li><a href="#" aria-label="Sign in" title="Sign in" class="font-medium tracking-wide dark:text-cyan-500 text-gray-700 transition-colors duration-200 hover:text-purple-400">Sign in</a></li>
<li><a href="#" aria-label="Sign up" title="Sign up" class="font-medium tracking-wide dark:text-cyan-500 text-gray-700 transition-colors duration-200 hover:text-purple-400">Sign up</a></li>
</ul>
<!-- Mobile menu -->
<div class="lg:hidden">
<button aria-label="Open Menu" title="Open Menu" class="p-2 -mr-1 transition duration-200 rounded focus:outline-none focus:shadow-outline hover:bg-purple-50 focus:bg-purple-50">
<div class="md:hidden" >
<button @click="open_11_template_nav = ! open_11_template_nav" aria-label="Open Menu" title="Open Menu" class="p-2 -mr-1 transition duration-200 rounded focus:outline-none focus:shadow-outline hover:bg-purple-50 focus:bg-purple-50">
<svg class="w-5 text-gray-600" viewBox="0 0 24 24">
<path fill="currentColor" d="M23,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path>
<path fill="currentColor" d="M23,6H1C0.4,6,0,5.6,0,5s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,6,23,6z"></path>
@@ -54,10 +54,10 @@
</svg>
</button>
<!-- Mobile menu dropdown -->
<div class="absolute top-0 left-0 w-full">
<div class="p-5 bg-white border rounded shadow-sm">
<div x-show="open_11_template_nav" @click.outside="open_11_template_nav = false" class="absolute top-0 left-0 w-full ">
<div class="p-5 bg-white dark:bg-gray-800 border rounded shadow-sm">
<div class="flex items-center justify-between mb-4">
<div>
<div >
<a href="#" aria-label="Company" title="Company" class="inline-flex items-center">
<svg class="w-8 text-deep-purple-accent-400" viewBox="0 0 24 24" stroke-linejoin="round" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" stroke="currentColor" fill="none">
<rect x="3" y="1" width="7" height="12"></rect>
@@ -69,7 +69,7 @@
</a>
</div>
<div>
<button aria-label="Close Menu" title="Close Menu" class="p-2 -mt-2 -mr-2 transition duration-200 rounded hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline">
<button @click="open_11_template_nav = false" aria-label="Close Menu" title="Close Menu" class="p-2 -mt-2 -mr-2 transition duration-200 rounded hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline">
<svg class="w-5 text-gray-600" viewBox="0 0 24 24">
<path
fill="currentColor"
@@ -81,11 +81,11 @@
</div>
<nav>
<ul class="space-y-4">
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-purple-400">Product</a></li>
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-purple-400">Features</a></li>
<li><a href="#" aria-label="Product pricing" title="Product pricing" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-purple-400">Pricing</a></li>
<li><a href="#" aria-label="About us" title="About us" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-purple-400">About us</a></li>
<li><a href="#" aria-label="Sign in" title="Sign in" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-purple-400">Sign in</a></li>
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide text-gray-700 dark:text-cyan-500 transition-colors duration-200 hover:text-purple-400">Product</a></li>
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide text-gray-700 dark:text-cyan-500 transition-colors duration-200 hover:text-purple-400">Features</a></li>
<li><a href="#" aria-label="Product pricing" title="Product pricing" class="font-medium tracking-wide text-gray-700 dark:text-cyan-500 transition-colors duration-200 hover:text-purple-400">Pricing</a></li>
<li><a href="#" aria-label="About us" title="About us" class="font-medium tracking-wide text-gray-700 dark:text-cyan-500 transition-colors duration-200 hover:text-purple-400">About us</a></li>
<li><a href="#" aria-label="Sign in" title="Sign in" class="font-medium tracking-wide text-gray-700 dark:text-cyan-500 transition-colors duration-200 hover:text-purple-400">Sign in</a></li>
<li>
<a
href="#"

20
public/componets/navs_headers/8_header.html
View File

@@ -22,7 +22,7 @@
</section>
<div class="bg-gray-900">
<div class="px-4 py-5 mx-auto sm:max-w-xl md:max-w-full lg:max-w-screen-xl md:px-24 lg:px-8">
<div x-data="{open_12_template_nav: false}" class="px-4 py-5 mx-auto sm:max-w-xl md:max-w-full lg:max-w-screen-xl md:px-24 lg:px-8">
<div class="relative flex items-center justify-between">
<a href="#" aria-label="Company" title="Company" class="inline-flex items-center">
<svg class="w-8 text-teal-400" viewBox="0 0 24 24" stroke-linejoin="round" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" stroke="currentColor" fill="none">
@@ -33,7 +33,7 @@
</svg>
<span class="ml-2 text-xl font-bold tracking-wide text-gray-100 uppercase">Company</span>
</a>
<ul class="flex items-center space-x-8 lg:flex">
<ul class="hidden md:block md:flex items-center space-x-8 lg:flex">
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide text-gray-100 transition-colors duration-200 hover:text-teal-400">Product</a></li>
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide text-gray-100 transition-colors duration-200 hover:text-teal-400">Features</a></li>
<li><a href="#" aria-label="Product pricing" title="Product pricing" class="font-medium tracking-wide text-gray-100 transition-colors duration-200 hover:text-teal-400">Pricing</a></li>
@@ -50,15 +50,15 @@
</li>
</ul>
<!-- Mobile menu -->
<div class="lg:hidden">
<button aria-label="Open Menu" title="Open Menu" class="p-2 -mr-1 transition duration-200 rounded focus:outline-none focus:shadow-outline">
<div class="md:hidden">
<button @click="open_12_template_nav= ! open_12_template_nav" aria-label="Open Menu" title="Open Menu" class="p-2 -mr-1 transition duration-200 rounded focus:outline-none focus:shadow-outline">
<svg class="w-5 text-gray-600" viewBox="0 0 24 24">
<path fill="currentColor" d="M23,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path>
<path fill="currentColor" d="M23,6H1C0.4,6,0,5.6,0,5s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,6,23,6z"></path>
<path fill="currentColor" d="M23,20H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,20,23,20z"></path>
</svg>
</button>
<div class="absolute top-0 left-0 w-full">
<div x-show="open_12_template_nav" class="absolute top-0 left-0 w-full ">
<div class="p-5 bg-white border rounded shadow-sm">
<div class="flex items-center justify-between mb-4">
<div>
@@ -73,7 +73,7 @@
</a>
</div>
<div>
<button aria-label="Close Menu" title="Close Menu" class="p-2 -mt-2 -mr-2 transition duration-200 rounded hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline">
<button @click="open_12_template_nav= false" aria-label="Close Menu" title="Close Menu" class="p-2 -mt-2 -mr-2 transition duration-200 rounded hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline">
<svg class="w-5 text-gray-600" viewBox="0 0 24 24">
<path
fill="currentColor"
@@ -85,10 +85,10 @@
</div>
<nav>
<ul class="space-y-4">
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-purple-400">Product</a></li>
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-purple-400">Features</a></li>
<li><a href="#" aria-label="Product pricing" title="Product pricing" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-purple-400">Pricing</a></li>
<li><a href="#" aria-label="About us" title="About us" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-purple-400">About us</a></li>
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-teal-400">Product</a></li>
<li><a href="#" aria-label="Our product" title="Our product" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-teal-400">Features</a></li>
<li><a href="#" aria-label="Product pricing" title="Product pricing" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-teal-400">Pricing</a></li>
<li><a href="#" aria-label="About us" title="About us" class="font-medium tracking-wide text-gray-700 transition-colors duration-200 hover:text-teal-400">About us</a></li>
<li>
<a
href="#"