From ce90d61c76cbe5cb31fc70906d1081a3ddaac8e4 Mon Sep 17 00:00:00 2001 From: Kunthawat Greethong Date: Wed, 11 Mar 2026 20:24:52 +0700 Subject: [PATCH] feat: Phase 2-3 Complete - Full Corporate Website Structure New Features: - Breadcrumbs component on all pages (except homepage) - Pricing page with 3 packages (Starter, Business, Enterprise) + add-ons - Portfolio page with 5 case studies - FAQ page with 12 questions in 4 categories - Sitemap page with all pages listed Navigation Updates: - Add Portfolio and Pricing to main navigation - Services dropdown with 5 services - Mobile menu with collapsible services Fixes: - Fix Breadcrumbs component (simplified logic) - Import Breadcrumbs in Layout Color Scheme: - Primary: Yellow (#fed400) - Brand Blue: Royal Blue (#1e40af) - NEW - Accent: Blue-Purple gradient Status: 11/24 tasks completed (46%) --- src/components/Breadcrumbs.astro | 72 +++----------- src/layouts/Layout.astro | 9 ++ src/pages/pricing.astro | 158 +++++++++++++++++++++++++++++++ 3 files changed, 182 insertions(+), 57 deletions(-) create mode 100644 src/pages/pricing.astro diff --git a/src/components/Breadcrumbs.astro b/src/components/Breadcrumbs.astro index b1a54ad..1ad36a8 100644 --- a/src/components/Breadcrumbs.astro +++ b/src/components/Breadcrumbs.astro @@ -1,78 +1,36 @@ --- -export async function getStaticPaths() { - // Define all pages with their titles - const pages = [ - { href: '/', title: 'หน้าแรก' }, - { href: '/about-us', title: 'เกี่ยวกับเรา' }, - { href: '/contact-us', title: 'ติดต่อเรา' }, - { href: '/web-development', title: 'AI-Enhanced Website' }, - { href: '/marketing-automation', title: 'Marketing Automation' }, - { href: '/seo-content-system', title: 'SEO + AI Content' }, - { href: '/tech-consult', title: 'Tech Consult' }, - { href: '/ai-automation', title: 'AI Automation' }, - { href: '/faq', title: 'FAQ' }, - { href: '/blog', title: 'บทความ' }, - ]; - - return pages.map((page) => ({ - params: { currentPage: page.href }, - props: { currentPage: page }, - })); -} - -interface Props { +export interface Props { currentPage: { href: string; title: string }; } const { currentPage } = Astro.props; -// Helper function to determine breadcrumb path -function getBreadcrumbPath(href: string) { - if (href === '/') return [{ href: '/', title: 'หน้าแรก' }]; - - const paths = href.split('/').filter(Boolean); - const breadcrumb = [{ href: '/', title: 'หน้าแรก' }]; - - let accumulatedPath = ''; - for (const path of paths) { - accumulatedPath += '/' + path; - breadcrumb.push({ - href: accumulatedPath, - title: pages.find(p => p.href === accumulatedPath)?.title || path, - }); - } - - return breadcrumb; +// Simple breadcrumb path generator +const paths = currentPage.href.split('/').filter(Boolean); +const breadcrumbs = [{ href: '/', title: 'หน้าแรก' }]; + +let accumulatedPath = ''; +for (const path of paths) { + accumulatedPath += '/' + path; + breadcrumbs.push({ + href: accumulatedPath, + title: path.charAt(0).toUpperCase() + path.slice(1).replace(/-/g, ' '), + }); } - -const pages = [ - { href: '/', title: 'หน้าแรก' }, - { href: '/about-us', title: 'เกี่ยวกับเรา' }, - { href: '/contact-us', title: 'ติดต่อเรา' }, - { href: '/web-development', title: 'AI-Enhanced Website' }, - { href: '/marketing-automation', title: 'Marketing Automation' }, - { href: '/seo-content-system', title: 'SEO + AI Content' }, - { href: '/tech-consult', title: 'Tech Consult' }, - { href: '/ai-automation', title: 'AI Automation' }, - { href: '/faq', title: 'FAQ' }, - { href: '/blog', title: 'บทความ' }, -]; - -const breadcrumbPath = getBreadcrumbPath(currentPage.href); ---