Theme set and detachment from top fixed

nodejs
Aravind142857 1 year ago
parent d1c6aeb6cd
commit 37bed7697b

BIN
public/.DS_Store vendored

Binary file not shown.

@ -2934,6 +2934,21 @@ html {
margin-bottom: 2rem; margin-bottom: 2rem;
} }
.-my-10 {
margin-top: -2.5rem;
margin-bottom: -2.5rem;
}
.my-\[0\%\] {
margin-top: 0%;
margin-bottom: 0%;
}
.my-0 {
margin-top: 0px;
margin-bottom: 0px;
}
.-mr-4 { .-mr-4 {
margin-right: -1rem; margin-right: -1rem;
} }
@ -3002,6 +3017,10 @@ html {
margin-right: 1.5rem; margin-right: 1.5rem;
} }
.mr-8 {
margin-right: 2rem;
}
.mt-10 { .mt-10 {
margin-top: 2.5rem; margin-top: 2.5rem;
} }
@ -3022,6 +3041,14 @@ html {
margin-top: 2rem; margin-top: 2rem;
} }
.mb-16 {
margin-bottom: 4rem;
}
.mr-16 {
margin-right: 4rem;
}
.block { .block {
display: block; display: block;
} }
@ -3099,6 +3126,18 @@ html {
height: 100%; height: 100%;
} }
.h-\[241\] {
height: 241;
}
.h-\[241\.32rem\] {
height: 241.32rem;
}
.h-\[241\.32px\] {
height: 241.32px;
}
.min-h-full { .min-h-full {
min-height: 100%; min-height: 100%;
} }
@ -3164,6 +3203,10 @@ html {
width: 100%; width: 100%;
} }
.w-\[340px\] {
width: 340px;
}
.max-w-md { .max-w-md {
max-width: 28rem; max-width: 28rem;
} }
@ -3172,6 +3215,10 @@ html {
max-width: 24rem; max-width: 24rem;
} }
.max-w-lg {
max-width: 32rem;
}
.flex-1 { .flex-1 {
flex: 1 1 0%; flex: 1 1 0%;
} }
@ -3267,6 +3314,10 @@ html {
align-items: center; align-items: center;
} }
.justify-end {
justify-content: flex-end;
}
.justify-center { .justify-center {
justify-content: center; justify-content: center;
} }
@ -3275,6 +3326,14 @@ html {
justify-content: space-between; justify-content: space-between;
} }
.justify-items-start {
justify-items: start;
}
.justify-items-end {
justify-items: end;
}
.space-x-5 > :not([hidden]) ~ :not([hidden]) { .space-x-5 > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0; --tw-space-x-reverse: 0;
margin-right: calc(1.25rem * var(--tw-space-x-reverse)); margin-right: calc(1.25rem * var(--tw-space-x-reverse));
@ -3298,6 +3357,10 @@ html {
border-color: rgb(209 213 219 / var(--tw-divide-opacity)); border-color: rgb(209 213 219 / var(--tw-divide-opacity));
} }
.self-end {
align-self: flex-end;
}
.self-center { .self-center {
align-self: center; align-self: center;
} }
@ -3427,6 +3490,46 @@ html {
border-color: rgb(255 255 255 / var(--tw-border-opacity)); border-color: rgb(255 255 255 / var(--tw-border-opacity));
} }
.border-\[\#C21EC0\] {
--tw-border-opacity: 1;
border-color: rgb(194 30 192 / var(--tw-border-opacity));
}
.border-\[\#5A1475\] {
--tw-border-opacity: 1;
border-color: rgb(90 20 117 / var(--tw-border-opacity));
}
.border-\[\#DB972C\] {
--tw-border-opacity: 1;
border-color: rgb(219 151 44 / var(--tw-border-opacity));
}
.border-yellow-400 {
--tw-border-opacity: 1;
border-color: rgb(250 204 21 / var(--tw-border-opacity));
}
.border-red-400 {
--tw-border-opacity: 1;
border-color: rgb(248 113 113 / var(--tw-border-opacity));
}
.border-red-600 {
--tw-border-opacity: 1;
border-color: rgb(220 38 38 / var(--tw-border-opacity));
}
.border-yellow-300 {
--tw-border-opacity: 1;
border-color: rgb(253 224 71 / var(--tw-border-opacity));
}
.border-gray-800 {
--tw-border-opacity: 1;
border-color: rgb(31 41 55 / var(--tw-border-opacity));
}
.border-b-green-500 { .border-b-green-500 {
--tw-border-opacity: 1; --tw-border-opacity: 1;
border-bottom-color: rgb(34 197 94 / var(--tw-border-opacity)); border-bottom-color: rgb(34 197 94 / var(--tw-border-opacity));
@ -3467,6 +3570,11 @@ html {
background-color: rgb(243 244 246 / var(--tw-bg-opacity)); background-color: rgb(243 244 246 / var(--tw-bg-opacity));
} }
.bg-gray-300 {
--tw-bg-opacity: 1;
background-color: rgb(209 213 219 / var(--tw-bg-opacity));
}
.bg-gray-50 { .bg-gray-50 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(249 250 251 / var(--tw-bg-opacity)); background-color: rgb(249 250 251 / var(--tw-bg-opacity));
@ -3477,14 +3585,14 @@ html {
background-color: rgb(107 114 128 / var(--tw-bg-opacity)); background-color: rgb(107 114 128 / var(--tw-bg-opacity));
} }
.bg-indigo-600 { .bg-gray-800 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(79 70 229 / var(--tw-bg-opacity)); background-color: rgb(31 41 55 / var(--tw-bg-opacity));
} }
.bg-primary { .bg-indigo-600 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: hsl(var(--p) / var(--tw-bg-opacity)); background-color: rgb(79 70 229 / var(--tw-bg-opacity));
} }
.bg-teal-200 { .bg-teal-200 {
@ -3501,6 +3609,66 @@ html {
background-color: rgb(255 255 255 / var(--tw-bg-opacity)); background-color: rgb(255 255 255 / var(--tw-bg-opacity));
} }
.bg-yellow-500 {
--tw-bg-opacity: 1;
background-color: rgb(234 179 8 / var(--tw-bg-opacity));
}
.bg-emerald-400 {
--tw-bg-opacity: 1;
background-color: rgb(52 211 153 / var(--tw-bg-opacity));
}
.bg-\[\#C21EC0\] {
--tw-bg-opacity: 1;
background-color: rgb(194 30 192 / var(--tw-bg-opacity));
}
.bg-\[\#5A1475\] {
--tw-bg-opacity: 1;
background-color: rgb(90 20 117 / var(--tw-bg-opacity));
}
.bg-\[\#4D0375\] {
--tw-bg-opacity: 1;
background-color: rgb(77 3 117 / var(--tw-bg-opacity));
}
.bg-\[\#761ffe\] {
--tw-bg-opacity: 1;
background-color: rgb(118 31 254 / var(--tw-bg-opacity));
}
.bg-\[\#eab30e\] {
--tw-bg-opacity: 1;
background-color: rgb(234 179 14 / var(--tw-bg-opacity));
}
.bg-\[\#82E8BF\] {
--tw-bg-opacity: 1;
background-color: rgb(130 232 191 / var(--tw-bg-opacity));
}
.bg-\[\#5EDC70\] {
--tw-bg-opacity: 1;
background-color: rgb(94 220 112 / var(--tw-bg-opacity));
}
.bg-gray-600 {
--tw-bg-opacity: 1;
background-color: rgb(75 85 99 / var(--tw-bg-opacity));
}
.bg-yellow-300 {
--tw-bg-opacity: 1;
background-color: rgb(253 224 71 / var(--tw-bg-opacity));
}
.bg-yellow-200 {
--tw-bg-opacity: 1;
background-color: rgb(254 240 138 / var(--tw-bg-opacity));
}
.bg-gradient-to-r { .bg-gradient-to-r {
background-image: linear-gradient(to right, var(--tw-gradient-stops)); background-image: linear-gradient(to right, var(--tw-gradient-stops));
} }
@ -3509,6 +3677,14 @@ html {
background-image: linear-gradient(to top left, var(--tw-gradient-stops)); background-image: linear-gradient(to top left, var(--tw-gradient-stops));
} }
.bg-gradient-to-t {
background-image: linear-gradient(to top, var(--tw-gradient-stops));
}
.bg-gradient-to-l {
background-image: linear-gradient(to left, var(--tw-gradient-stops));
}
.from-cyan-500 { .from-cyan-500 {
--tw-gradient-from: #06b6d4 var(--tw-gradient-from-position); --tw-gradient-from: #06b6d4 var(--tw-gradient-from-position);
--tw-gradient-to: rgb(6 182 212 / 0) var(--tw-gradient-to-position); --tw-gradient-to: rgb(6 182 212 / 0) var(--tw-gradient-to-position);
@ -3521,6 +3697,50 @@ html {
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
} }
.from-green-300 {
--tw-gradient-from: #86efac var(--tw-gradient-from-position);
--tw-gradient-to: rgb(134 239 172 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-amber-300 {
--tw-gradient-from: #fcd34d var(--tw-gradient-from-position);
--tw-gradient-to: rgb(252 211 77 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-rose-600 {
--tw-gradient-from: #e11d48 var(--tw-gradient-from-position);
--tw-gradient-to: rgb(225 29 72 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-rose-400 {
--tw-gradient-from: #fb7185 var(--tw-gradient-from-position);
--tw-gradient-to: rgb(251 113 133 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.via-blue-500 {
--tw-gradient-to: rgb(59 130 246 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), #3b82f6 var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-orange-300 {
--tw-gradient-to: rgb(253 186 116 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), #fdba74 var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-violet-600 {
--tw-gradient-to: rgb(124 58 237 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), #7c3aed var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-blue-400 {
--tw-gradient-to: rgb(96 165 250 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), #60a5fa var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.to-blue-500 { .to-blue-500 {
--tw-gradient-to: #3b82f6 var(--tw-gradient-to-position); --tw-gradient-to: #3b82f6 var(--tw-gradient-to-position);
} }
@ -3533,6 +3753,34 @@ html {
--tw-gradient-to: #ec4899 var(--tw-gradient-to-position); --tw-gradient-to: #ec4899 var(--tw-gradient-to-position);
} }
.to-purple-600 {
--tw-gradient-to: #9333ea var(--tw-gradient-to-position);
}
.to-rose-300 {
--tw-gradient-to: #fda4af var(--tw-gradient-to-position);
}
.to-indigo-500 {
--tw-gradient-to: #6366f1 var(--tw-gradient-to-position);
}
.to-green-400 {
--tw-gradient-to: #4ade80 var(--tw-gradient-to-position);
}
.to-lime-500 {
--tw-gradient-to: #84cc16 var(--tw-gradient-to-position);
}
.to-green-500 {
--tw-gradient-to: #22c55e var(--tw-gradient-to-position);
}
.to-emerald-400 {
--tw-gradient-to: #34d399 var(--tw-gradient-to-position);
}
.bg-clip-padding { .bg-clip-padding {
background-clip: padding-box; background-clip: padding-box;
} }
@ -3545,14 +3793,26 @@ html {
fill: #34d399; fill: #34d399;
} }
.stroke-current { .fill-black {
stroke: currentColor; fill: #000;
}
.fill-white {
fill: #fff;
}
.fill-yellow-500 {
fill: #eab308;
} }
.stroke-black { .stroke-black {
stroke: #000; stroke: #000;
} }
.stroke-current {
stroke: currentColor;
}
.object-none { .object-none {
-o-object-fit: none; -o-object-fit: none;
object-fit: none; object-fit: none;
@ -3649,6 +3909,41 @@ html {
padding-bottom: 0.4375rem; padding-bottom: 0.4375rem;
} }
.px-\[10\%\] {
padding-left: 10%;
padding-right: 10%;
}
.py-\[0\%\] {
padding-top: 0%;
padding-bottom: 0%;
}
.py-0 {
padding-top: 0px;
padding-bottom: 0px;
}
.py-4 {
padding-top: 1rem;
padding-bottom: 1rem;
}
.py-8 {
padding-top: 2rem;
padding-bottom: 2rem;
}
.py-\[10\%\] {
padding-top: 10%;
padding-bottom: 10%;
}
.py-\[5\%\] {
padding-top: 5%;
padding-bottom: 5%;
}
.pl-10 { .pl-10 {
padding-left: 2.5rem; padding-left: 2.5rem;
} }
@ -3661,10 +3956,18 @@ html {
padding-left: 1.5rem; padding-left: 1.5rem;
} }
.pl-8 {
padding-left: 2rem;
}
.pt-0 { .pt-0 {
padding-top: 0px; padding-top: 0px;
} }
.pr-16 {
padding-right: 4rem;
}
.text-left { .text-left {
text-align: left; text-align: left;
} }
@ -3673,6 +3976,10 @@ html {
text-align: center; text-align: center;
} }
.text-right {
text-align: right;
}
.align-middle { .align-middle {
vertical-align: middle; vertical-align: middle;
} }
@ -3689,6 +3996,10 @@ html {
font-family: Rubik, sans-serif; font-family: Rubik, sans-serif;
} }
.font-serif {
font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
}
.text-2xl { .text-2xl {
font-size: 1.5rem; font-size: 1.5rem;
line-height: 2rem; line-height: 2rem;
@ -3773,6 +4084,10 @@ html {
line-height: 1; line-height: 1;
} }
.leading-tight {
line-height: 1.25;
}
.tracking-tight { .tracking-tight {
letter-spacing: -0.025em; letter-spacing: -0.025em;
} }
@ -3781,9 +4096,9 @@ html {
letter-spacing: 0.05em; letter-spacing: 0.05em;
} }
.text-amber-950 { .text-\[\#C26EB7\] {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(69 26 3 / var(--tw-text-opacity)); color: rgb(194 110 183 / var(--tw-text-opacity));
} }
.text-black { .text-black {
@ -3846,6 +4161,59 @@ html {
color: rgb(255 255 255 / var(--tw-text-opacity)); color: rgb(255 255 255 / var(--tw-text-opacity));
} }
.text-\[\] {
color: ;
}
.text-\[\#C21EC0\] {
--tw-text-opacity: 1;
color: rgb(194 30 192 / var(--tw-text-opacity));
}
.text-\[\#DB972C\] {
--tw-text-opacity: 1;
color: rgb(219 151 44 / var(--tw-text-opacity));
}
.text-\[\#ff30ff\] {
--tw-text-opacity: 1;
color: rgb(255 48 255 / var(--tw-text-opacity));
}
.text-primary {
--tw-text-opacity: 1;
color: hsl(var(--p) / var(--tw-text-opacity));
}
.text-emerald-300 {
--tw-text-opacity: 1;
color: rgb(110 231 183 / var(--tw-text-opacity));
}
.text-yellow-600 {
--tw-text-opacity: 1;
color: rgb(202 138 4 / var(--tw-text-opacity));
}
.text-yellow-400 {
--tw-text-opacity: 1;
color: rgb(250 204 21 / var(--tw-text-opacity));
}
.text-red-600 {
--tw-text-opacity: 1;
color: rgb(220 38 38 / var(--tw-text-opacity));
}
.text-yellow-300 {
--tw-text-opacity: 1;
color: rgb(253 224 71 / var(--tw-text-opacity));
}
.underline {
text-decoration-line: underline;
}
.opacity-0 { .opacity-0 {
opacity: 0; opacity: 0;
} }
@ -3888,6 +4256,11 @@ html {
--tw-shadow: var(--tw-shadow-colored); --tw-shadow: var(--tw-shadow-colored);
} }
.shadow-gray-800 {
--tw-shadow-color: #1f2937;
--tw-shadow: var(--tw-shadow-colored);
}
.shadow-primary { .shadow-primary {
--tw-shadow-color: hsl(var(--p) / 1); --tw-shadow-color: hsl(var(--p) / 1);
--tw-shadow: var(--tw-shadow-colored); --tw-shadow: var(--tw-shadow-colored);
@ -3926,16 +4299,15 @@ html {
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
} }
.ring-0 {
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-inset { .ring-inset {
--tw-ring-inset: inset; --tw-ring-inset: inset;
} }
.ring-\[\#C2B100\] {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(194 177 0 / var(--tw-ring-opacity));
}
.ring-blue-500\/50 { .ring-blue-500\/50 {
--tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-color: rgb(59 130 246 / 0.5);
} }
@ -4064,6 +4436,55 @@ input.valid {
color: red; color: red;
} }
@media (hover: hover) {
:is(.dark .dark\:btn-success):hover {
--tw-border-opacity: 1;
border-color: hsl(var(--su) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--su) / var(--tw-bg-opacity));
}
:is(.dark .dark\:btn-success).btn-outline:hover {
--tw-border-opacity: 1;
border-color: hsl(var(--su) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--su) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--suc) / var(--tw-text-opacity));
}
}
:is(.dark .dark\:btn-success) {
--tw-border-opacity: 1;
border-color: hsl(var(--su) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--su) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--suc) / var(--tw-text-opacity));
outline-color: hsl(var(--su) / 1);
}
:is(.dark .dark\:btn-success).btn-active {
--tw-border-opacity: 1;
border-color: hsl(var(--su) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--su) / var(--tw-bg-opacity));
}
:is(.dark .dark\:btn-success).btn-outline {
--tw-text-opacity: 1;
color: hsl(var(--su) / var(--tw-text-opacity));
}
:is(.dark .dark\:btn-success).btn-outline.btn-active {
--tw-border-opacity: 1;
border-color: hsl(var(--su) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--su) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--suc) / var(--tw-text-opacity));
}
.placeholder\:text-gray-400::-moz-placeholder { .placeholder\:text-gray-400::-moz-placeholder {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(156 163 175 / var(--tw-text-opacity)); color: rgb(156 163 175 / var(--tw-text-opacity));
@ -4235,6 +4656,16 @@ input.valid {
border-color: rgb(255 255 255 / var(--tw-border-opacity)); border-color: rgb(255 255 255 / var(--tw-border-opacity));
} }
.hover\:border-black:hover {
--tw-border-opacity: 1;
border-color: rgb(0 0 0 / var(--tw-border-opacity));
}
.hover\:border-\[\#C21EC0\]:hover {
--tw-border-opacity: 1;
border-color: rgb(194 30 192 / var(--tw-border-opacity));
}
.hover\:border-b-green-300:hover { .hover\:border-b-green-300:hover {
--tw-border-opacity: 1; --tw-border-opacity: 1;
border-bottom-color: rgb(134 239 172 / var(--tw-border-opacity)); border-bottom-color: rgb(134 239 172 / var(--tw-border-opacity));
@ -4269,6 +4700,26 @@ input.valid {
background-color: rgb(255 255 255 / var(--tw-bg-opacity)); background-color: rgb(255 255 255 / var(--tw-bg-opacity));
} }
.hover\:bg-black:hover {
--tw-bg-opacity: 1;
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}
.hover\:bg-\[\#C21EC0\]:hover {
--tw-bg-opacity: 1;
background-color: rgb(194 30 192 / var(--tw-bg-opacity));
}
.hover\:bg-\[\#DB972C\]:hover {
--tw-bg-opacity: 1;
background-color: rgb(219 151 44 / var(--tw-bg-opacity));
}
.hover\:bg-yellow-400:hover {
--tw-bg-opacity: 1;
background-color: rgb(250 204 21 / var(--tw-bg-opacity));
}
.hover\:from-cyan-400:hover { .hover\:from-cyan-400:hover {
--tw-gradient-from: #22d3ee var(--tw-gradient-from-position); --tw-gradient-from: #22d3ee var(--tw-gradient-from-position);
--tw-gradient-to: rgb(34 211 238 / 0) var(--tw-gradient-to-position); --tw-gradient-to: rgb(34 211 238 / 0) var(--tw-gradient-to-position);
@ -4310,13 +4761,13 @@ input.valid {
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
} }
.hover\:shadow-black\/50:hover { .hover\:shadow-\[\#C2B100\]\/50:hover {
--tw-shadow-color: rgb(0 0 0 / 0.5); --tw-shadow-color: rgb(194 177 0 / 0.5);
--tw-shadow: var(--tw-shadow-colored); --tw-shadow: var(--tw-shadow-colored);
} }
.hover\:shadow-emerald-400\/50:hover { .hover\:shadow-black\/50:hover {
--tw-shadow-color: rgb(52 211 153 / 0.5); --tw-shadow-color: rgb(0 0 0 / 0.5);
--tw-shadow: var(--tw-shadow-colored); --tw-shadow: var(--tw-shadow-colored);
} }
@ -4331,6 +4782,11 @@ input.valid {
--tw-ring-color: rgb(52 211 153 / var(--tw-ring-opacity)); --tw-ring-color: rgb(52 211 153 / var(--tw-ring-opacity));
} }
.hover\:ring-gray-800:hover {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(31 41 55 / var(--tw-ring-opacity));
}
.hover\:before\:bg-red-400:hover::before { .hover\:before\:bg-red-400:hover::before {
content: var(--tw-content); content: var(--tw-content);
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
@ -4343,10 +4799,6 @@ input.valid {
background-color: rgb(248 113 113 / var(--tw-bg-opacity)); background-color: rgb(248 113 113 / var(--tw-bg-opacity));
} }
.focus\:border-none:focus {
border-style: none;
}
.focus\:border-blue-500:focus { .focus\:border-blue-500:focus {
--tw-border-opacity: 1; --tw-border-opacity: 1;
border-color: rgb(59 130 246 / var(--tw-border-opacity)); border-color: rgb(59 130 246 / var(--tw-border-opacity));
@ -4380,12 +4832,6 @@ input.valid {
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
} }
.focus\:ring-0:focus {
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus\:ring-inset:focus { .focus\:ring-inset:focus {
--tw-ring-inset: inset; --tw-ring-inset: inset;
} }
@ -4419,6 +4865,11 @@ input.valid {
--tw-ring-color: rgb(248 113 113 / var(--tw-ring-opacity)); --tw-ring-color: rgb(248 113 113 / var(--tw-ring-opacity));
} }
.focus\:ring-gray-800:focus {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(31 41 55 / var(--tw-ring-opacity));
}
.focus-visible\:outline:focus-visible { .focus-visible\:outline:focus-visible {
outline-style: solid; outline-style: solid;
} }
@ -4467,45 +4918,130 @@ input.valid {
visibility: visible; visibility: visible;
} }
@media (prefers-color-scheme: dark) { :is(.dark .dark\:border-4) {
.dark\:border-gray-500 { border-width: 4px;
}
:is(.dark .dark\:border-black) {
--tw-border-opacity: 1;
border-color: rgb(0 0 0 / var(--tw-border-opacity));
}
:is(.dark .dark\:border-gray-500) {
--tw-border-opacity: 1; --tw-border-opacity: 1;
border-color: rgb(107 114 128 / var(--tw-border-opacity)); border-color: rgb(107 114 128 / var(--tw-border-opacity));
} }
.dark\:bg-gray-500 { :is(.dark .dark\:border-emerald-500) {
--tw-border-opacity: 1;
border-color: rgb(16 185 129 / var(--tw-border-opacity));
}
:is(.dark .dark\:bg-\[\#BF991D\]) {
--tw-bg-opacity: 1;
background-color: rgb(191 153 29 / var(--tw-bg-opacity));
}
:is(.dark .dark\:bg-black) {
--tw-bg-opacity: 1;
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}
:is(.dark .dark\:bg-gray-500) {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(107 114 128 / var(--tw-bg-opacity)); background-color: rgb(107 114 128 / var(--tw-bg-opacity));
} }
.dark\:bg-gray-600 { :is(.dark .dark\:bg-gray-600) {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(75 85 99 / var(--tw-bg-opacity)); background-color: rgb(75 85 99 / var(--tw-bg-opacity));
} }
.dark\:text-gray-100 { :is(.dark .dark\:bg-gray-800) {
--tw-bg-opacity: 1;
background-color: rgb(31 41 55 / var(--tw-bg-opacity));
}
:is(.dark .dark\:bg-transparent) {
background-color: transparent;
}
:is(.dark .dark\:from-gray-800) {
--tw-gradient-from: #1f2937 var(--tw-gradient-from-position);
--tw-gradient-to: rgb(31 41 55 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
:is(.dark .dark\:to-gray-800) {
--tw-gradient-to: #1f2937 var(--tw-gradient-to-position);
}
:is(.dark .dark\:text-\[\#BF991D\]) {
--tw-text-opacity: 1;
color: rgb(191 153 29 / var(--tw-text-opacity));
}
:is(.dark .dark\:text-gray-100) {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(243 244 246 / var(--tw-text-opacity)); color: rgb(243 244 246 / var(--tw-text-opacity));
} }
.dark\:text-gray-400 { :is(.dark .dark\:text-gray-400) {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(156 163 175 / var(--tw-text-opacity)); color: rgb(156 163 175 / var(--tw-text-opacity));
} }
.dark\:text-white { :is(.dark .dark\:text-white) {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity)); color: rgb(255 255 255 / var(--tw-text-opacity));
} }
.dark\:hover\:bg-gray-200\/80:hover { :is(.dark .dark\:text-gray-300) {
--tw-text-opacity: 1;
color: rgb(209 213 219 / var(--tw-text-opacity));
}
:is(.dark .dark\:text-success) {
--tw-text-opacity: 1;
color: hsl(var(--su) / var(--tw-text-opacity));
}
:is(.dark .dark\:hover\:border-none:hover) {
border-style: none;
}
:is(.dark .dark\:hover\:border-black:hover) {
--tw-border-opacity: 1;
border-color: rgb(0 0 0 / var(--tw-border-opacity));
}
:is(.dark .dark\:hover\:bg-\[\#C2B100\]:hover) {
--tw-bg-opacity: 1;
background-color: rgb(194 177 0 / var(--tw-bg-opacity));
}
:is(.dark .dark\:hover\:bg-gray-200\/80:hover) {
background-color: rgb(229 231 235 / 0.8); background-color: rgb(229 231 235 / 0.8);
} }
.dark\:hover\:text-slate-700:hover { :is(.dark .dark\:hover\:text-slate-700:hover) {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(51 65 85 / var(--tw-text-opacity)); color: rgb(51 65 85 / var(--tw-text-opacity));
} }
:is(.dark .dark\:hover\:shadow-\[\#C2B100\]\/50:hover) {
--tw-shadow-color: rgb(194 177 0 / 0.5);
--tw-shadow: var(--tw-shadow-colored);
}
:is(.dark .dark\:hover\:ring-emerald-400:hover) {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(52 211 153 / var(--tw-ring-opacity));
}
:is(.dark .dark\:focus\:ring-emerald-400:focus) {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(52 211 153 / var(--tw-ring-opacity));
} }
@media (min-width: 640px) { @media (min-width: 640px) {

@ -1,12 +1,12 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" class="bg-black"> <html id="html-tag" lang="en" class="py-[0%] my-[0%]">
<head> <head class="py-0 my-0 h-0">
<meta charset="UTF-8"> <meta charset="UTF-8" />
<title>Home</title> <title>Home</title>
<link rel="stylesheet" href="css/output.css"> <link rel="stylesheet" href="css/output.css">
</head> </head>
<body class="mx-[10%]"> <body class="w-full my-[0%] py-[0%] px-[10%] h-full bg-gray-300 dark:bg-black">
<main class="m-10 h-auto w-auto "> <main class="h-auto w-auto py-[5%]">
<!-- previous navbar start--> <!-- previous navbar start-->
<div class="hidden"> <div class="hidden">
<!-- <nav class="flex items-center opacity-100 lg:justify-between sm:justify-center flex-wrap bg-gray-500 dark:bg-gray-500 p-6 shadow-lg shadow-black/50 sticky top-4 opacity-100 mb-24"> &lt;!&ndash;dark:bg-black&ndash;&gt;--> <!-- <nav class="flex items-center opacity-100 lg:justify-between sm:justify-center flex-wrap bg-gray-500 dark:bg-gray-500 p-6 shadow-lg shadow-black/50 sticky top-4 opacity-100 mb-24"> &lt;!&ndash;dark:bg-black&ndash;&gt;-->
@ -134,7 +134,7 @@
</div> </div>
<!-- previous navbar end--> <!-- previous navbar end-->
<!-- New navbar start--> <!-- New navbar start-->
<div class="navbar bg-base-100 rounded-lg shadow-xl shadow-black/50 z-[4] sticky top-0 mb-10"> <div class="navbar dark:from-gray-800 dark:to-gray-800 rounded-lg bg-gradient-to-r from-rose-400 via-blue-400 to-emerald-400 shadow-xl shadow-black/50 z-[4] sticky top-0 mb-10">
<div class="flex-1 lg:ml-4 ml-2 my-2"> <div class="flex-1 lg:ml-4 ml-2 my-2">
<!--Hamburger menu--> <!--Hamburger menu-->
<div class="lg:hidden" > <div class="lg:hidden" >
@ -159,19 +159,58 @@
<a class="btn btn-ghost normal-case text-xl text-emerald-400 brightness-125"><img src="images/GLink-Logo-alt.svg" class="h-full "></a> <a class="btn btn-ghost normal-case text-xl text-emerald-400 brightness-125"><img src="images/GLink-Logo-alt.svg" class="h-full "></a>
</div> </div>
<div class="w-full justify-center items-center lg:flex hidden"> <div class="w-full justify-center items-center lg:flex hidden">
<a class="btn btn-outline btn-success brightness-125 lg:text-xl text-sm" href="/">Create</a> <a class="btn btn-outline dark:btn-success dark:bg-transparent border-yellow-300 text-yellow-300 hover:bg-yellow-400 hover:border-none hover:text-black brightness-125 lg:text-xl text-sm" href="/">Create</a>
</div> </div>
</div> </div>
<div class="justify-center items-center lg:flex mr-10 my-2 hidden"> <div class="justify-center items-center lg:flex mr-10 my-2 hidden">
<a class="btn btn-outline btn-success brightness-125 lg:text-xl text-sm" href="signup.html">Signup</a> <a class="btn btn-outline dark:btn-success dark:text-success dark:bg-transparent border-yellow-300 text-yellow-300 hover:bg-yellow-400 hover:border-none hover:text-black brightness-125 lg:text-xl text-sm mr-8" href="signup.html">Sign up</a>
<label class="swap swap-rotate">
<!-- this hidden checkbox controls the state -->
<input type="checkbox" id="theme-switcher" class="h-full w-full hidden" onclick="changeMode()"/>
<!-- sun icon -->
<svg id="sun" class="swap-on fill-yellow-500 w-10 h-10" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41Z" fill="yellow"/>
<path d="M12,6.5A5.5,5.5,0,1,0,17.5,12A5.51,5.51,0,0,0,12,6.5Z" fill="yellow" /></svg>
<!-- moon icon -->
<svg id="moon" class="swap-off fill-white w-10 h-10" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z" fill="white"/></svg>
</label>
<script>
// window.onload = function(){
// if (document.getElementById("html-tag").contains("dark")) {
// console.log("dark");
// document.getElementById("sun").classList.add("swap-active");
// } else {
// console.log("light");
// document.getElementById("moon").classList.add("swap-active");
// }
// }
function changeMode() {
let html_tag = document.getElementById("html-tag")
let box = document.getElementById("theme-switcher");
if (box.checked) {
if (!html_tag.classList.contains("dark")) {
html_tag.classList.add("dark");
}
}
if (!box.checked) {
if (html_tag.classList.contains("dark")) {
html_tag.classList.remove("dark");
}
}
}
</script>
</div> </div>
<div class="flex-none my-2"> <div class="flex-none my-2">
<div class="dropdown dropdown-end"> <div class="dropdown dropdown-end">
<label tabindex="0" class="btn btn-ghost btn-circle avatar border border-2 border-emerald-500 brightness-125 hover:border-none hover:ring-2 hover:ring-emerald-400 focus:ring-2 focus:ring-emerald-400"> <label tabindex="0" class="btn btn-ghost btn-circle avatar border border-2 border-gray-800 dark:border-emerald-500 brightness-125 hover:border-none hover:ring-2 hover:ring-gray-800 dark:hover:ring-emerald-400 focus:ring-2 focus:ring-gray-800 dark:focus:ring-emerald-400">
<div class="w-10 rounded-full cursor-pointer "> <div class="w-10 rounded-full cursor-pointer ">
<div class="w-full h-full bg-white rounded-full text-center"></div> <div class="w-full h-full bg-yellow-200 rounded-full flex justify-center items-center"><h1 class="self-center text-xl font-bold font-serif">B</h1></div>
</div> </div>
</label> </label>
<ul tabindex="0" class="menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-base-100 rounded-box w-36"> <ul tabindex="0" class="menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-base-100 rounded-box w-36">
@ -253,14 +292,14 @@
</div> </div>
<!-- Old hero end --> <!-- Old hero end -->
<!-- New hero start --> <!-- New hero start -->
<div class="hero py-16 h-auto bg-primary rounded-lg my-8 shadow-lg shadow-primary"> <div class="hero py-16 h-auto bg-[#5EDC70] dark:bg-gray-800 dark:brightness-60 brightness-125 rounded-lg my-8 shadow-lg shadow-gray-800">
<div class="hero-content flex-col-reverse lg:flex-row-reverse"> <div class="hero-content flex-col-reverse lg:flex-row-reverse">
<div class="relative items-center w-auto h-auto sm:w-full flex-grow-0 mt-8 lg:mt-0 justify-center mx-auto"> <div class="relative items-center w-auto h-auto sm:w-full flex-grow-0 mt-8 lg:mt-0 justify-center mx-auto">
<!-- <div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">--> <!-- <div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">-->
<!-- <svg class="w-5 h-5 text-gray-500 dark:text-gray-400" 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="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>--> <!-- <svg class="w-5 h-5 text-gray-500 dark:text-gray-400" 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="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>-->
<!-- </div>--> <!-- </div>-->
<div class="absolute inset-y-0 left-0 flex items-center w-full lg:pl-10 pointer-events-none"> <div class="absolute inset-y-0 left-0 flex items-center w-full lg:pl-10 pointer-events-none">
<div type="search" id="default-search" class="block w-full p-2 pl-6 text-sm text-gray-900 ring-4 border-none ring-emerald-400 shadow-lg shadow-emerald-400/50 rounded-lg bg-gray-50"> <div type="search" id="default-search" class="block w-full p-2 pl-6 text-sm text-gray-900 ring-4 border-none ring-[#C2B100] shadow-lg shadow-emerald-400/50 rounded-lg bg-gray-50">
<div class="typewriter bg-transparent w-fit h-auto justify-center items-center mx-auto"> <div class="typewriter bg-transparent w-fit h-auto justify-center items-center mx-auto">
<h1 class="text-2xl text-center overflow-x-hidden border-r border-r-2 border-r-orange-600 whitespace-nowrap m-auto tracking-wider "></h1> <h1 class="text-2xl text-center overflow-x-hidden border-r border-r-2 border-r-orange-600 whitespace-nowrap m-auto tracking-wider "></h1>
</div> </div>
@ -309,31 +348,33 @@
</style> </style>
<div> <div>
<h1 class="text-5xl font-bold text-emerald-400">Create and share geo-restricted links</h1> <h1 class="text-5xl font-bold text-[#C21EC0] dark:text-[#BF991D] brightness-125 font-serif tracking-wider leading-tight pl-8">Create and share geo-restricted links</h1>
<p class="py-6 text-gray-300">GLinkZip enables you to generate and distribute geo-restricted URLs for private, secure access.</p> <p class="py-6 text-black dark:text-gray-300 pl-8 text-lg">GLinkZip enables you to generate and distribute geo-restricted URLs for private, secure access.</p>
<div class="flex justify-center items-center"> <div class="flex justify-center items-center">
<button class="btn btn-success text-xl hover:shadow-lg hover:shadow-emerald-400/50">Get Started</button> <button class="btn btn-success text-black bg-[#C21EC0] border-[#5A1475] border-4 hover:bg-[#C21EC0] hover:border-[#C21EC0] hover:border-none hover:shadow-black/50 dark:bg-[#BF991D] dark:border-black dark:border-4 dark:hover:bg-[#C2B100] dark:hover:border-black dark:hover:border-none text-xl hover:shadow-lg dark:hover:shadow-[#C2B100]/50">Get Started</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- New hero end --> <!-- New hero end -->
<div class="flex lg:flex-col flex-col w-full mb-24 bg-primary rounded-lg shadow-lg shadow-primary"> <!-- 3 column start -->
<div class="flex lg:flex-col flex-col w-full mb-24 bg-[#761ffe] brightness-125 dark:brightness-60 dark:bg-gray-800 rounded-lg shadow-lg shadow-gray-800">
<div class="w-full my-12 justify-center items-center flex"> <div class="w-full my-12 justify-center items-center flex">
<p class="text-4xl md:text-5xl lg:text-6xl text-emerald-400 font-bold brightness-125"> <p class="text-4xl md:text-5xl lg:text-6xl text-emerald-400 font-bold font-serif brightness-125">
How it works How it works
</p> </p>
</div> </div>
<div class="flex lg:flex-row flex-col items-start h-auto w-auto mx-5 mb-5"> <div class="flex lg:flex-row flex-col items-start h-auto w-auto mx-5 mb-5">
<div class="flex flex-col items-center h-full lg:w-1/3 w-full pt-0"> <div class="flex flex-col items-center h-full lg:w-1/3 w-full pt-0">
<img src="images/step1.png" alt="pic2" class="bg-black flex-grow m-5 w-full rounded"> <img src="images/step1.png" alt="pic2" class="h-[241.32px] w-[340px] bg-black flex-grow m-5 w-full rounded">
<h1 class="text-5xl text-success"> <h1 class="text-5xl text-success">
Step 1 Step 1
</h1> </h1>
<p class="py-6 text-gray-300">Create the GLink. You can either create a regular shortened URL, or a geo-restricted one, in which case you can restrict it to a specific radius around your current location.</p> <p class="py-6 text-gray-300">Create the GLink. You can either create a regular shortened URL, or a geo-restricted one, in which case you can restrict it to a specific radius around your current location.</p>
</div> </div>
<div class="flex flex-col items-center h-full lg:w-1/3 w-full pt-0"> <div class="flex flex-col items-center h-full lg:w-1/3 w-full pt-0">
<img src="" alt="pic2" class="bg-black flex-grow m-5 w-full rounded"> <img src="images/step2.png" alt="pic2" class="h-[241.32px] w-[340px] bg-black flex-grow m-5 w-full rounded">
<h1 class="text-5xl text-success"> <h1 class="text-5xl text-success">
Step 2 Step 2
</h1> </h1>
@ -342,7 +383,7 @@
</p> </p>
</div> </div>
<div class="flex flex-col items-center h-full lg:w-1/3 w-full pt-0 flex-grow flex-shrink-0"> <div class="flex flex-col items-center h-full lg:w-1/3 w-full pt-0 flex-grow flex-shrink-0">
<img src="" alt="pic2" class="bg-black flex-grow m-5 w-full rounded"> <img src="images/step3.png" alt="pic2" class="h-[241.32px] w-[340px] bg-black flex-grow m-5 w-full rounded">
<h1 class="text-5xl text-success "> <h1 class="text-5xl text-success ">
Step 3 Step 3
</h1> </h1>
@ -352,16 +393,21 @@
</div> </div>
</div> </div>
</div> </div>
<div class="w-full border-8 border-black flex flex-col items-center justify-center"> <!-- 3 column end -->
<div class="border-4 border-black w-auto h-auto mt-8 text-4xl md:text-5xl lg:text-6xl flex flex-wrap"> <!-- why start -->
<div class="w-full flex bg-[#eab30e] flex-col items-center justify-center rounded-lg shadow-lg shadow-gray-800">
<div class=" h-auto mt-8 text-4xl md:text-5xl lg:text-6xl flex flex-wrap w-full justify-end pr-16">
<h1 class="font-serif font-bold underline">
Why GLink? Why GLink?
</h1>
</div> </div>
<div class="border-4 border-black h-auto mt-4 lg:mx-8 max-w-md sm:flex-grow-0 mb-4 "> <div class="py-8 max-w-lg sm:flex-grow-0 flex pr-16 flex-wrap self-end justify-end ">
<p class="text-lg md:text-xl lg:text-2xl"> <p class="text-lg md:text-xl lg:text-2xl text-right">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A ab delectus dolor, dolorem dolorum et facilis, illum ipsam, natus nobis nulla quam repellat saepe! Aperiam doloremque harum laudantium repellendus tempora! Lorem ipsum dolor sit amet, consectetur adipisicing elit. A ab delectus dolor, dolorem dolorum et facilis, illum ipsam, natus nobis nulla quam repellat saepe! Aperiam doloremque harum laudantium repellendus tempora!
</p> </p>
</div> </div>
</div> </div>
<!-- Why end -->
</main> </main>

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en" class="bg-black">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>My Links</title> <title>My Links</title>
@ -8,7 +8,7 @@
<body class="mx-[10%]"> <body class="mx-[10%]">
<main class="m-10 h-auto w-auto "> <main class="m-10 h-auto w-auto ">
<!-- Navbar start --> <!-- Navbar start -->
<div class="navbar bg-base-100 rounded-lg shadow-xl shadow-black/50 z-[4] sticky top-0 mb-10"> <div class="navbar bg-gray-800 rounded-lg shadow-xl shadow-black/50 z-[4] sticky top-0 mb-10">
<div class="flex-1 lg:ml-4 ml-2 my-2"> <div class="flex-1 lg:ml-4 ml-2 my-2">
<!--Hamburger menu--> <!--Hamburger menu-->
<div class="lg:hidden" > <div class="lg:hidden" >

@ -23,5 +23,7 @@ module.exports = {
require('@tailwindcss/forms'), require('@tailwindcss/forms'),
require("daisyui"), require("daisyui"),
], ],
darkMode: 'class'
} }

Loading…
Cancel
Save