From 6992754699b074c4dd1889cdb7113ffd6579a2bd Mon Sep 17 00:00:00 2001 From: Kunthawat Greethong Date: Sun, 24 May 2026 20:18:18 +0700 Subject: [PATCH] Fix hero section structure across all product pages Changes: - Section class: relative now first, 3-stop gradient (from-primary-800 via-primary-700 to-primary-900) - Added py-16 lg:py-24 padding - Added relative z-10 to content wrapper - All 22 product pages standardized Reference: armflex.astro hero section structure --- .context/reports/index.json | 23 ++- .context/reports/reports.db-shm | Bin 32768 -> 32768 bytes .context/reports/reports.db-wal | Bin 45352 -> 61832 bytes .context/todo.md | 210 +++++++++---------------- src/pages/aeroflex.astro | 2 +- src/pages/durgo-avvs.astro | 2 +- src/pages/grilles.astro | 2 +- src/pages/maxflex.astro | 2 +- src/pages/pipe-coupling.astro | 2 +- src/pages/realflex.astro | 4 +- src/pages/water-pump.astro | 2 +- src/pages/water-treatment.astro | 4 +- src/pages/ตู้ดับเพลิง.astro | 6 +- src/pages/ท่อ-hdpe.astro | 6 +- src/pages/ท่อ-ppr-scg.astro | 6 +- src/pages/ท่อ-ppr-thai-ppr.astro | 6 +- src/pages/ท่อ-syler.astro | 2 +- src/pages/ท่อ-upvc.astro | 6 +- src/pages/ท่อ-xy-lent.astro | 4 +- src/pages/ระบบรั้วไวน์แมน.astro | 4 +- src/pages/รั้วเทวดา.astro | 4 +- src/pages/วาล์ว-valve.astro | 2 +- src/pages/เครื่องเชื่อม-hdpe.astro | 2 +- src/pages/เครื่องเชื่อม-ppr.astro | 2 +- src/pages/เทอร์โมเบรค-thermobreak.astro | 6 +- src/pages/เม็กกรู๊ฟ-คับปลิ้ง.astro | 8 +- 26 files changed, 136 insertions(+), 181 deletions(-) diff --git a/.context/reports/index.json b/.context/reports/index.json index 93715b9..484e565 100644 --- a/.context/reports/index.json +++ b/.context/reports/index.json @@ -1,7 +1,28 @@ { "version": 1, - "updatedAt": "2026-05-21T09:49:46.267Z", + "updatedAt": "2026-05-24T13:16:51.251Z", "entries": [ + { + "id": "2026-05-24T13-16-51-249Z-hero-section-fix-plan", + "category": "plan", + "title": "Hero Section Fix Plan", + "summary": "# Plan: Fix Hero Section Structure for All Product Pages ## Context After analyzing all product pages, found **3 major structural issues**: ### Issue 1: Section Class Order Wrong **Problem:** Many pages have `bg-gradient...` BEFORE `relative` in section class ```html
Xweec!{hRE3MLXuGyKyT|E4&_ImWwPEyqa zjRFIZx&M&>RG5i@dt#&U#wA`(oBug6F*EXPW_0_@#K^mG<4-15Rt7ExJ}`@&ft!JU I<3?6P01xRno&W#< delta 180 zcmZo@U}|V!s+V}A%K!o_K+MR%AixczS%FxLDNp^oSGL_st8|@fb|!Ik6OY-iTsb|Q zRP{ikzyM_Ke+JIn~_?SuUnj& zT#}ier<;~pp<9rXm|i8+;3nR)37i9p2#P{jox z#X1UU`K5U&3R+sm3b~0{K=X>B#wX?|WEK~frWR{ySpkhyR`3Mz6b!B4E_JTYNh~f_ z@GnXM+7Vuq4>Vs(3+R-joYY(^EiDD##Joxcuq_H1iDjt@2}$X?=|zbtnW=dtdU|>Z z3Qn$W{z0w^2}P+ni6xn3sR;_1c?!?~Qb-0Ho{*4`QIeaZV56w3s}LUK@8_kIZEnBh);f3KS300L`+`ZV7aO01B=KWM~*z1RoP-(pj^h^ z!N9+pzhiTvKn=gK5pyOZin#=H71QL+6GBCv%4=|kh`f)3n0TCl|2Y2>pozQr6=j%h zQB6d+G>S=@*_Lzi{(6bY0t*F13Olw;eUT**4>99C1OE^H_dqiq^9yn?i!y@J7ZW?P IC?|*k07pq+*8l(j delta 9 QcmeBp%)H_e(*})=02grtga7~l diff --git a/.context/todo.md b/.context/todo.md index 4b4a69f..1fafe0b 100644 --- a/.context/todo.md +++ b/.context/todo.md @@ -1,163 +1,97 @@ -# Plan: Modern Animated Redesign — Deal Plus Tech Website +# Plan: Fix Hero Section Structure for All Product Pages ## Context -The current website at `/Users/kunthawatgreethong/gitea/dealplustech-emdash` is an Astro-based Thai-language static site for "ดีล พลัส เทค" (Deal Plus Tech). It has basic animations (float, orb-drift, fade-in) but lacks modern scroll-triggered effects and sophisticated micro-interactions. +After analyzing all product pages, found **3 major structural issues**: -**Current State:** -- Color scheme: Green primary (#2d6a4f), Orange accent (#e35c1c) -- Animations: Basic float, fade-in, stagger, image hover zoom -- Layout: Standard header with dropdown, hero with floating cards, product grid, footer -- Working directory: `/Users/kunthawatgreethong/gitea/dealplustech-emdash` +### Issue 1: Section Class Order Wrong +**Problem:** Many pages have `bg-gradient...` BEFORE `relative` in section class +```html + +
-**Goal:** Redesign with modern animated effects including: -- Scroll-triggered reveal animations -- Text split/reveal effects -- Magnetic hover buttons -- Parallax sections -- Smooth page transitions -- Bento grid layouts -- Glassmorphism cards -- Animated gradient mesh backgrounds + +
+``` + +### Issue 2: Gradient Style Differs +**Problem:** Some pages use 2-stop gradient, others use 3-stop with `via-` +- Reference uses: `from-primary-800 via-primary-700 to-primary-900` +- Some use: `from-primary-700 to-primary-600` (2-stop) + +### Issue 3: Orphan Div Without Closing +**Problem:** Pages ท่อ-hdpe, ท่อ-upvc, ท่อ-ppr-scg have: +```html + +
+``` + +But reference has: +```html +
+
+
+``` --- -## Phase 1: Animation Library & CSS Infrastructure +## Phase 1: Create Reference Hero Template -**Why:** Set up the foundation for all modern animations before touching components. +Extract the correct hero structure from `armflex.astro`: -**Test first** → `src/styles/global.css` -- Add scroll-triggered animation classes (fade-up, fade-left, fade-right, scale-in) -- Add Intersection Observer script for scroll animations -- Add text split animation utilities -- Add magnetic button effect CSS -- Add glassmorphism utility classes -- Add gradient mesh animation keyframes -- Add parallax utility classes -- Add page transition styles - -**Modify** → `src/layouts/BaseLayout.astro` -- Add animation initialization script in head -- Add page transition wrapper - -**Modify** → `src/components/common/Header.astro` -- Add scroll-triggered header style changes (shrink on scroll) -- Add mobile menu animation -- Add hover effects for nav items +| Element | Correct Value | +|---------|---------------| +| Section class | `relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 lg:py-24 overflow-hidden` | +| Animated bg div | `
` with mesh + particles + wave | +| Content wrapper | `
` | +| Grid | `
` | +| Image container | `
` + `
` | +| Content div | `
` (no extra classes) | +| Buttons | Orange LINE, White phone, White price (auto) | --- -## Phase 2: Homepage Redesign +## Phase 2: Fix All Product Pages -**Why:** The homepage is the first impression - needs the most dramatic animation showcase. +**Pages to fix (23 product pages):** +1. ท่อ-ppr-scg.astro, ท่อ-ppr-thai-ppr.astro, ท่อ-hdpe.astro +2. ท่อ-upvc.astro, ท่อ-syler.astro, ท่อ-xy-lent.astro +3. วาล์ว-valve.astro, durgo-avvs.astro, grilles.astro +4. pipe-coupling.astro, water-pump.astro, water-treatment.astro +5. realflex.astro, รั้วเทวดา.astro, ระบบรั้วไวน์แมน.astro +6. เครื่องเชื่อม-hdpe.astro, เครื่องเชื่อม-ppr.astro +7. เทอร์โมเบรค-thermobreak.astro, เม็กกรู๊ฟ-คับปลิ้ง.astro +8. ตู้ดับเพลิง.astro, aeroflex.astro, maxflex.astro -**Modify** → `src/pages/index.astro` -- **Hero Section:** - - Replace static gradient with animated gradient mesh - - Add text split reveal animation (heading characters animate in sequence) - - Add floating 3D product cards with parallax on mouse move - - Add magnetic CTA buttons - -- **Featured Products:** - - Add scroll-triggered reveal with stagger - - Add 3D tilt effect on card hover - - Add image reveal animation on scroll - -- **Trust Badges:** - - Add counter animation (numbers count up) - - Add scroll-triggered icon animations - -- **CTA Section:** - - Add parallax background effect - - Add gradient animation - ---- - -## Phase 3: Product Pages & Components - -**Why:** Extend animations consistently across all pages. - -**Modify** → `src/layouts/BaseLayout.astro` -- Enhance footer with scroll-triggered animations - -**Modify** → `src/components/common/Header.astro` -- Add smooth scroll navigation highlighting -- Add mega menu with staggered item reveals - -**Modify** → Product pages (`src/pages/*.astro`) -- Add breadcrumb with reveal animation -- Add product gallery with lightbox and zoom -- Add related products carousel - ---- - -## Phase 4: Modern Design Enhancements - -**Why:** Add sophisticated design patterns beyond animations. - -**Modify** → `src/styles/global.css` -- Add bento grid layout utilities -- Add glassmorphism component classes -- Add custom cursor styles -- Add loading skeleton animations - -**Modify** → `src/pages/all-products.astro` -- Implement bento grid product layout -- Add filter animations -- Add lazy load with skeleton - ---- - -## Phase 5: Performance & Polish - -**Why:** Ensure animations don't impact performance negatively. - -**Test** → Run `npm run build` to verify no errors -**Test** → Run `npm run dev` and verify animations work smoothly -**Polish** → Add reduced-motion media query for accessibility -**Polish** → Optimize animation performance (transform/opacity only) +**For each page:** +1. Fix section class order → put `relative` first +2. Change gradient to 3-stop → `from-primary-800 via-primary-700 to-primary-900` +3. Add `py-16 lg:py-24` padding +4. Ensure content wrapper has `relative z-10` +5. Add sticky wrapper around image --- ## Critical Files -| File | Action | Changes | -|------|--------|---------| -| `src/styles/global.css` | Modify | Add animation library, utilities, glassmorphism | -| `src/layouts/BaseLayout.astro` | Modify | Add animation scripts, page wrapper | -| `src/layouts/Layout.astro` | Modify | Add meta tags, fonts | -| `src/components/common/Header.astro` | Modify | Scroll effects, animations, mobile menu | -| `src/components/common/Footer.astro` | Modify | Scroll animations, hover effects | -| `src/pages/index.astro` | Modify | Complete hero/product/cta redesign with animations | - -## Animation Effects to Implement - -### CSS Animations (global.css) -| Class | Effect | -|-------|--------| -| `.animate-fade-up` | Fade in + translate up on scroll | -| `.animate-fade-left` | Fade in + translate left on scroll | -| `.animate-fade-right` | Fade in + translate right on scroll | -| `.animate-scale-in` | Scale from 0.9 to 1 on scroll | -| `.animate-text-reveal` | Text reveals word by word/char by char | -| `.animate-gradient-shift` | Animated gradient background | -| `.glassmorphism` | Frosted glass effect | -| `.magnetic-btn` | Button follows cursor on hover | -| `.parallax` | Parallax scroll effect | -| `.tilt-card` | 3D tilt on hover | - -### Intersection Observer Script -- Trigger animations when elements enter viewport -- Add `data-animate` attribute to elements -- Configure threshold and delay options +| File | Action | +|------|--------| +| src/pages/armflex.astro | Reference (read-only) | +| src/pages/ท่อ-ppr-thai-ppr.astro | Fix section class order | +| src/pages/ท่อ-hdpe.astro | Fix orphan div | +| All 23 product pages | Apply standard hero | --- ## Verification -1. Run `npm run dev` at http://localhost:3100 -2. Scroll through homepage - verify animations trigger at correct positions -3. Hover on product cards - verify 3D tilt effect -4. Hover on CTA buttons - verify magnetic effect -5. Resize to mobile - verify responsive animations -6. Check `prefers-reduced-motion` - verify fallback animations \ No newline at end of file +1. Build succeeds: `npm run build` +2. Check for duplicate `relative` or orphaned `
` +3. Verify buttons have correct classes +4. Visual check on dev server + +--- + +## Implementation Notes + +Will fix each page individually to preserve unique content while applying standard hero structure. \ No newline at end of file diff --git a/src/pages/aeroflex.astro b/src/pages/aeroflex.astro index 36a2308..01b2887 100644 --- a/src/pages/aeroflex.astro +++ b/src/pages/aeroflex.astro @@ -249,7 +249,7 @@ import Footer from '@/components/common/Footer.astro';
-
+

📥 ดาวน์โหลดราคาสินค้า Aeroflex

diff --git a/src/pages/durgo-avvs.astro b/src/pages/durgo-avvs.astro index c8b1475..3fc9d63 100644 --- a/src/pages/durgo-avvs.astro +++ b/src/pages/durgo-avvs.astro @@ -295,7 +295,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้าของเรา?

diff --git a/src/pages/grilles.astro b/src/pages/grilles.astro index 60a819a..199617a 100644 --- a/src/pages/grilles.astro +++ b/src/pages/grilles.astro @@ -301,7 +301,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';

-
+

สนใจสินค้าของเรา?

diff --git a/src/pages/maxflex.astro b/src/pages/maxflex.astro index a0da739..7fe2b20 100644 --- a/src/pages/maxflex.astro +++ b/src/pages/maxflex.astro @@ -248,7 +248,7 @@ import Footer from '@/components/common/Footer.astro';

-
+

📥 ดาวน์โหลดราคาสินค้า Maxflex FR

diff --git a/src/pages/pipe-coupling.astro b/src/pages/pipe-coupling.astro index c76f315..0a90c0e 100644 --- a/src/pages/pipe-coupling.astro +++ b/src/pages/pipe-coupling.astro @@ -198,7 +198,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้าของเรา?

diff --git a/src/pages/realflex.astro b/src/pages/realflex.astro index 38da5da..0f399cd 100644 --- a/src/pages/realflex.astro +++ b/src/pages/realflex.astro @@ -26,7 +26,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';

-
+
@@ -217,7 +217,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
-
+

สนใจสินค้านี้?

ติดต่อ 090-555-1415 หรือแอดไลน์ @JPPSELECTION

diff --git a/src/pages/water-pump.astro b/src/pages/water-pump.astro index fe0438a..1e411cd 100644 --- a/src/pages/water-pump.astro +++ b/src/pages/water-pump.astro @@ -327,7 +327,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้าของเรา?

diff --git a/src/pages/water-treatment.astro b/src/pages/water-treatment.astro index 998b9ab..3651e1b 100644 --- a/src/pages/water-treatment.astro +++ b/src/pages/water-treatment.astro @@ -26,7 +26,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';

-
+
@@ -216,7 +216,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
-
+

สนใจสินค้านี้?

ติดต่อ 090-555-1415 หรือแอดไลน์ @JPPSELECTION

diff --git a/src/pages/ตู้ดับเพลิง.astro b/src/pages/ตู้ดับเพลิง.astro index 9b21e08..a9a8414 100644 --- a/src/pages/ตู้ดับเพลิง.astro +++ b/src/pages/ตู้ดับเพลิง.astro @@ -45,8 +45,8 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
-
-
+
diff --git a/src/pages/ท่อ-hdpe.astro b/src/pages/ท่อ-hdpe.astro index 69f8a76..b9e98a9 100644 --- a/src/pages/ท่อ-hdpe.astro +++ b/src/pages/ท่อ-hdpe.astro @@ -5,7 +5,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+
@@ -39,7 +39,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+
ท่อ HDPE @@ -132,7 +132,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้านี้?

ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION

diff --git a/src/pages/ท่อ-ppr-scg.astro b/src/pages/ท่อ-ppr-scg.astro index 4343d0b..6d2fdf0 100644 --- a/src/pages/ท่อ-ppr-scg.astro +++ b/src/pages/ท่อ-ppr-scg.astro @@ -5,7 +5,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+
@@ -39,7 +39,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+
ท่อ PPR @@ -124,7 +124,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้านี้?

ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION

diff --git a/src/pages/ท่อ-ppr-thai-ppr.astro b/src/pages/ท่อ-ppr-thai-ppr.astro index aad56fc..f41c0db 100644 --- a/src/pages/ท่อ-ppr-thai-ppr.astro +++ b/src/pages/ท่อ-ppr-thai-ppr.astro @@ -5,7 +5,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+
@@ -39,7 +39,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+
ท่อ PPR @@ -143,7 +143,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้านี้?

ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION

diff --git a/src/pages/ท่อ-syler.astro b/src/pages/ท่อ-syler.astro index 266125d..6eaac80 100644 --- a/src/pages/ท่อ-syler.astro +++ b/src/pages/ท่อ-syler.astro @@ -344,7 +344,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้าของเรา?

diff --git a/src/pages/ท่อ-upvc.astro b/src/pages/ท่อ-upvc.astro index 4832d21..a23486d 100644 --- a/src/pages/ท่อ-upvc.astro +++ b/src/pages/ท่อ-upvc.astro @@ -5,7 +5,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';

-
+
@@ -39,7 +39,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+
ท่อ UPVC @@ -143,7 +143,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้านี้?

ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION

diff --git a/src/pages/ท่อ-xy-lent.astro b/src/pages/ท่อ-xy-lent.astro index d9449ba..bf3a0fa 100644 --- a/src/pages/ท่อ-xy-lent.astro +++ b/src/pages/ท่อ-xy-lent.astro @@ -2,7 +2,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro'; --- -
+
@@ -243,7 +243,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้านี้?

ติดต่อ 090-555-1415 หรือแอดไลน์ @JPPSELECTION

diff --git a/src/pages/ระบบรั้วไวน์แมน.astro b/src/pages/ระบบรั้วไวน์แมน.astro index d065a64..cfbbeab 100644 --- a/src/pages/ระบบรั้วไวน์แมน.astro +++ b/src/pages/ระบบรั้วไวน์แมน.astro @@ -26,7 +26,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
-
+
@@ -555,7 +555,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
-
+

สนใจสินค้านี้?

ติดต่อ 090-555-1415 หรือแอดไลน์ @JPPSELECTION

diff --git a/src/pages/รั้วเทวดา.astro b/src/pages/รั้วเทวดา.astro index 816f6a1..8dd55a2 100644 --- a/src/pages/รั้วเทวดา.astro +++ b/src/pages/รั้วเทวดา.astro @@ -3,7 +3,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro'; --- -
+
@@ -234,7 +234,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจรั้วเทวดา?

ติดต่อทีมงานของเราวันนี้เพื่อรับใบเสนอราคาและคำแนะนำจากผู้เชี่ยวชาญ

diff --git a/src/pages/วาล์ว-valve.astro b/src/pages/วาล์ว-valve.astro index 5015a69..3fcfe65 100644 --- a/src/pages/วาล์ว-valve.astro +++ b/src/pages/วาล์ว-valve.astro @@ -237,7 +237,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้าของเรา?

ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ

diff --git a/src/pages/เครื่องเชื่อม-hdpe.astro b/src/pages/เครื่องเชื่อม-hdpe.astro index 40c8d4d..36f78aa 100644 --- a/src/pages/เครื่องเชื่อม-hdpe.astro +++ b/src/pages/เครื่องเชื่อม-hdpe.astro @@ -264,7 +264,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
-
+

สนใจสินค้าของเรา?

ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ

diff --git a/src/pages/เครื่องเชื่อม-ppr.astro b/src/pages/เครื่องเชื่อม-ppr.astro index 7fdc7a9..024d5a6 100644 --- a/src/pages/เครื่องเชื่อม-ppr.astro +++ b/src/pages/เครื่องเชื่อม-ppr.astro @@ -271,7 +271,7 @@ import Footer from '@/components/common/Footer.astro';
-
+

สนใจสินค้าของเรา?

diff --git a/src/pages/เทอร์โมเบรค-thermobreak.astro b/src/pages/เทอร์โมเบรค-thermobreak.astro index 76e1f39..912ad70 100644 --- a/src/pages/เทอร์โมเบรค-thermobreak.astro +++ b/src/pages/เทอร์โมเบรค-thermobreak.astro @@ -26,7 +26,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';

-
+
@@ -334,7 +334,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
-
+

ดาวน์โหลดราคาสินค้า

@@ -348,7 +348,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
-
+

สนใจสินค้านี้?

ติดต่อ 090-555-1415 หรือแอดไลน์ @JPPSELECTION

diff --git a/src/pages/เม็กกรู๊ฟ-คับปลิ้ง.astro b/src/pages/เม็กกรู๊ฟ-คับปลิ้ง.astro index 9c9d2ab..d238704 100644 --- a/src/pages/เม็กกรู๊ฟ-คับปลิ้ง.astro +++ b/src/pages/เม็กกรู๊ฟ-คับปลิ้ง.astro @@ -45,8 +45,8 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
-
-
+
@@ -373,7 +373,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
-
+

สนใจสินค้าของเรา?