antv
46 lines
3.3 KiB
PHP
46 lines
3.3 KiB
PHP
<div class="bg-white rounded-2xl p-6 border border-gray-100 shadow-[0_2px_10px_-4px_rgba(0,0,0,0.05)] h-full flex flex-col justify-between">
|
|
<div>
|
|
<div class="flex items-center justify-between mb-1">
|
|
<h3 class="text-[16px] font-bold text-gray-900">Gửi nhanh</h3>
|
|
<button class="text-gray-300 hover:text-gray-500">
|
|
<svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M9 5l7 7-7 7"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<p class="text-[12px] text-gray-400 font-medium mb-5">Chọn thiệp và gửi lời cảm ơn đến đồng nghiệp</p>
|
|
|
|
<!-- 3 Cards Grid -->
|
|
<div class="grid grid-cols-3 gap-2.5 mb-5">
|
|
<!-- Card 1 -->
|
|
<button class="rounded-xl overflow-hidden shadow-sm hover:shadow-md transition-shadow border border-pink-50 relative group bg-gradient-to-b from-pink-50 to-pink-100/50 aspect-[2/3] flex items-center justify-center">
|
|
<div class="w-12 h-12 bg-white rounded-full flex items-center justify-center text-pink-400 text-xl shadow-sm mb-2 group-hover:scale-110 transition-transform">
|
|
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/></svg>
|
|
</div>
|
|
</button>
|
|
|
|
<!-- Card 2 -->
|
|
<button class="rounded-xl overflow-hidden shadow-sm hover:shadow-md transition-shadow border border-blue-50 relative group bg-gradient-to-b from-blue-50 to-blue-100/50 aspect-[2/3] flex items-center justify-center">
|
|
<div class="w-12 h-12 bg-white rounded-full flex items-center justify-center text-blue-400 text-xl shadow-sm mb-2 group-hover:scale-110 transition-transform">
|
|
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/></svg>
|
|
</div>
|
|
</button>
|
|
|
|
<!-- Card 3 -->
|
|
<button class="rounded-xl overflow-hidden shadow-sm hover:shadow-md transition-shadow border border-indigo-50 relative group bg-gradient-to-b from-indigo-50 to-indigo-100/50 aspect-[2/3] flex items-center justify-center">
|
|
<div class="w-12 h-12 bg-white rounded-full flex items-center justify-center text-indigo-400 text-xl shadow-sm mb-2 group-hover:scale-110 transition-transform">
|
|
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M12 2L1 21h22L12 2zm0 3.83L19.17 19H4.83L12 5.83z"/></svg>
|
|
</div>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Link -->
|
|
<a href="{{ route('user.send') }}" class="text-[13px] font-bold text-[#3462f7] hover:text-blue-800 flex items-center gap-1.5 group">
|
|
Tạo thiệp của riêng bạn
|
|
<svg class="w-3 h-3 transform group-hover:translate-x-1 transition-transform" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M14 5l7 7m0 0l-7 7m7-7H3" />
|
|
</svg>
|
|
</a>
|
|
</div>
|