Tamani Phiri

@senior_developer

","css":".absolute {\n position: absolute\n}\n\n.relative {\n position: relative\n}\n\n.-bottom-full {\n bottom: -100%\n}\n\n.top-8 {\n top: 2rem\n}\n\n.flex {\n display: flex\n}\n\n.h-16 {\n height: 4rem\n}\n\n.min-h-screen {\n min-height: 100vh\n}\n\n.w-16 {\n width: 4rem\n}\n\n.w-full {\n width: 100%\n}\n\n.max-w-sm {\n max-width: 24rem\n}\n\n.flex-col {\n flex-direction: column\n}\n\n.items-center {\n align-items: center\n}\n\n.justify-center {\n justify-content: center\n}\n\n.justify-evenly {\n justify-content: space-evenly\n}\n\n.gap-2 {\n gap: 0.5rem\n}\n\n.gap-3 {\n gap: 0.75rem\n}\n\n.overflow-hidden {\n overflow: hidden\n}\n\n.rounded-full {\n border-radius: 9999px\n}\n\n.rounded-xl {\n border-radius: 0.75rem\n}\n\n.bg-gray-700 {\n --tw-bg-opacity: 1;\n background-color: rgb(55 65 81 / var(--tw-bg-opacity))\n}\n\n.p-1 {\n padding: 0.25rem\n}\n\n.p-4 {\n padding: 1rem\n}\n\n.text-center {\n text-align: center\n}\n\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem\n}\n\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem\n}\n\n.font-semibold {\n font-weight: 600\n}\n\n.text-gray-500 {\n --tw-text-opacity: 1;\n color: rgb(107 114 128 / var(--tw-text-opacity))\n}\n\n.text-gray-700 {\n --tw-text-opacity: 1;\n color: rgb(55 65 81 / var(--tw-text-opacity))\n}\n\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity))\n}\n\n.shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)\n}\n\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)\n}\n\n.transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms\n}\n\n.delay-200 {\n transition-delay: 200ms\n}\n\n.duration-500 {\n transition-duration: 500ms\n}\n\n.hover\\:scale-110:hover {\n --tw-scale-x: 1.1;\n --tw-scale-y: 1.1;\n 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))\n}\n\n.hover\\:p-2:hover {\n padding: 0.5rem\n}\n\n.hover\\:shadow-2xl:hover {\n --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)\n}\n\n.group:hover .group-hover\\:bottom-3 {\n bottom: 0.75rem\n}\n\n.group:hover .group-hover\\:scale-105 {\n --tw-scale-x: 1.05;\n --tw-scale-y: 1.05;\n 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))\n}\n\n.group:hover .group-hover\\:pb-10 {\n padding-bottom: 2.5rem\n}"}

smooth-stingray-60

👁 实时预览

📝 源代码