Fix missing product images across all pages
- Fixed รั้วเทวดา page: Replaced รุ่นสินค้า section with gallery of actual photos from LINE album - Fixed ระบบรั้วไวน์แมน page: Changed all SVG refs to JPG - Fixed ท่อ-upvc, ท่อ-xy-lent, ระบบน้ำ pages - Fixed วาล์ว-valve, อุปกรณ์ดับเพลิง, อุปกรณ์ปรับอากาศ pages - Fixed เครื่องเชื่อม-ppr, เทอร์โมเบรค-thermobreak, เม็กกรู๊ฟ-คับปลิ้ง pages - Copied รั้วเทวดา images to public/images/tevada/
This commit is contained in:
@@ -2,28 +2,30 @@
|
||||
"$schema": "session-state-v2",
|
||||
"project": "dealplustech-emdash",
|
||||
"cwd": "/Users/kunthawatgreethong/Gitea/dealplustech-emdash",
|
||||
"ts": "2026-05-22T02:06:48.391Z",
|
||||
"continue": "## Goal\nRedesign the Deal Plus Tech website (dealplustech-emdash) with modern animation effects. The site is an Astro-based Thai-language static site for a water systems company.\n\n## Constraints & Preferences\n- Must sync to Gitea before making changes (completed)\n- Modern animation effects required ",
|
||||
"task": "continue work",
|
||||
"ts": "2026-05-22T11:11:26.827Z",
|
||||
"continue": "## Goal\nRedesign the Deal Plus Tech website with modern animation effects, fix image display issues, and refine the hero section design.\n\n## Constraints & Preferences\n- Use green-only color scheme (no orange accent in hero background)\n- Remove small dot grid background from hero\n- Reduce hero sectio",
|
||||
"task": "The mesh line should move to center of hero. Only heoro of all pages not homepage.",
|
||||
"files": [
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/styles/global.css",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/layouts/BaseLayout.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/pages/index.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/products-cropped/ppr-pipe_000C.jpg",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/products-cropped/grilles_000C.jpg",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/thermobreak/thermobreak-solarblock.png",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/logo.png",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/favicon.svg",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/pages/armflex.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/pages/aeroflex.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/pages/maxflex.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/.context/todo.md",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/line-qr.svg",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/products-cropped/ppr-pipe.svg",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/products-cropped/grilles.svg"
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/logo.png",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/products-cropped/grilles.svg",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/products-cropped/grilles_000C.jpg",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/public/images/products-cropped/ppr-pipe.svg"
|
||||
],
|
||||
"files_read": [
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/layouts/BaseLayout.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/pages/index.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/styles/global.css",
|
||||
"CLAUDE.md",
|
||||
"/Users/kunthawatgreethong/.agents/skills/huashu-design/SKILL.md",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/astro.config.mjs",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/pages/all-products.astro",
|
||||
"/Users/kunthawatgreethong/.agents/skills/huashu-design/SKILL.md"
|
||||
"CLAUDE.md",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/pages/about-us.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/layouts/Layout.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/pages/ฉนวนหุ้มท่อ.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/components/common/Header.astro",
|
||||
"/Users/kunthawatgreethong/gitea/dealplustech-emdash/src/layouts/BaseLayout.astro"
|
||||
]
|
||||
}
|
||||
BIN
public/images/tevada/LINE_ALBUM_รั้วเทวดา_260522_1.jpg
Normal file
BIN
public/images/tevada/LINE_ALBUM_รั้วเทวดา_260522_1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 509 KiB |
BIN
public/images/tevada/LINE_ALBUM_รั้วเทวดา_260522_2.jpg
Normal file
BIN
public/images/tevada/LINE_ALBUM_รั้วเทวดา_260522_2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 697 KiB |
BIN
public/images/tevada/LINE_ALBUM_รั้วเทวดา_260522_3.jpg
Normal file
BIN
public/images/tevada/LINE_ALBUM_รั้วเทวดา_260522_3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 562 KiB |
@@ -141,9 +141,9 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
<img src="/images/products-misc/SYLER-b01.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
|
||||
<img src="/images/products-misc/SYLER-b02.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
|
||||
<img src="/images/products-misc/SYLER-b03.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
|
||||
<img src="/images/products-misc/syler001.svg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
|
||||
<img src="/images/products-misc/syler002.svg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
|
||||
<img src="/images/products-misc/syler003.svg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
|
||||
<img src="/images/products-misc/syler001.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
|
||||
<img src="/images/products-misc/syler002.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
|
||||
<img src="/images/products-misc/syler003.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -165,7 +165,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
|
||||
<div class="bg-white rounded-2xl p-8 mb-8">
|
||||
<div class="max-w-3xl mx-auto text-center">
|
||||
<img src="/images/groove-coupling/G1.svg" alt="เครื่องกรู๊ฟท่อไซเลอร์" class="w-full h-auto rounded-lg mb-6" style="max-height: 300px; object-fit: contain;" width="800" height="400" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G1.png" alt="เครื่องกรู๊ฟท่อไซเลอร์" class="w-full h-auto rounded-lg mb-6" style="max-height: 300px; object-fit: contain;" width="800" height="400" loading="lazy" />
|
||||
<h4 class="text-xl font-bold text-neutral-800 mb-2">เครื่องกรู๊ฟท่อไซเลอร์</h4>
|
||||
<p class="text-neutral-600">หมายเหตุ: การ Grooved ท่อ Syler ต้องใช้เครื่อง Grooved ของ Syler เท่านั้น</p>
|
||||
</div>
|
||||
@@ -177,7 +177,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
<span class="bg-primary-100 text-primary-700 px-3 py-1 rounded-full text-sm font-medium">ขั้นตอนที่ 1.1 - 1.3</span>
|
||||
</div>
|
||||
<p class="text-neutral-700 mb-4">ตั้งเครื่องกรู๊ฟ สอดท่อให้หน้าตัดท่อชนแนบกับหัวกรู๊ฟ ปรับระดับท่อที่วางพาดกับขาตั้งท่อด้วยมาตรวัดระดับน้ำ จากนั้นดึงคันโยกไฮโดริกให้หัวกดทับเนื้อท่อแล้ว จึงเปิดสวิทช์เครื่องเพื่อเริ่มทำการกรู๊ฟ</p>
|
||||
<img src="/images/groove-coupling/G2.svg" alt="การกรู๊ฟท่อ" class="w-full h-48 object-cover rounded-lg" width="600" height="400" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G2.png" alt="การกรู๊ฟท่อ" class="w-full h-48 object-cover rounded-lg" width="600" height="400" loading="lazy" />
|
||||
</div>
|
||||
|
||||
<div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
|
||||
@@ -186,8 +186,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</div>
|
||||
<p class="text-neutral-700 mb-4">เมื่อกรู๊ฟเสร็จแล้ว ให้ปิดเครื่องแล้วยกคันโยกไฮโดริกขึ้น นำสายวัดระยะร่องกรู๊ฟมาวัดร่องตามขนาดท่อที่กรู๊ฟ ทั้งนี้ระยะความลึกของร่องกรู๊ฟอนุโลมให้ขาดเกินได้ไม่เกิน 3 มิลลิเมตร</p>
|
||||
<div class="grid grid-cols-2 gap-3">
|
||||
<img src="/images/groove-coupling/G6.svg" alt="การวัดร่องกรู๊ฟ" class="w-full h-32 object-cover rounded-lg" width="400" height="300" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G7.svg" alt="ล็อคระดับปั้มไฮโดริก" class="w-full h-32 object-cover rounded-lg" width="400" height="300" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G6.png" alt="การวัดร่องกรู๊ฟ" class="w-full h-32 object-cover rounded-lg" width="400" height="300" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G7.png" alt="ล็อคระดับปั้มไฮโดริก" class="w-full h-32 object-cover rounded-lg" width="400" height="300" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -211,34 +211,34 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
<div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
|
||||
<span class="bg-blue-100 text-blue-700 px-3 py-1 rounded-full text-sm font-medium mb-3 inline-block">ขั้นตอนที่ 2.1</span>
|
||||
<p class="text-neutral-700 mb-4">ทากาวเฮอร์เมสซีล 55 ที่หน้าตัดท่อเพื่อป้องกันสนิมบริเวณหน้าตัดท่อ</p>
|
||||
<img src="/images/groove-coupling/G8.svg" alt="ทากาวเฮอร์เมสซีล" class="w-full h-40 object-cover rounded-lg" width="600" height="400" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G8.png" alt="ทากาวเฮอร์เมสซีล" class="w-full h-40 object-cover rounded-lg" width="600" height="400" loading="lazy" />
|
||||
</div>
|
||||
|
||||
<div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
|
||||
<span class="bg-blue-100 text-blue-700 px-3 py-1 rounded-full text-sm font-medium mb-3 inline-block">ขั้นตอนที่ 2.2</span>
|
||||
<p class="text-neutral-700 mb-4">นำ Grooved line gasket มาสวมที่ปลายท่อ เพื่อป้องกันไม่ให้น้ำที่ไหลผ่านสัมผัสหน้าตัดท่อ</p>
|
||||
<img src="/images/groove-coupling/G9.svg" alt="สวม Grooved line gasket" class="w-full h-40 object-cover rounded-lg" width="600" height="400" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G9.png" alt="สวม Grooved line gasket" class="w-full h-40 object-cover rounded-lg" width="600" height="400" loading="lazy" />
|
||||
</div>
|
||||
|
||||
<div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
|
||||
<span class="bg-blue-100 text-blue-700 px-3 py-1 rounded-full text-sm font-medium mb-3 inline-block">ขั้นตอนที่ 2.3</span>
|
||||
<p class="text-neutral-700 mb-4">ทาน้ำยาหล่อลื่น Lubricant ให้ทั่วแหวนยาง EPDM เพื่อยืดอายุการใช้งาน</p>
|
||||
<img src="/images/groove-coupling/G10.svg" alt="ทาน้ำยาหล่อลื่น" class="w-full h-40 object-cover rounded-lg" width="600" height="400" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G10.png" alt="ทาน้ำยาหล่อลื่น" class="w-full h-40 object-cover rounded-lg" width="600" height="400" loading="lazy" />
|
||||
</div>
|
||||
|
||||
<div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
|
||||
<span class="bg-blue-100 text-blue-700 px-3 py-1 rounded-full text-sm font-medium mb-3 inline-block">ขั้นตอนที่ 2.4</span>
|
||||
<p class="text-neutral-700 mb-4">นำยางที่ทา Lubricant แล้วมาสวมเข้ากับท่อก่อนจากนั้นจึงสวมเข้ากับข้อต่อ</p>
|
||||
<div class="grid grid-cols-2 gap-2">
|
||||
<img src="/images/groove-coupling/G11.svg" alt="สวมยางเข้ากับท่อ" class="w-full h-28 object-cover rounded-lg" width="400" height="300" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G12.svg" alt="สวมเข้ากับข้อต่อ" class="w-full h-28 object-cover rounded-lg" width="400" height="300" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G11.png" alt="สวมยางเข้ากับท่อ" class="w-full h-28 object-cover rounded-lg" width="400" height="300" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G12.png" alt="สวมเข้ากับข้อต่อ" class="w-full h-28 object-cover rounded-lg" width="400" height="300" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm md:col-span-2">
|
||||
<span class="bg-blue-100 text-blue-700 px-3 py-1 rounded-full text-sm font-medium mb-3 inline-block">ขั้นตอนที่ 2.5</span>
|
||||
<p class="text-neutral-700 mb-4">นำข้อต่อ Coupling มาประกบพร้อมขันน๊อตจนแน่น</p>
|
||||
<img src="/images/groove-coupling/G13.svg" alt="ขันน๊อตจนแน่น" class="w-full h-48 object-cover rounded-lg" width="600" height="400" loading="lazy" />
|
||||
<img src="/images/groove-coupling/G13.png" alt="ขันน๊อตจนแน่น" class="w-full h-48 object-cover rounded-lg" width="600" height="400" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -51,7 +51,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</div>
|
||||
<div class="order-1 lg:order-2">
|
||||
<div class="rounded-2xl overflow-hidden">
|
||||
<img src="/images/products-cropped/upvc-pipe_000C.svg" alt="ท่อ UPVC" class="w-full" loading="eager" />
|
||||
<img src="/images/products-cropped/upvc-pipe_000C.jpg" alt="ท่อ UPVC" class="w-full" loading="eager" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -9,7 +9,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</nav>
|
||||
<div class="grid lg:grid-cols-2 gap-8 items-center">
|
||||
<div class="img-hover rounded-2xl overflow-hidden bg-white/10">
|
||||
<img src="/images/products-cropped/XYLENT_001.svg" alt="ท่อ XYLENT" class="w-full" loading="eager" />
|
||||
<img src="/images/products-cropped/XYLENT_001.png" alt="ท่อ XYLENT" class="w-full" loading="eager" />
|
||||
</div>
|
||||
<div>
|
||||
<span class="text-sm text-primary-200 font-medium">ท่อระบายน้ำ</span>
|
||||
@@ -97,10 +97,10 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</ul>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 gap-4">
|
||||
<img src="/images/products-raw/xylent/XYLENT_004-805x1024.svg" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
|
||||
<img src="/images/products-raw/xylent/XYLENT_031-771x1024.svg" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
|
||||
<img src="/images/products-raw/xylent/XYLENT_016-1024x617.svg" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
|
||||
<img src="/images/products-raw/xylent/XYLENT_008-1024x357.svg" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
|
||||
<img src="/images/products-raw/xylent/XYLENT_004-805x1024.png" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
|
||||
<img src="/images/products-raw/xylent/XYLENT_031-771x1024.png" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
|
||||
<img src="/images/products-raw/xylent/XYLENT_016-1024x617.png" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
|
||||
<img src="/images/products-raw/xylent/XYLENT_008-1024x357.png" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -62,7 +62,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src="/images/products-cropped/water-pump_000C.svg" alt="ระบบน้ำ" class="rounded-2xl" loading="eager" />
|
||||
<img src="/images/products-cropped/water-pump_000C.jpg" alt="ระบบน้ำ" class="rounded-2xl" loading="eager" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -75,7 +75,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
|
||||
<a href="/วาล์ว-valve" class="group overflow-hidden block bg-white rounded-xl border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
|
||||
<div class="aspect-square overflow-hidden">
|
||||
<img src="/images/products-cropped/valve_000C.svg" alt="วาล์ว" class="w-full h-full object-cover group-hover:scale-105 transition-transform" loading="lazy" />
|
||||
<img src="/images/products-cropped/valve_000C.jpg" alt="วาล์ว" class="w-full h-full object-cover group-hover:scale-105 transition-transform" loading="lazy" />
|
||||
</div>
|
||||
<div class="p-4 text-center">
|
||||
<h3 class="text-lg font-bold text-neutral-800 group-hover:text-primary-600 transition-colors">วาล์ว</h3>
|
||||
@@ -84,7 +84,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
|
||||
<a href="/water-pump" class="group overflow-hidden block bg-white rounded-xl border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
|
||||
<div class="aspect-square overflow-hidden">
|
||||
<img src="/images/products-cropped/water-pump_000C.svg" alt="ปั๊มน้ำ" class="w-full h-full object-cover group-hover:scale-105 transition-transform" loading="lazy" />
|
||||
<img src="/images/products-cropped/water-pump_000C.jpg" alt="ปั๊มน้ำ" class="w-full h-full object-cover group-hover:scale-105 transition-transform" loading="lazy" />
|
||||
</div>
|
||||
<div class="p-4 text-center">
|
||||
<h3 class="text-lg font-bold text-neutral-800 group-hover:text-primary-600 transition-colors">ปั๊มน้ำ</h3>
|
||||
@@ -93,7 +93,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
|
||||
<a href="/water-treatment" class="group overflow-hidden block bg-white rounded-xl border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
|
||||
<div class="aspect-square overflow-hidden">
|
||||
<img src="/images/products-cropped/water-treatment_000C.svg" alt="ระบบกรองน้ำ" class="w-full h-full object-cover group-hover:scale-105 transition-transform" loading="lazy" />
|
||||
<img src="/images/products-cropped/water-treatment_000C.jpg" alt="ระบบกรองน้ำ" class="w-full h-full object-cover group-hover:scale-105 transition-transform" loading="lazy" />
|
||||
</div>
|
||||
<div class="p-4 text-center">
|
||||
<h3 class="text-lg font-bold text-neutral-800 group-hover:text-primary-600 transition-colors">ระบบกรองน้ำ</h3>
|
||||
|
||||
@@ -33,7 +33,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
</nav>
|
||||
<div class="grid lg:grid-cols-2 gap-8 items-center">
|
||||
<div class="img-hover rounded-2xl overflow-hidden bg-white/10">
|
||||
<img src="/images/products-raw/vineman/ระบบรั้วไวน์แมน-Vineman-e1613286324569-1024x880.svg" alt="ระบบรั้วไวน์แมน Vineman" class="w-full" loading="eager" />
|
||||
<img src="/images/products-raw/vineman/ระบบรั้วไวน์แมน-Vineman-e1613286324569-1024x880.jpg" alt="ระบบรั้วไวน์แมน Vineman" class="w-full" loading="eager" />
|
||||
</div>
|
||||
<div>
|
||||
<span class="text-sm text-primary-200 font-medium">ระบบรั้ว</span>
|
||||
@@ -77,19 +77,19 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">ลวดหนาม/เสารั้ว/เสารับแรง</h2>
|
||||
<div class="grid grid-cols-2 md:grid-cols-4 gap-6">
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/ระบบรั้วไวน์แมน.svg" alt="ระบบรั้วไวน์แมน" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/ระบบรั้วไวน์แมน.jpg" alt="ระบบรั้วไวน์แมน" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<p class="text-neutral-700 font-medium">ระบบรั้วไวน์แมน</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/ลวดหนาม.svg" alt="ลวดหนาม" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/ลวดหนาม.jpg" alt="ลวดหนาม" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<p class="text-neutral-700 font-medium">ลวดหนาม</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/ตาข่ายถักปม.svg" alt="ตาข่ายถักปม" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/ตาข่ายถักปม.jpg" alt="ตาข่ายถักปม" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<p class="text-neutral-700 font-medium">ตาข่ายถักปม</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/ฟิคซ์ล็อค.svg" alt="ฟิคซ์ล็อค" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/ฟิคซ์ล็อค.jpg" alt="ฟิคซ์ล็อค" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<p class="text-neutral-700 font-medium">ฟิคซ์ล็อค</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -104,7 +104,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">6 เทคนิคน่ารู้ ก่อนเลือกใช้ ระบบรั้วตาข่าย</h2>
|
||||
<div class="grid lg:grid-cols-2 gap-8 items-center">
|
||||
<div>
|
||||
<img src="/images/products-raw/vineman/เทคนิคน่ารู้-ก่อนเลือกใช้-ระบบรั้วตาข่าย-488x1024.svg" alt="6 เทคนิคน่ารู้" class="w-full h-auto rounded-xl max-w-md mx-auto" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/เทคนิคน่ารู้-ก่อนเลือกใช้-ระบบรั้วตาข่าย-488x1024.jpg" alt="6 เทคนิคน่ารู้" class="w-full h-auto rounded-xl max-w-md mx-auto" loading="lazy" />
|
||||
</div>
|
||||
<div class="space-y-4">
|
||||
<div class="flex items-start space-x-3">
|
||||
@@ -146,27 +146,27 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<!-- Problems Grid -->
|
||||
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4 mb-8">
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/จุดเชื่อมของเสาค้ำยันไม่คงทน.svg" alt="จุดเชื่อมของเสาค้ำยันไม่คงทน" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/จุดเชื่อมของเสาค้ำยันไม่คงทน.jpg" alt="จุดเชื่อมของเสาค้ำยันไม่คงทน" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<p class="text-sm text-neutral-700">จุดเชื่อมของเสาค้ำยันไม่คงทน</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/เปราะ-แตกหักง่าย.svg" alt="เปราะ แตกหักง่าย" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/เปราะ-แตกหักง่าย.jpg" alt="เปราะ แตกหักง่าย" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<p class="text-sm text-neutral-700">เปราะ แตกหักง่าย</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/ตัวยึดลวดหนาม-หลุดง่าย.svg" alt="ตัวยึดลวดหนาม หลุดง่าย" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/ตัวยึดลวดหนาม-หลุดง่าย.jpg" alt="ตัวยึดลวดหนาม หลุดง่าย" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<p class="text-sm text-neutral-700">ตัวยึดลวดหนาม หลุดง่าย</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/เสาค้ำยันไม่แข็งแรง.svg" alt="เสาค้ำยันไม่แข็งแรง" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/เสาค้ำยันไม่แข็งแรง.jpg" alt="เสาค้ำยันไม่แข็งแรง" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<p class="text-sm text-neutral-700">เสาค้ำยันไม่แข็งแรง</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/เกิดรอยร้าวง่าย.svg" alt="เกิดรอยร้าวง่าย" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/เกิดรอยร้าวง่าย.jpg" alt="เกิดรอยร้าวง่าย" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<p class="text-sm text-neutral-700">เกิดรอยร้าวง่าย</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/ต้องหล่อปูนทำฐานรากทุกต้น.svg" alt="ต้องหล่อปูนทำฐานรากทุกต้น" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/ต้องหล่อปูนทำฐานรากทุกต้น.jpg" alt="ต้องหล่อปูนทำฐานรากทุกต้น" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
|
||||
<p class="text-sm text-neutral-700">ต้องหล่อปูนทำฐานรากทุกต้น</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -174,10 +174,10 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<!-- Solutions -->
|
||||
<div class="grid md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<img src="/images/products-raw/vineman/รั้วโปร่งโล่งสบายตา-1024x1013.svg" alt="รั้วโปร่งโล่งสบายตา" class="w-full h-auto rounded-xl" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/รั้วโปร่งโล่งสบายตา-1024x1013.jpg" alt="รั้วโปร่งโล่งสบายตา" class="w-full h-auto rounded-xl" loading="lazy" />
|
||||
</div>
|
||||
<div>
|
||||
<img src="/images/products-raw/vineman/แข็งแรง-ติดตั้งง่าย-ได้ทุกภูมิทัศน์.svg" alt="แข็งแรง ติดตั้งง่าย ได้ทุกภูมิทัศน์" class="w-full h-auto rounded-xl" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/แข็งแรง-ติดตั้งง่าย-ได้ทุกภูมิทัศน์.jpg" alt="แข็งแรง ติดตั้งง่าย ได้ทุกภูมิทัศน์" class="w-full h-auto rounded-xl" loading="lazy" />
|
||||
<p class="text-center text-neutral-700 font-medium mt-4">แข็งแรง ติดตั้งง่าย ได้ทุกภูมิทัศน์</p>
|
||||
<p class="text-neutral-600 text-sm mt-2">ระบบรั้วตาข่ายไวน์แมน สามารถติดตั้งเดินแนวรั้วบนพื้นที่ทุกรูปแบบทั้งขึ้น-ลง เนินส่วนเว้า-ส่วนโค้งได้อย่างแข็งแรงและต่อเนื่อง</p>
|
||||
</div>
|
||||
@@ -193,15 +193,15 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">รั้วตาข่ายไวน์แมน ใช้ได้กับเสาทุกประเภท</h2>
|
||||
<div class="grid md:grid-cols-3 gap-6">
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/ระบบรั้วไวน์แมน-ระยะห่างของเสา-5-8-เมตร-1024x302.svg" alt="ระยะห่างของเสา 5-8 เมตร" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/ระบบรั้วไวน์แมน-ระยะห่างของเสา-5-8-เมตร-1024x302.jpg" alt="ระยะห่างของเสา 5-8 เมตร" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<p class="text-neutral-700 font-medium">เสาไวน์แมน ระยะห่าง 5-8 เมตร</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/เสาปูน-ระยะห่างของเสา-4-6-เมตร-1024x299.svg" alt="เสาปูน ระยะห่าง 4-6 เมตร" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/เสาปูน-ระยะห่างของเสา-4-6-เมตร-1024x299.jpg" alt="เสาปูน ระยะห่าง 4-6 เมตร" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<p class="text-neutral-700 font-medium">เสาปูน ระยะห่าง 4-6 เมตร</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<img src="/images/products-raw/vineman/เสาไม้เนื้อแข็ง-ระยะห่างของเสา-4-6-เมตร-1024x295.svg" alt="เสาไม้เนื้อแข็ง ระยะห่าง 4-6 เมตร" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/เสาไม้เนื้อแข็ง-ระยะห่างของเสา-4-6-เมตร-1024x295.jpg" alt="เสาไม้เนื้อแข็ง ระยะห่าง 4-6 เมตร" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
|
||||
<p class="text-neutral-700 font-medium">เสาไม้เนื้อแข็ง ระยะห่าง 4-6 เมตร</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -216,7 +216,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">ไวน์แมน รั้วตาข่ายกึ่งสปริง</h2>
|
||||
<div class="grid lg:grid-cols-2 gap-8 items-center">
|
||||
<div>
|
||||
<img src="/images/products-raw/vineman/ไวน์แมน-รั้วตาข่ายกึ่งสปริง.svg" alt="รั้วตาข่ายกึ่งสปริง" class="w-full h-auto rounded-xl" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/ไวน์แมน-รั้วตาข่ายกึ่งสปริง.jpg" alt="รั้วตาข่ายกึ่งสปริง" class="w-full h-auto rounded-xl" loading="lazy" />
|
||||
</div>
|
||||
<div class="space-y-4">
|
||||
<p class="text-neutral-700 leading-relaxed">
|
||||
@@ -253,7 +253,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">VINEMAN Buying Guide</h2>
|
||||
<div class="grid lg:grid-cols-2 gap-8">
|
||||
<div>
|
||||
<img src="/images/products-raw/vineman/VINEMAN-Buying-Guide.svg" alt="VINEMAN Buying Guide" class="w-full h-auto rounded-xl" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/VINEMAN-Buying-Guide.jpg" alt="VINEMAN Buying Guide" class="w-full h-auto rounded-xl" loading="lazy" />
|
||||
</div>
|
||||
<div class="space-y-4">
|
||||
<p class="text-neutral-700 font-medium">สูตรคำนวณความยาวรอบพื้นที่โดยประมาณ</p>
|
||||
@@ -273,7 +273,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<div class="max-w-7xl mx-auto">
|
||||
<div class="max-w-4xl mx-auto">
|
||||
<h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">ตาราง การคำนวณปริมาณเบื้องต้น</h2>
|
||||
<img src="/images/products-raw/vineman/ตารางการคำนวณปริมาณเบื้องต้น-1024x322.svg" alt="ตารางการคำนวณปริมาณเบื้องต้น" class="w-full max-w-3xl mx-auto h-auto rounded-xl" loading="lazy" />
|
||||
<img src="/images/products-raw/vineman/ตารางการคำนวณปริมาณเบื้องต้น-1024x322.jpg" alt="ตารางการคำนวณปริมาณเบื้องต้น" class="w-full max-w-3xl mx-auto h-auto rounded-xl" loading="lazy" />
|
||||
<div class="mt-6 p-4 bg-yellow-50 rounded-xl max-w-3xl mx-auto">
|
||||
<p class="text-neutral-700 text-sm"><strong>หมายเหตุ:</strong></p>
|
||||
<ul class="text-neutral-600 text-sm list-disc list-inside space-y-1 mt-2">
|
||||
|
||||
@@ -10,7 +10,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</nav>
|
||||
<div class="grid lg:grid-cols-2 gap-8 items-center">
|
||||
<div class="img-hover rounded-2xl overflow-hidden bg-white/10">
|
||||
<img src="/images/products-raw/tevada/TEVADA_001-987x1024.svg" alt="รั้วเทวดา" class="w-full" loading="eager" />
|
||||
<img src="/images/tevada/LINE_ALBUM_รั้วเทวดา_260522_1.jpg" alt="รั้วเทวดา" class="w-full" loading="eager" />
|
||||
</div>
|
||||
<div>
|
||||
<span class="text-sm text-primary-200 font-medium">ระบบรั้วและฉากกั้น</span>
|
||||
@@ -60,175 +60,22 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Models Section -->
|
||||
<!-- Gallery Section -->
|
||||
<section class="py-16 bg-white">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
|
||||
<div class="text-center mb-12">
|
||||
<h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">รุ่นสินค้า</h2>
|
||||
<p class="text-neutral-600 max-w-2xl mx-auto">เลือกขนาดตามความต้องการ</p>
|
||||
<h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">ภาพตัวอย่างผลงาน</h2>
|
||||
<p class="text-neutral-600 max-w-2xl mx-auto">รั้วเทวดาติดตั้งจริงในพื้นที่ต่างๆ</p>
|
||||
</div>
|
||||
<div class="grid md:grid-cols-3 gap-8">
|
||||
<!-- TVD-1250 -->
|
||||
<div class="bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-neutral-200">
|
||||
<div class="aspect-video overflow-hidden">
|
||||
<div class="absolute inset-0 overflow-hidden pointer-events-none">
|
||||
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
|
||||
|
||||
<!-- Floating Particles -->
|
||||
<div class="absolute top-1/4 left-1/4 w-2 h-2 bg-white/30 rounded-full animate-float"></div>
|
||||
<div class="absolute top-1/3 right-1/4 w-3 h-3 bg-primary-300/20 rounded-full animate-float-delayed-1"></div>
|
||||
<div class="absolute top-2/3 left-1/3 w-2 h-2 bg-primary-200/20 rounded-full animate-float-delayed-2"></div>
|
||||
<div class="absolute top-1/2 right-1/3 w-4 h-4 bg-white/15 rounded-full animate-float"></div>
|
||||
<div class="absolute bottom-1/4 left-2/3 w-3 h-3 bg-primary-400/15 rounded-full animate-float-delayed-3"></div>
|
||||
|
||||
<!-- Water-inspired Waves -->
|
||||
<svg class="absolute bottom-0 left-0 w-full h-[250px] opacity-20" viewBox="0 0 1440 250" preserveAspectRatio="none">
|
||||
<path d="M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z" fill="none" stroke="url(#water-gradient-hero)" stroke-width="2">
|
||||
<animate attributeName="d" dur="10s" repeatCount="indefinite" values="M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z;M0,180 Q360,80 720,180 T1440,180 L1440,250 L0,250 Z;M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z"/>
|
||||
</path>
|
||||
<defs>
|
||||
<linearGradient id="water-gradient-hero" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||
<stop offset="0%" stop-color="#40916c"/>
|
||||
<stop offset="50%" stop-color="#74c69d"/>
|
||||
<stop offset="100%" stop-color="#40916c"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
<!-- Second Wave Layer -->
|
||||
<svg class="absolute bottom-0 left-0 w-full h-[200px] opacity-10" viewBox="0 0 1440 200" preserveAspectRatio="none">
|
||||
<path d="M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z" fill="none" stroke="rgba(255,255,255,0.3)" stroke-width="1">
|
||||
<animate attributeName="d" dur="15s" repeatCount="indefinite" values="M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z;M0,120 Q240,20 480,120 T960,120 T1440,120 L1440,200 L0,200 Z;M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z"/>
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<img src="/images/products-raw/tevada/TEVADA_003-1024x647.svg" alt="TVD-1250" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<div class="flex items-center justify-between mb-3">
|
||||
<h3 class="text-xl font-bold text-neutral-900">TVD-1250</h3>
|
||||
<span class="text-lg font-semibold text-primary-600">฿3,200</span>
|
||||
</div>
|
||||
<div class="space-y-2 text-sm text-neutral-600 mb-4">
|
||||
<div class="flex justify-between"><span>ความหนา:</span><span class="font-medium">0.5 มิลลิเมตร</span></div>
|
||||
<div class="flex justify-between"><span>สูง:</span><span class="font-medium">1.25 เมตร</span></div>
|
||||
<div class="flex justify-between"><span>กว้าง:</span><span class="font-medium">2 เมตร</span></div>
|
||||
</div>
|
||||
<ul class="space-y-1">
|
||||
<li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>เหมาะสำหรับรั้วส่วนตัว</li>
|
||||
<li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>น้ำหนักเบา ติดตั้งง่าย</li>
|
||||
<li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>ราคาประหยัด</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="grid md:grid-cols-3 gap-6">
|
||||
<div class="rounded-2xl overflow-hidden shadow-lg hover:shadow-xl transition-shadow">
|
||||
<img src="/images/tevada/LINE_ALBUM_รั้วเทวดา_260522_1.jpg" alt="รั้วเทวดา ภาพที่ 1" class="w-full h-auto" loading="lazy" />
|
||||
</div>
|
||||
<!-- TVD-1500 -->
|
||||
<div class="bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-neutral-200">
|
||||
<div class="aspect-video overflow-hidden">
|
||||
<div class="absolute inset-0 overflow-hidden pointer-events-none">
|
||||
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
|
||||
|
||||
<!-- Floating Particles -->
|
||||
<div class="absolute top-1/4 left-1/4 w-2 h-2 bg-white/30 rounded-full animate-float"></div>
|
||||
<div class="absolute top-1/3 right-1/4 w-3 h-3 bg-primary-300/20 rounded-full animate-float-delayed-1"></div>
|
||||
<div class="absolute top-2/3 left-1/3 w-2 h-2 bg-primary-200/20 rounded-full animate-float-delayed-2"></div>
|
||||
<div class="absolute top-1/2 right-1/3 w-4 h-4 bg-white/15 rounded-full animate-float"></div>
|
||||
<div class="absolute bottom-1/4 left-2/3 w-3 h-3 bg-primary-400/15 rounded-full animate-float-delayed-3"></div>
|
||||
|
||||
<!-- Water-inspired Waves -->
|
||||
<svg class="absolute bottom-0 left-0 w-full h-[250px] opacity-20" viewBox="0 0 1440 250" preserveAspectRatio="none">
|
||||
<path d="M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z" fill="none" stroke="url(#water-gradient-hero)" stroke-width="2">
|
||||
<animate attributeName="d" dur="10s" repeatCount="indefinite" values="M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z;M0,180 Q360,80 720,180 T1440,180 L1440,250 L0,250 Z;M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z"/>
|
||||
</path>
|
||||
<defs>
|
||||
<linearGradient id="water-gradient-hero" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||
<stop offset="0%" stop-color="#40916c"/>
|
||||
<stop offset="50%" stop-color="#74c69d"/>
|
||||
<stop offset="100%" stop-color="#40916c"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
<!-- Second Wave Layer -->
|
||||
<svg class="absolute bottom-0 left-0 w-full h-[200px] opacity-10" viewBox="0 0 1440 200" preserveAspectRatio="none">
|
||||
<path d="M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z" fill="none" stroke="rgba(255,255,255,0.3)" stroke-width="1">
|
||||
<animate attributeName="d" dur="15s" repeatCount="indefinite" values="M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z;M0,120 Q240,20 480,120 T960,120 T1440,120 L1440,200 L0,200 Z;M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z"/>
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<img src="/images/products-raw/tevada/TEVADA_004.svg" alt="TVD-1500" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<div class="flex items-center justify-between mb-3">
|
||||
<h3 class="text-xl font-bold text-neutral-900">TVD-1500</h3>
|
||||
<span class="text-lg font-semibold text-primary-600">฿3,800</span>
|
||||
</div>
|
||||
<div class="space-y-2 text-sm text-neutral-600 mb-4">
|
||||
<div class="flex justify-between"><span>ความหนา:</span><span class="font-medium">0.6 มิลลิเมตร</span></div>
|
||||
<div class="flex justify-between"><span>สูง:</span><span class="font-medium">1.50 เมตร</span></div>
|
||||
<div class="flex justify-between"><span>กว้าง:</span><span class="font-medium">2 เมตร</span></div>
|
||||
</div>
|
||||
<ul class="space-y-1">
|
||||
<li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>เหมาะสำหรับโกดัง</li>
|
||||
<li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>ความแข็งแรงสูง</li>
|
||||
<li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>ทนสนิมได้ดี</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="rounded-2xl overflow-hidden shadow-lg hover:shadow-xl transition-shadow">
|
||||
<img src="/images/tevada/LINE_ALBUM_รั้วเทวดา_260522_2.jpg" alt="รั้วเทวดา ภาพที่ 2" class="w-full h-auto" loading="lazy" />
|
||||
</div>
|
||||
<!-- TVD-2000 -->
|
||||
<div class="bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-neutral-200">
|
||||
<div class="aspect-video overflow-hidden">
|
||||
<div class="absolute inset-0 overflow-hidden pointer-events-none">
|
||||
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
|
||||
|
||||
<!-- Floating Particles -->
|
||||
<div class="absolute top-1/4 left-1/4 w-2 h-2 bg-white/30 rounded-full animate-float"></div>
|
||||
<div class="absolute top-1/3 right-1/4 w-3 h-3 bg-primary-300/20 rounded-full animate-float-delayed-1"></div>
|
||||
<div class="absolute top-2/3 left-1/3 w-2 h-2 bg-primary-200/20 rounded-full animate-float-delayed-2"></div>
|
||||
<div class="absolute top-1/2 right-1/3 w-4 h-4 bg-white/15 rounded-full animate-float"></div>
|
||||
<div class="absolute bottom-1/4 left-2/3 w-3 h-3 bg-primary-400/15 rounded-full animate-float-delayed-3"></div>
|
||||
|
||||
<!-- Water-inspired Waves -->
|
||||
<svg class="absolute bottom-0 left-0 w-full h-[250px] opacity-20" viewBox="0 0 1440 250" preserveAspectRatio="none">
|
||||
<path d="M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z" fill="none" stroke="url(#water-gradient-hero)" stroke-width="2">
|
||||
<animate attributeName="d" dur="10s" repeatCount="indefinite" values="M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z;M0,180 Q360,80 720,180 T1440,180 L1440,250 L0,250 Z;M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z"/>
|
||||
</path>
|
||||
<defs>
|
||||
<linearGradient id="water-gradient-hero" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||
<stop offset="0%" stop-color="#40916c"/>
|
||||
<stop offset="50%" stop-color="#74c69d"/>
|
||||
<stop offset="100%" stop-color="#40916c"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
<!-- Second Wave Layer -->
|
||||
<svg class="absolute bottom-0 left-0 w-full h-[200px] opacity-10" viewBox="0 0 1440 200" preserveAspectRatio="none">
|
||||
<path d="M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z" fill="none" stroke="rgba(255,255,255,0.3)" stroke-width="1">
|
||||
<animate attributeName="d" dur="15s" repeatCount="indefinite" values="M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z;M0,120 Q240,20 480,120 T960,120 T1440,120 L1440,200 L0,200 Z;M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z"/>
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<img src="/images/products-raw/tevada/TEVADA_005.svg" alt="TVD-2000" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<div class="flex items-center justify-between mb-3">
|
||||
<h3 class="text-xl font-bold text-neutral-900">TVD-2000</h3>
|
||||
<span class="text-lg font-semibold text-primary-600">฿4,500</span>
|
||||
</div>
|
||||
<div class="space-y-2 text-sm text-neutral-600 mb-4">
|
||||
<div class="flex justify-between"><span>ความหนา:</span><span class="font-medium">0.7 มิลลิเมตร</span></div>
|
||||
<div class="flex justify-between"><span>สูง:</span><span class="font-medium">2.00 เมตร</span></div>
|
||||
<div class="flex justify-between"><span>กว้าง:</span><span class="font-medium">2 เมตร</span></div>
|
||||
</div>
|
||||
<ul class="space-y-1">
|
||||
<li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>เหมาะสำหรับโรงงาน</li>
|
||||
<li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>ทนทานสูงสุด</li>
|
||||
<li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>รองรับพื้นที่ขนาดใหญ่</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="rounded-2xl overflow-hidden shadow-lg hover:shadow-xl transition-shadow">
|
||||
<img src="/images/tevada/LINE_ALBUM_รั้วเทวดา_260522_3.jpg" alt="รั้วเทวดา ภาพที่ 3" class="w-full h-auto" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -8,7 +8,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
"@type": "Product",
|
||||
"name": "วาล์ว (Valve) - วาล์วน้ำทุกประเภท",
|
||||
"description": "จำหน่ายวาล์ว (Valve) - วาล์วน้ำทุกประเภทคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล",
|
||||
"image": "https://dealplustech.co.th/images/products-cropped/valve_000C.svg",
|
||||
"image": "https://dealplustech.co.th/images/products-cropped/valve_000C.jpg",
|
||||
"offers": {
|
||||
"@type": "Offer",
|
||||
"url": "https://dealplustech.co.th/วาล์ว-valve",
|
||||
@@ -58,7 +58,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
<div class="grid lg:grid-cols-2 gap-12 items-start">
|
||||
<div>
|
||||
<div class="rounded-2xl overflow-hidden bg-white/10">
|
||||
<img src="/images/products-cropped/valve_000C.svg" alt="วาล์ว (Valve)" class="w-full" width="600" height="400" loading="eager" />
|
||||
<img src="/images/products-cropped/valve_000C.jpg" alt="วาล์ว (Valve)" class="w-full" width="600" height="400" loading="eager" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
@@ -108,7 +108,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
<div class="prose prose-lg max-w-none">
|
||||
<p class="text-lg text-neutral-700 leading-relaxed mb-4">จำหน่ายวาล์วน้ำทุกประเภท คุณภาพสูงจากแบรนด์ชั้นนำ เหมาะสำหรับงานระบบประปา ระบบน้ำในอาคาร และโรงงานอุตสาหกรรม มีทีมงานผู้เชี่ยวชาญพร้อมให้คำแนะนำและบริการติดตั้ง</p>
|
||||
|
||||
<img src="/images/products-misc/valve_logo.svg" alt="Valve Brands" class="w-full max-w-md mx-auto my-8 rounded-lg shadow-md" width="600" height="300" loading="lazy" />
|
||||
<img src="/images/products-misc/valve_logo.jpg" alt="Valve Brands" class="w-full max-w-md mx-auto my-8 rounded-lg shadow-md" width="600" height="300" loading="lazy" />
|
||||
|
||||
<p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>ประเภทวาล์วที่มีจำหน่าย:</strong></p>
|
||||
<ul class="list-disc pl-6 mb-4 space-y-2 text-neutral-700">
|
||||
@@ -161,14 +161,14 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
<div class="max-w-4xl mx-auto">
|
||||
<h2 class="text-2xl font-bold text-primary-700 mb-6">รูปภาพสินค้าเพิ่มเติม</h2>
|
||||
<div class="grid grid-cols-2 md:grid-cols-3 gap-4">
|
||||
<img src="/images/valve-In01.svg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
|
||||
<img src="/images/valve-In02.svg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
|
||||
<img src="/images/valve-In03.svg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
|
||||
<img src="/images/valve-In05.svg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
|
||||
<img src="/images/valve-In08.svg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
|
||||
<img src="/images/valve-In10.svg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
|
||||
<img src="/images/valve-In15.svg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
|
||||
<img src="/images/valve-In17.svg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
|
||||
<img src="/images/valve-In01.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" 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" 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" 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" 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" 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" 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" 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" onerror="this.style.display='none'" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -12,7 +12,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<!-- Mobile: Full-width Hero Image -->
|
||||
<section class="md:hidden">
|
||||
<div class="w-full aspect-square bg-gray-100">
|
||||
<img src="/images/products-cropped/extinguishers_000C.svg" alt="อุปกรณ์ดับเพลิง" class="w-full h-full object-cover" width="600" height="600" loading="eager" fetchpriority="high" onerror="this.src='/images/logo/dealplustech-logo.svg'" />
|
||||
<img src="/images/products-cropped/extinguishers_000C.jpg" alt="อุปกรณ์ดับเพลิง" class="w-full h-full object-cover" width="600" height="600" loading="eager" fetchpriority="high" onerror="this.src='/images/logo/dealplustech-logo.svg'" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -50,7 +50,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<div class="grid lg:grid-cols-2 gap-12 items-start">
|
||||
<div class="lg:sticky lg:top-24">
|
||||
<div class="rounded-2xl overflow-hidden bg-white/10 p-2">
|
||||
<img src="/images/products-cropped/extinguishers_000C.svg" alt="อุปกรณ์ดับเพลิง" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" fetchpriority="high" decoding="sync" onerror="this.src='/images/logo/dealplustech-logo.svg'" />
|
||||
<img src="/images/products-cropped/extinguishers_000C.jpg" alt="อุปกรณ์ดับเพลิง" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" fetchpriority="high" decoding="sync" onerror="this.src='/images/logo/dealplustech-logo.svg'" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
@@ -112,7 +112,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<h2 class="text-xl font-bold text-slate-900 mb-8">รายละเอียดสินค้า</h2>
|
||||
|
||||
<div class="flex justify-center mb-8">
|
||||
<img src="/images/fire-extinguisher-p1.svg" alt="ถังดับเพลิง" class="max-w-md w-full rounded-lg shadow-md" width="400" height="300" loading="lazy" decoding="async" />
|
||||
<img src="/images/fire-extinguisher-p1.jpg" alt="ถังดับเพลิง" class="max-w-md w-full rounded-lg shadow-md" width="400" height="300" loading="lazy" decoding="async" />
|
||||
</div>
|
||||
|
||||
<div class="prose prose-lg max-w-none mb-8">
|
||||
@@ -145,7 +145,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
</thead>
|
||||
<tbody class="bg-white">
|
||||
<tr class="hover:bg-primary-50 transition-colors">
|
||||
<td class="px-6 py-4 border-b border-gray-200" rowspan="3"><img src="/images/fire-cabinet-1-crop.svg" alt="ตู้ดับเพลิงแบบเดี่ยว" class="w-24 h-auto rounded" width="96" height="72" loading="lazy" decoding="async" /></td>
|
||||
<td class="px-6 py-4 border-b border-gray-200" rowspan="3"><img src="/images/fire-cabinet-1-crop.jpg" alt="ตู้ดับเพลิงแบบเดี่ยว" class="w-24 h-auto rounded" width="96" height="72" loading="lazy" decoding="async" /></td>
|
||||
<td class="px-6 py-4 border-b border-gray-200 text-lg" rowspan="3">แบบเดี่ยว</td>
|
||||
<td class="px-6 py-4 border-b border-gray-200 text-lg">300 x 600 x 250 มม.</td>
|
||||
<td class="px-6 py-4 border-b border-gray-200 text-lg" rowspan="3">เหล็ก#16 พ่นสีแดง</td>
|
||||
@@ -161,7 +161,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<td class="px-6 py-4 border-b border-gray-200 text-lg"></td>
|
||||
</tr>
|
||||
<tr class="hover:bg-primary-50 transition-colors">
|
||||
<td class="px-6 py-4 border-b border-gray-200"><img src="/images/fire-cabinet-2-crop.svg" alt="ตู้ดับเพลิงแบบใส่สายดับเพลิง" class="w-24 h-auto rounded" width="96" height="72" loading="lazy" decoding="async" /></td>
|
||||
<td class="px-6 py-4 border-b border-gray-200"><img src="/images/fire-cabinet-2-crop.jpg" alt="ตู้ดับเพลิงแบบใส่สายดับเพลิง" class="w-24 h-auto rounded" width="96" height="72" loading="lazy" decoding="async" /></td>
|
||||
<td class="px-6 py-4 border-b border-gray-200 text-lg">แบบใส่สายดับเพลิง</td>
|
||||
<td class="px-6 py-4 border-b border-gray-200 text-lg">600 x 700 x 200 มม.</td>
|
||||
<td class="px-6 py-4 border-b border-gray-200 text-lg">เหล็ก#21 พ่นสีแดง</td>
|
||||
@@ -173,7 +173,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
</div>
|
||||
|
||||
<h3 class="text-xl font-bold text-slate-900 mb-4">วิธีการเลือกตู้ดับเพลิงเก็บเครื่องดับเพลิง</h3>
|
||||
<img src="/images/fire-extinguisher-p3.svg" alt="วิธีการเลือกตู้ดับเพลิง" class="w-full rounded-lg shadow-md" width="800" height="600" loading="lazy" decoding="async" />
|
||||
<img src="/images/fire-extinguisher-p3.jpg" alt="วิธีการเลือกตู้ดับเพลิง" class="w-full rounded-lg shadow-md" width="800" height="600" loading="lazy" decoding="async" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -103,7 +103,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<img src="/images/grilles/supply-air-content.svg" alt="แอร์ติดผนัง" class="w-full h-full object-cover" loading="lazy" />
|
||||
<img src="/images/grilles/supply-air-content.jpg" alt="แอร์ติดผนัง" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<h3 class="text-lg font-bold text-neutral-900 mb-2">แอร์ติดผนัง</h3>
|
||||
@@ -150,7 +150,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<img src="/images/grilles/air-grille-content.svg" alt="แอร์ตั้งตู้" class="w-full h-full object-cover" loading="lazy" />
|
||||
<img src="/images/grilles/air-grille-content.jpg" alt="แอร์ตั้งตู้" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<h3 class="text-lg font-bold text-neutral-900 mb-2">แอร์ตั้งตู้</h3>
|
||||
@@ -197,7 +197,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<img src="/images/grilles/supply-air-content.svg" alt="แอร์ฝังเพดาน" class="w-full h-full object-cover" loading="lazy" />
|
||||
<img src="/images/grilles/supply-air-content.jpg" alt="แอร์ฝังเพดาน" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<h3 class="text-lg font-bold text-neutral-900 mb-2">แอร์ฝังเพดาน</h3>
|
||||
@@ -244,7 +244,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<img src="/images/grilles/linear-slot-content.svg" alt="ระบบ VRF" class="w-full h-full object-cover" loading="lazy" />
|
||||
<img src="/images/grilles/linear-slot-content.jpg" alt="ระบบ VRF" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<h3 class="text-lg font-bold text-neutral-900 mb-2">ระบบ VRF</h3>
|
||||
@@ -299,25 +299,25 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
|
||||
<div class="grid grid-cols-2 md:grid-cols-4 gap-6">
|
||||
<div class="bg-white rounded-xl p-4 shadow-sm hover:shadow-md transition-shadow text-center border border-neutral-200">
|
||||
<div class="aspect-square rounded-lg overflow-hidden mb-3">
|
||||
<img src="/images/grilles/linear-bar.svg" alt="คอยล์ร้อน" class="w-full h-full object-cover" loading="lazy" />
|
||||
<img src="/images/grilles/linear-bar.jpg" alt="คอยล์ร้อน" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<h4 class="font-medium text-neutral-900">คอยล์ร้อน</h4>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-4 shadow-sm hover:shadow-md transition-shadow text-center border border-neutral-200">
|
||||
<div class="aspect-square rounded-lg overflow-hidden mb-3">
|
||||
<img src="/images/grilles/fresh-air-hing-type.svg" alt="พัดลมระบายอากาศ" class="w-full h-full object-cover" loading="lazy" />
|
||||
<img src="/images/grilles/fresh-air-hing-type.jpg" alt="พัดลมระบายอากาศ" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<h4 class="font-medium text-neutral-900">พัดลมระบายอากาศ</h4>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-4 shadow-sm hover:shadow-md transition-shadow text-center border border-neutral-200">
|
||||
<div class="aspect-square rounded-lg overflow-hidden mb-3">
|
||||
<img src="/images/grilles/return-air.svg" alt="ท่อลมแอร์" class="w-full h-full object-cover" loading="lazy" />
|
||||
<img src="/images/grilles/return-air.jpg" alt="ท่อลมแอร์" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<h4 class="font-medium text-neutral-900">ท่อลมแอร์</h4>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-4 shadow-sm hover:shadow-md transition-shadow text-center border border-neutral-200">
|
||||
<div class="aspect-square rounded-lg overflow-hidden mb-3">
|
||||
<img src="/images/grilles/eye-ball.svg" alt="ควบคุมอุณหภูมิ" class="w-full h-full object-cover" loading="lazy" />
|
||||
<img src="/images/grilles/eye-ball.jpg" alt="ควบคุมอุณหภูมิ" class="w-full h-full object-cover" loading="lazy" />
|
||||
</div>
|
||||
<h4 class="font-medium text-neutral-900">ควบคุมอุณหภูมิ</h4>
|
||||
</div>
|
||||
|
||||
@@ -46,7 +46,7 @@ import Footer from '@/components/common/Footer.astro';
|
||||
<div class="grid lg:grid-cols-2 gap-12 items-start">
|
||||
<div class="lg:sticky lg:top-24">
|
||||
<div class="rounded-2xl overflow-hidden bg-white/10 p-2">
|
||||
<img src="/images/products-misc/ppr-welding-machine-main.svg" alt="เครื่องเชื่อมท่อพีพีอาร์" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" fetchpriority="high" decoding="sync" onerror="this.src='/images/logo/dealplustech-logo.svg'" />
|
||||
<img src="/images/products-misc/ppr-welding-machine-main.jpg" alt="เครื่องเชื่อมท่อพีพีอาร์" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" fetchpriority="high" decoding="sync" onerror="this.src='/images/logo/dealplustech-logo.svg'" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -163,19 +163,19 @@ import Footer from '@/components/common/Footer.astro';
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr style="background: white;"><td rowspan="5" class="px-4 py-3 text-center vertical-align: middle;">ใช้กับท่อขนาด 1/2"-1"<br/><img src="/images/products-misc/D20-32small.svg" alt="D20-32 Small" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">411W020-032S</td><td style="padding: 12px; text-align: center;">D20-32 (Small)</td><td style="padding: 12px; text-align: center;">5,957.00</td></tr>
|
||||
<tr style="background: white;"><td rowspan="5" class="px-4 py-3 text-center vertical-align: middle;">ใช้กับท่อขนาด 1/2"-1"<br/><img src="/images/products-misc/D20-32small.jpg" alt="D20-32 Small" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">411W020-032S</td><td style="padding: 12px; text-align: center;">D20-32 (Small)</td><td style="padding: 12px; text-align: center;">5,957.00</td></tr>
|
||||
<tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411W020-032L</td><td style="padding: 12px; text-align: center;">D20-32 (Large)</td><td style="padding: 12px; text-align: center;">8,676.00</td></tr>
|
||||
<tr style="background: white;"><td style="padding: 12px; text-align: center;">411W020-063</td><td style="padding: 12px; text-align: center;">D20-63</td><td style="padding: 12px; text-align: center;">11,748.00</td></tr>
|
||||
<tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411W075-110</td><td style="padding: 12px; text-align: center;">D75-110</td><td style="padding: 12px; text-align: center;">15,362.00</td></tr>
|
||||
<tr style="background: white;"><td style="padding: 12px; text-align: center;">411W125-000</td><td style="padding: 12px; text-align: center;">D125</td><td style="padding: 12px; text-align: center;">33,000.00</td></tr>
|
||||
<tr><td colspan="4" style="border-bottom: 2px solid #15803d; height: 8px;"></td></tr>
|
||||
|
||||
<tr style="background: white;"><td rowspan="3" class="px-4 py-3 text-center vertical-align: middle;">หัวเจาะอานม้า Aiguille<br/><img src="/images/products-misc/D25-32-40.svg" alt="Aiguille" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">401A025-000</td><td style="padding: 12px; text-align: center;">D25</td><td style="padding: 12px; text-align: center;">770.00</td></tr>
|
||||
<tr style="background: white;"><td rowspan="3" class="px-4 py-3 text-center vertical-align: middle;">หัวเจาะอานม้า Aiguille<br/><img src="/images/products-misc/D25-32-40.jpg" alt="Aiguille" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">401A025-000</td><td style="padding: 12px; text-align: center;">D25</td><td style="padding: 12px; text-align: center;">770.00</td></tr>
|
||||
<tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401A032-000</td><td style="padding: 12px; text-align: center;">D32</td><td style="padding: 12px; text-align: center;">858.00</td></tr>
|
||||
<tr style="background: white;"><td style="padding: 12px; text-align: center;">401A040-000</td><td style="padding: 12px; text-align: center;">D40</td><td style="padding: 12px; text-align: center;">1,180.00</td></tr>
|
||||
<tr><td colspan="4" style="border-bottom: 2px solid #15803d; height: 8px;"></td></tr>
|
||||
|
||||
<tr style="background: white;"><td rowspan="18" class="px-4 py-3 text-center vertical-align: middle;">หัวเชื่อมอานม้า Welding Saddle Mould<br/><img src="/images/products-misc/D50-25.svg" alt="Welding Saddle Mould" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">411S050-025</td><td style="padding: 12px; text-align: center;">D50-25</td><td style="padding: 12px; text-align: center;">1,206.00</td></tr>
|
||||
<tr style="background: white;"><td rowspan="18" class="px-4 py-3 text-center vertical-align: middle;">หัวเชื่อมอานม้า Welding Saddle Mould<br/><img src="/images/products-misc/D50-25.jpg" alt="Welding Saddle Mould" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">411S050-025</td><td style="padding: 12px; text-align: center;">D50-25</td><td style="padding: 12px; text-align: center;">1,206.00</td></tr>
|
||||
<tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411S063-025</td><td style="padding: 12px; text-align: center;">D63-25</td><td style="padding: 12px; text-align: center;">1,206.00</td></tr>
|
||||
<tr style="background: white;"><td style="padding: 12px; text-align: center;">411S063-032</td><td style="padding: 12px; text-align: center;">D63-32</td><td style="padding: 12px; text-align: center;">1,815.00</td></tr>
|
||||
<tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411S075-025</td><td style="padding: 12px; text-align: center;">D75-25</td><td style="padding: 12px; text-align: center;">1,307.00</td></tr>
|
||||
@@ -194,11 +194,11 @@ import Footer from '@/components/common/Footer.astro';
|
||||
<tr style="background: white;"><td style="padding: 12px; text-align: center;">411S160-040</td><td style="padding: 12px; text-align: center;">D160-40</td><td style="padding: 12px; text-align: center;">2,680.00</td></tr>
|
||||
<tr><td colspan="4" style="border-bottom: 2px solid #15803d; height: 8px;"></td></tr>
|
||||
|
||||
<tr style="background: white;"><td rowspan="2" class="px-4 py-3 text-center vertical-align: middle;">หัวเชื่อมแท่งซ่อม Repairing Stick Mould<br/><img src="/images/products-misc/D7.svg" alt="Repairing Stick Mould" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">401R007-000</td><td style="padding: 12px; text-align: center;">D7</td><td style="padding: 12px; text-align: center;">679.00</td></tr>
|
||||
<tr style="background: white;"><td rowspan="2" class="px-4 py-3 text-center vertical-align: middle;">หัวเชื่อมแท่งซ่อม Repairing Stick Mould<br/><img src="/images/products-misc/D7.jpg" alt="Repairing Stick Mould" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">401R007-000</td><td style="padding: 12px; text-align: center;">D7</td><td style="padding: 12px; text-align: center;">679.00</td></tr>
|
||||
<tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401R011-000</td><td style="padding: 12px; text-align: center;">D11</td><td style="padding: 12px; text-align: center;">679.00</td></tr>
|
||||
<tr><td colspan="4" style="border-bottom: 2px solid #15803d; height: 8px;"></td></tr>
|
||||
|
||||
<tr style="background: white;"><td rowspan="10" class="px-4 py-3 text-center vertical-align: middle;">หัวเชื่อม Welding Mould<br/><img src="/images/products-misc/D20.svg" alt="Welding Mould" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">401W020-000</td><td style="padding: 12px; text-align: center;">D20</td><td style="padding: 12px; text-align: center;">504.00</td></tr>
|
||||
<tr style="background: white;"><td rowspan="10" class="px-4 py-3 text-center vertical-align: middle;">หัวเชื่อม Welding Mould<br/><img src="/images/products-misc/D20.jpg" alt="Welding Mould" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">401W020-000</td><td style="padding: 12px; text-align: center;">D20</td><td style="padding: 12px; text-align: center;">504.00</td></tr>
|
||||
<tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401W025-000</td><td style="padding: 12px; text-align: center;">D25</td><td style="padding: 12px; text-align: center;">603.00</td></tr>
|
||||
<tr style="background: white;"><td style="padding: 12px; text-align: center;">401W032-000</td><td style="padding: 12px; text-align: center;">D32</td><td style="padding: 12px; text-align: center;">705.00</td></tr>
|
||||
<tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401W040-000</td><td style="padding: 12px; text-align: center;">D40</td><td style="padding: 12px; text-align: center;">1,387.00</td></tr>
|
||||
|
||||
@@ -83,7 +83,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<h2 class="text-2xl font-bold text-neutral-900 mb-8">รายละเอียดสินค้า</h2>
|
||||
|
||||
<div class="mb-8">
|
||||
<img src="/images/thermobreak/thermobreak-banner.svg" alt="Thermobreak Banner" class="w-full h-auto rounded-xl shadow-md" loading="lazy" />
|
||||
<img src="/images/thermobreak/thermobreak-banner.png" alt="Thermobreak Banner" class="w-full h-auto rounded-xl shadow-md" loading="lazy" />
|
||||
</div>
|
||||
|
||||
<p class="text-lg text-neutral-700 leading-relaxed mb-6">
|
||||
|
||||
@@ -12,7 +12,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<!-- Mobile: Full-width Hero Image -->
|
||||
<section class="md:hidden">
|
||||
<div class="w-full aspect-square bg-gray-100">
|
||||
<img src="/images/products-misc/MECH_001.svg" alt="ข้อต่อกรู๊ฟคับปลิ้ง | MECH Grooved Coupling" class="w-full h-full object-cover" width="600" height="600" loading="eager" fetchpriority="high" onerror="this.src='/images/logo/dealplustech-logo.svg'" />
|
||||
<img src="/images/products-misc/MECH_001.jpg" alt="ข้อต่อกรู๊ฟคับปลิ้ง | MECH Grooved Coupling" class="w-full h-full object-cover" width="600" height="600" loading="eager" fetchpriority="high" onerror="this.src='/images/logo/dealplustech-logo.svg'" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -50,7 +50,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
|
||||
<div class="grid lg:grid-cols-2 gap-12 items-start">
|
||||
<div class="lg:sticky lg:top-24">
|
||||
<div class="rounded-2xl overflow-hidden bg-white/10 p-2">
|
||||
<img src="/images/products-misc/MECH_001.svg" alt="ข้อต่อกรู๊ฟคับปลิ้ง | MECH Grooved Coupling" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" fetchpriority="high" decoding="sync" onerror="this.src='/images/logo/dealplustech-logo.svg'" />
|
||||
<img src="/images/products-misc/MECH_001.jpg" alt="ข้อต่อกรู๊ฟคับปลิ้ง | MECH Grooved Coupling" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" fetchpriority="high" decoding="sync" onerror="this.src='/images/logo/dealplustech-logo.svg'" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
Reference in New Issue
Block a user