diff --git a/assets/css/style.min.css b/assets/css/style.min.css index fe08806..3805c17 100644 --- a/assets/css/style.min.css +++ b/assets/css/style.min.css @@ -574,6 +574,10 @@ video { bottom: 0.5rem; } +.left-1 { + left: 0.25rem; +} + .right-2 { right: 0.5rem; } @@ -582,10 +586,26 @@ video { right: 1rem; } +.top-1 { + top: 0.25rem; +} + .top-1\/2 { top: 50%; } +.bottom-1 { + bottom: 0.25rem; +} + +.right-1 { + right: 0.25rem; +} + +.top-2 { + top: 0.5rem; +} + .z-50 { z-index: 50; } @@ -644,6 +664,10 @@ video { margin-top: 1.25rem; } +.block { + display: block; +} + .flex { display: flex; } @@ -668,6 +692,10 @@ video { height: 1.5rem; } +.h-5 { + height: 1.25rem; +} + .w-10 { width: 2.5rem; } @@ -689,8 +717,16 @@ video { width: 100%; } -.max-w-3xl { - max-width: 48rem; +.w-5 { + width: 1.25rem; +} + +.max-w-5xl { + max-width: 64rem; +} + +.max-w-lg { + max-width: 32rem; } .max-w-md { @@ -705,12 +741,12 @@ video { max-width: 36rem; } -.max-w-5xl { - max-width: 64rem; +.max-w-4xl { + max-width: 56rem; } -.max-w-lg { - max-width: 32rem; +.max-w-3xl { + max-width: 48rem; } .-translate-x-1\/2 { @@ -727,8 +763,8 @@ video { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } -.flex-col { - flex-direction: column; +.grid-cols-2 { + grid-template-columns: repeat(2, minmax(0, 1fr)); } .flex-wrap { @@ -784,6 +820,15 @@ video { border-color: rgb(232 232 232 / var(--tw-border-opacity)); } +.border-black { + --tw-border-opacity: 1; + border-color: rgb(0 0 0 / var(--tw-border-opacity)); +} + +.border-black\/10 { + border-color: rgb(0 0 0 / 0.1); +} + .bg-\[\#0d99ff\] { --tw-bg-opacity: 1; background-color: rgb(13 153 255 / var(--tw-bg-opacity)); @@ -803,11 +848,25 @@ video { background-color: rgb(0 0 0 / 0.05); } +.bg-red-500 { + --tw-bg-opacity: 1; + background-color: rgb(239 68 68 / var(--tw-bg-opacity)); +} + .bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } +.bg-black\/10 { + background-color: rgb(0 0 0 / 0.1); +} + +.bg-\[\#fafafa\] { + --tw-bg-opacity: 1; + background-color: rgb(250 250 250 / var(--tw-bg-opacity)); +} + .p-1 { padding: 0.25rem; } @@ -824,6 +883,10 @@ video { padding: 1.25rem; } +.p-4 { + padding: 1rem; +} + .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; @@ -839,10 +902,6 @@ video { padding-bottom: 1rem; } -.pb-5 { - padding-bottom: 1.25rem; -} - .pl-1 { padding-left: 0.25rem; } @@ -859,6 +918,10 @@ video { padding-right: 1.25rem; } +.text-left { + text-align: left; +} + .text-center { text-align: center; } @@ -891,6 +954,10 @@ video { font-weight: 600; } +.font-light { + font-weight: 300; +} + .text-\[\#000000\] { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); @@ -915,6 +982,16 @@ video { color: rgb(255 255 255 / var(--tw-text-opacity)); } +.text-\[\#cee1ee\] { + --tw-text-opacity: 1; + color: rgb(206 225 238 / var(--tw-text-opacity)); +} + +.text-\[\#0004ff\] { + --tw-text-opacity: 1; + color: rgb(0 4 255 / var(--tw-text-opacity)); +} + .opacity-0 { opacity: 0; } @@ -1317,4 +1394,10 @@ textarea:focus { .sm\:block { display: block; } +} + +@media (min-width: 768px) { + .md\:grid-cols-2 { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } } \ No newline at end of file diff --git a/index.html b/index.html index 26cff20..5c74eae 100644 --- a/index.html +++ b/index.html @@ -58,94 +58,100 @@
- Avatars is a collection of diverse free avatar images from across the - web, designed to add personality to your projects. With a vast - selection of vibrant illustrations, you can enhance your projects in - seconds. -
+ Avatars + ++ Avatars is a collection of diverse free avatar images from across + the web, designed to add personality to your projects. With a vast + selection of vibrant illustrations, you can enhance your projects in + seconds. +
- -+ You can also get the code on + + CopyUI.com +
+ Made with ❤️ by + Alohe +
+