Add DUKELARRSEN page with Thai content and fix image layouts

This commit is contained in:
Kunthawat
2026-03-21 08:52:59 +07:00
parent 527170e037
commit 82ed104666
24 changed files with 1531 additions and 456 deletions

View File

@@ -71,124 +71,7 @@ import Footer from '@/components/common/Footer.astro';
</div>
</div>
<div class="mt-12">
<h3 class="text-2xl font-bold text-secondary-900 mb-4">ขนาดท่อ HDPE (HDPE Pipe Sizes)</h3>
<div class="overflow-x-auto my-8">
<table class="modern-table w-full">
<thead class="bg-green-600 text-white">
<tr>
<th class="px-6 py-4 text-left text-sm font-semibold uppercase">ขนาด (mm)</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">SDR</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">PN</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">ความหนา (mm)</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">น้ำหนัก (kg/m)</th>
</tr>
</thead>
<tbody class="bg-white">
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">20</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.3</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.13</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">25</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.3</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.17</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">32</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.9</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.27</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">40</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">3.7</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.42</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">50</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">4.6</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.65</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">63</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">5.8</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">1.04</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">75</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">6.8</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">1.46</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">90</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">8.2</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.12</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">110</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">10.0</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">3.16</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">160</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">14.6</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">6.71</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">200</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">18.2</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">10.45</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">250</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">22.7</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16.29</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">315</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">28.6</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">25.90</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="mt-12">
<h3 class="text-2xl font-bold text-secondary-900 mb-4">ขนาดท่อ HDPE (HDPE Pipe Sizes)</h3>
<div class="overflow-x-auto my-8">
<table class="modern-table w-full">
<thead class="bg-green-600 text-white">
<tr>
<th class="px-6 py-4 text-left text-sm font-semibold uppercase">ขนาด (mm)</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">SDR</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">PN</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">ความหนา (mm)</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">น้ำหนัก (kg/m)</th>
</tr>
</thead>
<tbody class="bg-white">
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">20</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.3</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.13</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">25</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.3</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.17</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">32</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.9</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.27</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">40</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">3.7</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.42</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">50</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">4.6</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.65</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">63</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">5.8</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">1.04</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">75</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">6.8</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">1.46</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">90</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">8.2</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.12</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">110</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">10.0</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">3.16</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">160</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">14.6</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">6.71</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">200</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">18.2</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">10.45</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">250</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">22.7</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16.29</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">315</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">28.6</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">25.90</td>
</tr>
</tbody>
</table>
</div>
</div>
</section>
</section>
<section id="product-specs" class="section bg-white">
<div class="container-custom">
@@ -234,6 +117,62 @@ import Footer from '@/components/common/Footer.astro';
</div>
</section>
<section id="product-specs" class="section bg-gray-50">
<div class="container-custom">
<h3 class="text-2xl font-bold text-secondary-900 mb-4">ขนาดท่อ HDPE (HDPE Pipe Sizes)</h3>
<div class="overflow-x-auto my-8">
<table class="modern-table w-full">
<thead class="bg-green-600 text-white">
<tr>
<th class="px-6 py-4 text-left text-sm font-semibold uppercase">ขนาด (mm)</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">SDR</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">PN</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">ความหนา (mm)</th><th class="px-6 py-4 text-left text-sm font-semibold uppercase">น้ำหนัก (kg/m)</th>
</tr>
</thead>
<tbody class="bg-white">
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">20</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.3</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.13</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">25</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.3</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.17</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">32</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.9</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.27</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">40</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">3.7</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.42</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">50</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">4.6</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">0.65</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">63</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">5.8</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">1.04</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">75</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">6.8</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">1.46</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">90</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">8.2</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">2.12</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">110</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">10.0</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">3.16</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">160</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">14.6</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">6.71</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">200</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">18.2</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">10.45</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">250</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">22.7</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16.29</td>
</tr>
<tr class="hover:bg-green-50 transition-colors">
<td class="px-6 py-4 border-b border-secondary-200 text-lg">315</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">11</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">16</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">28.6</td><td class="px-6 py-4 border-b border-secondary-200 text-lg">25.90</td>
</tr>
</tbody>
</table>
</div>
</div>
</section>
<section class="section bg-white">
<div class="container-custom">