mirror of
https://github.com/istiyakaminsanto/tailShape.git
synced 2025-12-17 18:57:00 +00:00
added 31 number footer
This commit is contained in:
merajjahir
125
dist/tailshape.css
vendored
125
dist/tailshape.css
vendored
@@ -1750,6 +1750,11 @@ Ensure the default browser behavior of the `hidden` attribute.
|
||||
background-color: rgb(156 163 175 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-indigo-50 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(238 242 255 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-opacity-50 {
|
||||
--tw-bg-opacity: 0.5;
|
||||
}
|
||||
@@ -1780,6 +1785,10 @@ Ensure the default browser behavior of the `hidden` attribute.
|
||||
--tw-gradient-stops: var(--tw-gradient-from), #ef4444, var(--tw-gradient-to, rgb(239 68 68 / 0));
|
||||
}
|
||||
|
||||
.via-emerald-300 {
|
||||
--tw-gradient-stops: var(--tw-gradient-from), #6ee7b7, var(--tw-gradient-to, rgb(110 231 183 / 0));
|
||||
}
|
||||
|
||||
.to-yellow-500 {
|
||||
--tw-gradient-to: #eab308;
|
||||
}
|
||||
@@ -3089,19 +3098,126 @@ Ensure the default browser behavior of the `hidden` attribute.
|
||||
background-color: rgb(209 213 219 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-gray-500 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(107 114 128 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-cyan-500 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(6 182 212 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-cyan-700 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(14 116 144 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-indigo-800 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(55 48 163 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-indigo-300 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(165 180 252 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-indigo-600 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(79 70 229 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-opacity-40 {
|
||||
--tw-bg-opacity: 0.4;
|
||||
}
|
||||
|
||||
.dark .dark\:bg-gradient-to-r {
|
||||
background-image: linear-gradient(to right, var(--tw-gradient-stops));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-gradient-to-b {
|
||||
background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-gradient-to-t {
|
||||
background-image: linear-gradient(to top, var(--tw-gradient-stops));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-gradient-to-l {
|
||||
background-image: linear-gradient(to left, var(--tw-gradient-stops));
|
||||
}
|
||||
|
||||
.dark .dark\:from-emerald-800 {
|
||||
--tw-gradient-from: #065f46;
|
||||
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(6 95 70 / 0));
|
||||
}
|
||||
|
||||
.dark .dark\:from-red-200 {
|
||||
--tw-gradient-from: #fecaca;
|
||||
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(254 202 202 / 0));
|
||||
}
|
||||
|
||||
.dark .dark\:from-red-500 {
|
||||
--tw-gradient-from: #ef4444;
|
||||
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(239 68 68 / 0));
|
||||
}
|
||||
|
||||
.dark .dark\:from-violet-500 {
|
||||
--tw-gradient-from: #8b5cf6;
|
||||
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(139 92 246 / 0));
|
||||
}
|
||||
|
||||
.dark .dark\:from-violet-600 {
|
||||
--tw-gradient-from: #7c3aed;
|
||||
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(124 58 237 / 0));
|
||||
}
|
||||
|
||||
.dark .dark\:from-black {
|
||||
--tw-gradient-from: #000;
|
||||
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(0 0 0 / 0));
|
||||
}
|
||||
|
||||
.dark .dark\:via-emerald-300 {
|
||||
--tw-gradient-stops: var(--tw-gradient-from), #6ee7b7, var(--tw-gradient-to, rgb(110 231 183 / 0));
|
||||
}
|
||||
|
||||
.dark .dark\:via-emerald-500 {
|
||||
--tw-gradient-stops: var(--tw-gradient-from), #10b981, var(--tw-gradient-to, rgb(16 185 129 / 0));
|
||||
}
|
||||
|
||||
.dark .dark\:via-emerald-800 {
|
||||
--tw-gradient-stops: var(--tw-gradient-from), #065f46, var(--tw-gradient-to, rgb(6 95 70 / 0));
|
||||
}
|
||||
|
||||
.dark .dark\:to-cyan-800 {
|
||||
--tw-gradient-to: #155e75;
|
||||
}
|
||||
|
||||
.dark .dark\:to-red-200 {
|
||||
--tw-gradient-to: #fecaca;
|
||||
}
|
||||
|
||||
.dark .dark\:to-green-300 {
|
||||
--tw-gradient-to: #86efac;
|
||||
}
|
||||
|
||||
.dark .dark\:to-green-500 {
|
||||
--tw-gradient-to: #22c55e;
|
||||
}
|
||||
|
||||
.dark .dark\:to-black {
|
||||
--tw-gradient-to: #000;
|
||||
}
|
||||
|
||||
.dark .dark\:to-green-600 {
|
||||
--tw-gradient-to: #16a34a;
|
||||
}
|
||||
|
||||
.dark .dark\:to-green-800 {
|
||||
--tw-gradient-to: #166534;
|
||||
}
|
||||
|
||||
.dark .dark\:fill-white {
|
||||
fill: #fff;
|
||||
}
|
||||
@@ -3114,6 +3230,10 @@ Ensure the default browser behavior of the `hidden` attribute.
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.dark .dark\:font-bold {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.dark .dark\:text-white {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||
@@ -3215,6 +3335,11 @@ Ensure the default browser behavior of the `hidden` attribute.
|
||||
--tw-ring-color: rgb(216 180 254 / var(--tw-ring-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:ring-green-400 {
|
||||
--tw-ring-opacity: 1;
|
||||
--tw-ring-color: rgb(74 222 128 / var(--tw-ring-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:focus-within\:border-blue-300:focus-within {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(147 197 253 / var(--tw-border-opacity));
|
||||
|
||||
42
public/componets/footer/31_footer.html
Normal file
42
public/componets/footer/31_footer.html
Normal file
@@ -0,0 +1,42 @@
|
||||
<!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>footer 1</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<!-- footer 31 start -->
|
||||
|
||||
<section class="section_divider " id="footer_31">
|
||||
<div>Footer 31</div>
|
||||
</section>
|
||||
<footer class="w-full flex h-50 bg-indigo-50 py-10 px-20 justify-between dark:bg-gradient-to-r dark:from-black dark:via-emerald-500 dark:to-green-800">
|
||||
<div class="w-2/3">
|
||||
<h1 class="text-2xl font-bold bg-white dark:bg-indigo-600 dark:text-white dark:ring-2 dark:ring-green-400 inline-block p-4 rounded-md text-gray-700 mb-4">Ready to get started?</h1>
|
||||
<p class="w-2/3 text-gray-600 dark:text-white font-semibold">Lorem ipsum dolor sit amet, consectetur adipiscing elit, br sed do eiusmod tempor incididunt.</p>
|
||||
<button class="block bg-indigo-600 font-bold px-4 py-2 dark:ring-2 dark:ring-green-400 rounded-md text-white tracking-wide mt-4">Get started</button>
|
||||
</div>
|
||||
<div class="w-1/3 flex items-center justify-center dark:text-white dark:font-bold">
|
||||
<di>
|
||||
<p class="hover:text-indigo-600 transition duration-100 cursor-pointer font">Navigation</p>
|
||||
<p class="hover:text-indigo-600 transition duration-100 cursor-pointer font">Email Marketing</p>
|
||||
<p class="hover:text-indigo-600 transition duration-100 cursor-pointer font">Campaigns</p>
|
||||
<p class="hover:text-indigo-600 transition duration-100 cursor-pointer font">Branding</p>
|
||||
<p class="hover:text-indigo-600 transition duration-100 cursor-pointer font">Offline</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
<!-- footer 31 end -->
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -3023,6 +3023,31 @@
|
||||
|
||||
<!-- footer 30 end -->
|
||||
|
||||
<!-- footer 31 start -->
|
||||
|
||||
<section class="section_divider " id="footer_31">
|
||||
<div>Footer 31</div>
|
||||
</section>
|
||||
<footer class="w-full flex h-50 bg-indigo-50 py-10 px-20 justify-between dark:bg-gradient-to-r dark:from-black dark:via-emerald-500 dark:to-green-800">
|
||||
<div class="w-2/3">
|
||||
<h1 class="text-2xl font-bold bg-white dark:bg-indigo-600 dark:text-white dark:ring-2 dark:ring-green-400 inline-block p-4 rounded-md text-gray-700 mb-4">Ready to get started?</h1>
|
||||
<p class="w-2/3 text-gray-600 dark:text-white font-semibold">Lorem ipsum dolor sit amet, consectetur adipiscing elit, br sed do eiusmod tempor incididunt.</p>
|
||||
<button class="block bg-indigo-600 font-bold px-4 py-2 dark:ring-2 dark:ring-green-400 rounded-md text-white tracking-wide mt-4">Get started</button>
|
||||
</div>
|
||||
<div class="w-1/3 flex items-center justify-center dark:text-white dark:font-bold">
|
||||
<di>
|
||||
<p class="hover:text-indigo-600 transition duration-100 cursor-pointer font">Navigation</p>
|
||||
<p class="hover:text-indigo-600 transition duration-100 cursor-pointer font">Email Marketing</p>
|
||||
<p class="hover:text-indigo-600 transition duration-100 cursor-pointer font">Campaigns</p>
|
||||
<p class="hover:text-indigo-600 transition duration-100 cursor-pointer font">Branding</p>
|
||||
<p class="hover:text-indigo-600 transition duration-100 cursor-pointer font">Offline</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
<!-- footer 31 end -->
|
||||
|
||||
<!-- start of script section -->
|
||||
<script type="text/javascript">
|
||||
let toogler = document.getElementById("dark_mood_toogler");
|
||||
|
||||
Reference in New Issue
Block a user