Adjust contact cards layout - email on separate row, wider card
This commit is contained in:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user