fix: Add max-w-4xl mx-auto to sections for consistent width

This commit is contained in:
OpenCode Agent
2026-04-02 19:04:15 +07:00
parent 8ae6f412d9
commit 5159445a51
19 changed files with 185 additions and 363 deletions

View File

@@ -145,7 +145,8 @@ import Footer from '@/components/common/Footer.astro';
<!-- Additional Images -->
<section class="section">
<div class="container-custom">
<h2 class="text-xl font-bold text-secondary-900 mb-6">รูปภาพสินค้าเพิ่มเติม</h2>
<div class="max-w-4xl mx-auto">
<h2 class="text-xl font-bold text-secondary-900 mb-6">รูปภาพสินค้าเพิ่มเติม</h2>
<div class="grid grid-cols-2 md:grid-cols-3 gap-4">
<img src="/images/valve-In01.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" decoding="async" onerror="this.style.display='none'" /><img src="/images/valve-In02.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" decoding="async" onerror="this.style.display='none'" /><img src="/images/valve-In03.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" decoding="async" onerror="this.style.display='none'" /><img src="/images/valve-In05.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" decoding="async" onerror="this.style.display='none'" /><img src="/images/valve-In08.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" decoding="async" onerror="this.style.display='none'" /><img src="/images/valve-In10.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" decoding="async" onerror="this.style.display='none'" /><img src="/images/valve-In15.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" decoding="async" onerror="this.style.display='none'" /><img src="/images/valve-In17.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" decoding="async" onerror="this.style.display='none'" />
</div>
@@ -155,7 +156,8 @@ import Footer from '@/components/common/Footer.astro';
<!-- Valve Selection Guide -->
<section id="selection" class="section bg-white">
<div class="container-custom">
<h2 class="text-xl font-bold text-secondary-900 mb-8">วิธีเลือกวาล์วให้เหมาะสม</h2>
<div class="max-w-4xl mx-auto">
<h2 class="text-xl font-bold text-secondary-900 mb-8">วิธีเลือกวาล์วให้เหมาะสม</h2>
<div class="grid md:grid-cols-2 gap-6">
<div class="bg-blue-50 p-5 rounded-lg">
<h3 class="font-bold text-secondary-900 mb-3">Ball Valve (บอลวาล์ว)</h3>
@@ -178,14 +180,16 @@ import Footer from '@/components/common/Footer.astro';
<p class="text-secondary-600 text-sm">ใช้กับ: งานที่ต้องปรับอัตราการไหล</p>
</div>
</div>
</div>
</div>
</section>
<!-- FAQ Section -->
<section id="faq" class="section bg-gray-50">
<div class="container-custom">
<h2 class="text-xl font-bold text-secondary-900 mb-8">คำถามที่พบบ่อย</h2>
<div class="space-y-4 max-w-4xl">
<div class="max-w-4xl mx-auto">
<h2 class="text-xl font-bold text-secondary-900 mb-8">คำถามที่พบบ่อย</h2>
<div class="space-y-4">
<div class="bg-white rounded-lg p-4">
<h3 class="font-semibold text-secondary-900 mb-2">Q: Ball Valve กับ Gate Valve ต่างกันอย่างไร?</h3>
<p class="text-secondary-700">Ball Valve เปิด-ปิดเร็วด้วยการหมุน 90 องศา ส่วน Gate Valve เปิด-ปิดค่อยเป็นค่อยไปด้วยการหมุนบังคับหลายรอบ Gate Valve กันย้อนได้ดีกว่า</p>
@@ -199,6 +203,7 @@ import Footer from '@/components/common/Footer.astro';
<p class="text-secondary-700">Brass แข็งแรงทนแรงดันสูง เหมาะกับงานที่ต้องการความทนทาน PVC ราคาถูกกว่า เหมาะกับงานทั่วไปแรงดันต่ำ</p>
</div>
</div>
</div>
</div>
</section>