64 lines
4.4 KiB
PHP
64 lines
4.4 KiB
PHP
<div>
|
|
<div class="flex justify-center items-center py-3">
|
|
<div class="flex items-center">
|
|
<div class="group relative mx-auto w-full overflow-hidden rounded-[16px] dark:bg-zinc-800 bg-zinc-200 p-[1px] transition-all duration-300 ease-in-out hover:bg-gradient-to-r hover:from-zinc-600 hover:via-zinc-800 hover:to-zinc-700">
|
|
<div class="relative rounded-[15px] dark:bg-zinc-900 bg-zinc-100 dark:text-white text-accent-content p-6">
|
|
<div class="space-y-4 w-full">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-center items-center">
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 p-1">
|
|
<!-- Card 1 -->
|
|
<div class="flex items-center">
|
|
<div class="group relative mx-auto w-96 overflow-hidden rounded-[16px] dark:bg-zinc-800 bg-zinc-200 p-[1px] transition-all duration-300 ease-in-out hover:bg-gradient-to-r hover:from-zinc-600 hover:via-zinc-800 hover:to-zinc-700">
|
|
<div class="group-hover:animate-spin-slow invisible absolute -top-40 -bottom-40 left-10 right-10 bg-gradient-to-r from-transparent via-gray-600 to-transparent group-hover:visible"></div>
|
|
<div class="relative rounded-[15px] dark:bg-zinc-900 bg-zinc-100 dark:text-white text-accent-content p-6">
|
|
<div class="space-y-4">
|
|
<flux:icon.shield-check/>
|
|
<p class="text-lg font-semibold dark:text-white text-accent-content">Secure Temporary Email</p>
|
|
<p class="font-md text-slate-500">
|
|
Your temporary email address is protected by a reliable password, generated randomly in your browser, providing a barrier against unauthorized access and potential breaches.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Card 2 -->
|
|
<div class="flex items-center">
|
|
<div class="group relative mx-auto w-96 overflow-hidden rounded-[16px] dark:bg-zinc-800 bg-zinc-200 p-[1px] transition-all duration-300 ease-in-out hover:bg-gradient-to-r hover:from-zinc-700 hover:via-zinc-800 hover:to-zinc-700">
|
|
<div class="group-hover:animate-spin-slow invisible absolute -top-40 -bottom-40 left-10 right-10 bg-gradient-to-r from-transparent via-gray-600 to-transparent group-hover:visible"></div>
|
|
<div class="relative rounded-[15px] dark:bg-zinc-900 bg-zinc-100 dark:text-white text-accent-content p-6">
|
|
<div class="space-y-4">
|
|
<flux:icon.user />
|
|
<p class="text-lg font-semibold dark:text-white text-accent-content">Instant Disposable Email</p>
|
|
<p class="font-md text-slate-500">
|
|
No more wasting precious time on registrations, form-filling, or solving captchas. Your temp email address is ready for use instantly, putting you in control effortlessly.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Card 3 -->
|
|
<div class="flex items-center">
|
|
<div class="group relative mx-auto w-96 overflow-hidden rounded-[16px] dark:bg-zinc-800 bg-zinc-200 p-[1px] transition-all duration-300 ease-in-out hover:bg-gradient-to-r hover:from-zinc-700 hover:via-zinc-800 hover:to-zinc-600">
|
|
<div class="group-hover:animate-spin-slow invisible absolute -top-40 -bottom-40 left-10 right-10 bg-gradient-to-r from-transparent via-gray-600 to-transparent group-hover:visible"></div>
|
|
<div class="relative rounded-[15px] dark:bg-zinc-900 bg-zinc-100 dark:text-white text-accent-content p-6">
|
|
<div class="space-y-4">
|
|
<flux:icon.clock />
|
|
<p class="text-lg font-semibold dark:text-white text-accent-content">Fast and Anonymous Email Service</p>
|
|
<p class="font-md text-slate-500">Experience fast message delivery without delays or restrictions. Our service is finely tuned for maximum delivery speed, ensuring you stay connected seamlessly.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|