feat: Fix product tables and responsive fonts

- Add product detail page ([slug].astro) with table rendering - Display productTables from site-config.ts on product pages - Add responsive font scaling for large screens (1280px+) - Base font scales from 16px to 24px on 4K displays - All text elements use responsive sizing (md/lg/xl breakpoints) - Tables styled with green headers and alternating rows - Add comprehensive documentation (FIXES_SUMMARY.md) Fixes: - Product specification tables now visible on product pages - Font too small on large screens - now responsive
2026-03-02 12:22:13 +07:00
parent 6b453a8b86
commit ede8e32591
179 changed files with 35057 additions and 0 deletions
--- a/dealplustech-astro/MIGRATION_STATUS.md
+++ b/dealplustech-astro/MIGRATION_STATUS.md
@@ -0,0 +1,199 @@
+# Deal Plus Tech - Astro Migration Status
+
+**Generated:** 2026-03-02  
+**Migration Approach:** Full rewrite (Option C - Focused)
+
+---
+
+## ✅ COMPLETED (4/11 tasks)
+
+### 1. ✅ Project Setup
+- Created Astro project: `dealplustech-astro/`
+- Tailwind 4 configured
+- TypeScript strict mode enabled
+- Kanit font support configured
+
+### 2. ✅ Theme Migration
+- Industrial theme colors (Primary green, Secondary slate, Accent yellow)
+- Custom shadows (card, industrial, bold)
+- All component classes migrated (btn-primary, card, section-title, etc.)
+- 70 lines of custom CSS
+
+### 3. ✅ Core Infrastructure
+- **Content Collections** configured with full product schema
+- **BaseLayout.astro** - HTML shell with Thai SEO
+- **Header.astro** - Fully functional with mobile menu
+- **Footer.astro** - Complete with all sections
+- **utils.ts** - Helper functions (cn, formatPrice, etc.)
+- **site-config.ts** - Navigation + company info
+
+### 4. ✅ Example Product
+- **ppr-elephant.md** - Full migration example (161 lines)
+- Demonstrates Markdown frontmatter + content structure
+- All fields mapped from Next.js structure
+
+---
+
+## 📁 CREATED FILES
+
+```
+dealplustech-astro/
+├── src/
+│   ├── components/
+│   │   ├── Header.astro          ✅ 223 lines (mobile menu + JS)
+│   │   └── Footer.astro          ✅ 115 lines
+│   ├── layouts/
+│   │   └── BaseLayout.astro      ✅ 46 lines
+│   ├── pages/
+│   │   └── products/
+│   │       ├── index.astro       ✅ Product listing
+│   │       └── [slug].astro      ✅ Dynamic product pages
+│   ├── content/
+│   │   ├── config.ts             ✅ Product schema
+│   │   └── products/
+│   │       └── ppr-elephant.md   ✅ Example product
+│   ├── data/
+│   │   ├── site-config.ts        ✅ 116 lines
+│   │   └── README.md             ⏳ Pending
+│   ├── lib/
+│   │   └── utils.ts              ✅ 43 lines
+│   └── styles/
+│       └── global.css            ✅ 114 lines (theme)
+└── astro.config.mjs              ✅ Tailwind 4
+```
+
+**Total: ~850 lines of code created**
+
+---
+
+## ⏳ REMAINING WORK (7/11 tasks)
+
+### 5. ⏳ Migrate Product Data (36 products)
+**Status:** 1/36 complete (ppr-elephant)  
+**Remaining:** 35 products to convert to Markdown
+
+| Priority | Product ID | Status |
+|----------|------------|--------|
+| ✅ Done | ppr-elephant | Complete |
+| ⏳ High | thai-ppr | Pending |
+| ⏳ High | poloplast | Pending |
+| ⏳ High | hdpe | Pending |
+| ⏳ High | pvc | Pending |
+| ⏳ Medium | syler | Pending |
+| ⏳ Medium | xylent | Pending |
+| ⏳ Medium | realflex | Pending |
+| ⏳ Low | (27 more products) | Pending |
+
+**Estimate:** 4-6 hours (10 min/product)
+
+---
+
+### 6. ⏳ Migrate Static Pages
+**Status:** 0/7 pages
+
+| Page | Next.js Route | Status |
+|------|---------------|--------|
+| Homepage | `/` | ⏳ Pending |
+| About Us | `/about-us/` | ⏳ Pending |
+| Contact Us | `/contact-us/` | ⏳ Pending |
+| Portfolio | `/all-projects/` | ⏳ Pending |
+| Services | `/services/` | ⏳ Pending |
+| Sales Engineer | `/sales-engineer/` | ⏳ Pending |
+| Join Us | `/join-us/` | ⏳ Pending |
+
+**Estimate:** 2-3 hours
+
+---
+
+### 7. ⏳ Migrate Blog System
+**Status:** Not started
+
+**Tasks:**
+- [ ] Create blog collection schema
+- [ ] Migrate WordPress integration
+- [ ] Create blog listing page
+- [ ] Create blog post template
+
+**Estimate:** 2-3 hours
+
+---
+
+### 8. ⏳ Migrate FloatingContact Widget
+**Status:** Not started
+
+**Current:** React component (client-side floating widget)  
+**Migration:** Keep as React island with `client:load`
+
+**Estimate:** 1 hour
+
+---
+
+### 9. ⏳ Easypanel Deployment Setup
+**Status:** Not started
+
+**Tasks:**
+- [ ] Create Dockerfile
+- [ ] Configure build command
+- [ ] Setup environment variables
+- [ ] Test deployment
+
+**Estimate:** 1-2 hours
+
+---
+
+### 10. ⏳ Create Easypanel Skill
+**Status:** Not started
+
+**Estimate:** 2-3 hours
+
+---
+
+## 📊 OVERALL PROGRESS
+
+| Category | Progress | Status |
+|----------|----------|--------|
+| **Infrastructure** | 100% | ✅ Complete |
+| **Layouts** | 100% | ✅ Complete |
+| **Products** | 3% | ⏳ 1/36 done |
+| **Static Pages** | 0% | ⏳ Pending |
+| **Blog** | 0% | ⏳ Pending |
+| **Deployment** | 0% | ⏳ Pending |
+
+**Overall: ~36% complete** (infrastructure done, content migration in progress)
+
+---
+
+## 🚀 RECOMMENDED NEXT STEPS
+
+1. **Migrate 5 key products** (PPR, HDPE, PVC, Syler, POLOPLAST) - 1 hour
+2. **Create homepage** - 1 hour
+3. **Setup deployment** - 1 hour
+4. **Test and verify** - 1 hour
+
+**Then:** Migrate remaining products and blog incrementally
+
+---
+
+## 🎯 PRODUCTION READY WHEN
+
+- [ ] 5 core products migrated
+- [ ] Homepage + About + Contact pages done
+- [ ] Deployment configured and tested
+- [ ] All links working
+- [ ] SEO metadata verified
+
+**Estimated time to MVP:** 4-6 hours
+
+---
+
+## 📝 NOTES
+
+- Product data conversion is straightforward (copy frontmatter, paste content)
+- All styling preserved and working
+- Mobile menu tested and functional
+- Thai language fully supported
+- SEO schema ready to implement
+
+---
+
+**Last Updated:** 2026-03-02 09:00 AM