Adjust contact cards layout - email on separate row, wider card

This commit is contained in:
Kunthawat Greethong
2026-04-01 22:39:24 +07:00
parent 6fb90153fc
commit f715e2715d

View File

@@ -38,10 +38,11 @@ import Layout from '../layouts/Layout.astro'
</div>
</section>
<!-- Contact Methods - 3 Cards Centered -->
<!-- Contact Methods - 2+1 Layout -->
<section class="reveal py-20 bg-gradient-to-b from-gray-50 to-white">
<div class="container mx-auto px-4">
<div class="grid md:grid-cols-3 gap-8 max-w-4xl mx-auto">
<!-- Top Row - Phone and LINE -->
<div class="grid md:grid-cols-2 gap-8 max-w-4xl mx-auto mb-8">
<!-- Phone -->
<a href="tel:0809955945" class="group bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 hover:-translate-y-2 text-center">
@@ -64,8 +65,10 @@ import Layout from '../layouts/Layout.astro'
<p class="text-lg font-bold text-[#06C755]">@moreminimore</p>
<p class="text-sm text-gray-500 mt-2">คลิกเพื่อเพิ่มเพื่อน</p>
</a>
</div>
<!-- Email -->
<!-- Bottom Row - Email (Centered, Wider) -->
<div class="grid md:grid-cols-2 gap-8 max-w-3xl mx-auto">
<a href="mailto:contact@moreminimore.com" class="group bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 hover:-translate-y-2 text-center">
<div class="w-16 h-16 bg-blue-500 rounded-2xl flex items-center justify-center mx-auto mb-5 group-hover:bg-blue-400 transition-colors">
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -73,7 +76,7 @@ import Layout from '../layouts/Layout.astro'
</svg>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">อีเมล</h3>
<p class="text-base font-bold text-blue-700 break-all">contact@moreminimore.com</p>
<p class="text-lg font-bold text-blue-700">contact@moreminimore.com</p>
<p class="text-sm text-gray-500 mt-2">ตอบกลับภายใน 24 ชม.</p>
</a>
</div>