commit 55b08a08f4865d7e8c9cf53ceb5af65a3f3c9ff7 Author: Zopt <100939012+Zopt@users.noreply.github.com> Date: Fri Sep 12 17:03:28 2025 +0800 上线 diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 0000000..bffb357 --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,3 @@ +{ + "extends": "next/core-web-vitals" +} diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..3a700a9 --- /dev/null +++ b/.gitignore @@ -0,0 +1,40 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js +.yarn/install-state.gz + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# local env files +.env*.local + +# vercel +.vercel + +# typescript +*.tsbuildinfo +next-env.d.ts + +# vscode +.vscode +.next-prod diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..36f0850 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,11 @@ +{ + "singleQuote": true, + "printWidth": 100, + "tabWidth": 4, + "useTabs": false, + "semi": true, + "jsxSingleQuote": false, + "bracketSpacing": true, + "arrowParens": "always", + "endOfLine": "lf" +} \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..839f8b3 --- /dev/null +++ b/README.md @@ -0,0 +1,25 @@ +# Onlook Starter Template + +

+ +

+ +This is an [Onlook](https://onlook.com/) project set up with +[Next.js](https://nextjs.org/), [TailwindCSS](https://tailwindcss.com/) and +[ShadCN](https://ui.shadcn.com). + +## Getting Started + +First, run the development server: + +```bash +npm run dev +# or +yarn dev +# or +pnpm dev +# or +bun dev +``` + +Open [http://localhost:3000](http://localhost:3000) in Onlook to see the result. diff --git a/app/about/page.tsx b/app/about/page.tsx new file mode 100644 index 0000000..711e037 --- /dev/null +++ b/app/about/page.tsx @@ -0,0 +1,476 @@ +'use client'; + +import { useState, useEffect } from 'react'; +import { Header } from '../../components/Header'; +import { Footer } from '../../components/Footer'; + +export default function AboutPage() { + const [currentLang, setCurrentLang] = useState('zh-CN'); + const [isLoading, setIsLoading] = useState(true); + + useEffect(() => { + const detectLanguage = () => { + const browserLang = navigator.language || navigator.languages[0]; + if (browserLang.startsWith('zh-TW') || browserLang.startsWith('zh-HK')) { + setCurrentLang('zh-TW'); + } else if (browserLang.startsWith('en')) { + setCurrentLang('en'); + } else { + setCurrentLang('zh-CN'); + } + setIsLoading(false); + }; + + detectLanguage(); + }, []); + + const content = { + 'zh-CN': { + title: '关于我们', + subtitle: '致力于构建下一代多语言网站解决方案', + nav: { + home: '首页', + docs: '文档', + about: '关于', + contact: '联系我们', + }, + mission: { + title: '我们的使命', + description: + 'MultiSite 致力于为全球企业提供最先进的多语言静态网站解决方案,让跨语言沟通变得简单高效。', + }, + vision: { + title: '我们的愿景', + description: '成为全球领先的多语言网站技术提供商,帮助企业轻松实现国际化业务拓展。', + }, + values: { + title: '核心价值观', + items: [ + { + title: '创新驱动', + description: '持续探索前沿技术,为用户提供最优质的解决方案', + }, + { + title: '用户至上', + description: '以用户需求为中心,不断优化产品体验', + }, + { + title: '开放合作', + description: '拥抱开源社区,与全球开发者共同成长', + }, + { + title: '品质保证', + description: '严格的质量标准,确保产品稳定可靠', + }, + ], + }, + team: { + title: '团队介绍', + description: '我们是一支充满激情的技术团队,专注于多语言网站技术的研发与创新。', + members: [ + { + name: '张伟', + role: '技术总监', + description: '10年前端开发经验,React/Next.js 技术专家', + }, + { + name: '李娜', + role: '产品经理', + description: '专注用户体验设计,国际化产品规划专家', + }, + { + name: '王强', + role: '架构师', + description: '全栈开发工程师,云原生技术专家', + }, + ], + }, + technology: { + title: '技术优势', + items: [ + { + title: 'React/Next.js', + description: '基于最新的 React 18 和 Next.js 14,提供卓越的性能和开发体验', + }, + { + title: '静态生成', + description: '利用 SSG 技术,实现极速加载和优秀的 SEO 表现', + }, + { + title: '多语言支持', + description: '智能语言检测和切换,支持全球主要语言', + }, + { + title: '响应式设计', + description: '完美适配各种设备,提供一致的用户体验', + }, + ], + }, + }, + 'zh-TW': { + title: '關於我們', + subtitle: '致力於構建下一代多語言網站解決方案', + nav: { + home: '首頁', + docs: '文檔', + about: '關於', + contact: '聯繫我們', + }, + mission: { + title: '我們的使命', + description: + 'MultiSite 致力於為全球企業提供最先進的多語言靜態網站解決方案,讓跨語言溝通變得簡單高效。', + }, + vision: { + title: '我們的願景', + description: '成為全球領先的多語言網站技術提供商,幫助企業輕鬆實現國際化業務拓展。', + }, + values: { + title: '核心價值觀', + items: [ + { + title: '創新驅動', + description: '持續探索前沿技術,為用戶提供最優質的解決方案', + }, + { + title: '用戶至上', + description: '以用戶需求為中心,不斷優化產品體驗', + }, + { + title: '開放合作', + description: '擁抱開源社區,與全球開發者共同成長', + }, + { + title: '品質保證', + description: '嚴格的質量標準,確保產品穩定可靠', + }, + ], + }, + team: { + title: '團隊介紹', + description: '我們是一支充滿激情的技術團隊,專注於多語言網站技術的研發與創新。', + members: [ + { + name: '張偉', + role: '技術總監', + description: '10年前端開發經驗,React/Next.js 技術專家', + }, + { + name: '李娜', + role: '產品經理', + description: '專注用戶體驗設計,國際化產品規劃專家', + }, + { + name: '王強', + role: '架構師', + description: '全棧開發工程師,雲原生技術專家', + }, + ], + }, + technology: { + title: '技術優勢', + items: [ + { + title: 'React/Next.js', + description: '基於最新的 React 18 和 Next.js 14,提供卓越的性能和開發體驗', + }, + { + title: '靜態生成', + description: '利用 SSG 技術,實現極速加載和優秀的 SEO 表現', + }, + { + title: '多語言支援', + description: '智能語言檢測和切換,支援全球主要語言', + }, + { + title: '響應式設計', + description: '完美適配各種設備,提供一致的用戶體驗', + }, + ], + }, + }, + en: { + title: 'About Us', + subtitle: 'Dedicated to building next-generation multi-language website solutions', + nav: { + home: 'Home', + docs: 'Docs', + about: 'About', + contact: 'Contact', + }, + mission: { + title: 'Our Mission', + description: + 'MultiSite is dedicated to providing the most advanced multi-language static website solutions for global enterprises, making cross-language communication simple and efficient.', + }, + vision: { + title: 'Our Vision', + description: + "To become the world's leading multi-language website technology provider, helping enterprises easily achieve international business expansion.", + }, + values: { + title: 'Core Values', + items: [ + { + title: 'Innovation Driven', + description: + 'Continuously explore cutting-edge technologies to provide users with the best solutions', + }, + { + title: 'User First', + description: + 'Focus on user needs and continuously optimize product experience', + }, + { + title: 'Open Collaboration', + description: + 'Embrace the open source community and grow together with global developers', + }, + { + title: 'Quality Assurance', + description: + 'Strict quality standards to ensure stable and reliable products', + }, + ], + }, + team: { + title: 'Our Team', + description: + 'We are a passionate technical team focused on the research and innovation of multi-language website technologies.', + members: [ + { + name: 'Zhang Wei', + role: 'Technical Director', + description: + '10 years of frontend development experience, React/Next.js expert', + }, + { + name: 'Li Na', + role: 'Product Manager', + description: + 'Focus on user experience design, internationalization product planning expert', + }, + { + name: 'Wang Qiang', + role: 'Architect', + description: + 'Full-stack development engineer, cloud-native technology expert', + }, + ], + }, + technology: { + title: 'Technical Advantages', + items: [ + { + title: 'React/Next.js', + description: + 'Based on the latest React 18 and Next.js 14, providing excellent performance and development experience', + }, + { + title: 'Static Generation', + description: + 'Utilizing SSG technology for ultra-fast loading and excellent SEO performance', + }, + { + title: 'Multi-language Support', + description: + 'Intelligent language detection and switching, supporting major global languages', + }, + { + title: 'Responsive Design', + description: + 'Perfect adaptation to various devices, providing consistent user experience', + }, + ], + }, + }, + }; + + const currentContent = content[currentLang]; + + if (isLoading) { + return ( +
+
+
+ ); + } + + return ( +
+
+ + {/* Hero Section */} +
+
+
+

+ {currentContent.title} +

+

+ {currentContent.subtitle} +

+
+
+
+ + {/* Mission & Vision */} +
+
+
+
+
+ + + +
+

+ {currentContent.mission.title} +

+

+ {currentContent.mission.description} +

+
+
+
+ + + + + +
+

+ {currentContent.vision.title} +

+

+ {currentContent.vision.description} +

+
+
+
+
+ + {/* Core Values */} +
+
+
+

+ {currentContent.values.title} +

+
+
+ {currentContent.values.items.map((value, index) => ( +
+
+
+
+

+ {value.title} +

+

+ {value.description} +

+
+ ))} +
+
+
+ + {/* Team */} +
+
+
+

+ {currentContent.team.title} +

+

+ {currentContent.team.description} +

+
+
+ {currentContent.team.members.map((member, index) => ( +
+
+ + + +
+

+ {member.name} +

+

{member.role}

+

{member.description}

+
+ ))} +
+
+
+ + {/* Technology */} +
+
+
+

+ {currentContent.technology.title} +

+
+
+ {currentContent.technology.items.map((tech, index) => ( +
+

+ {tech.title} +

+

{tech.description}

+
+ ))} +
+
+
+ +
+ ); +} diff --git a/app/contact/page.tsx b/app/contact/page.tsx new file mode 100644 index 0000000..a9294a9 --- /dev/null +++ b/app/contact/page.tsx @@ -0,0 +1,510 @@ +'use client'; + +import { useState, useEffect } from 'react'; +import { Header } from '../../components/Header'; +import { Footer } from '../../components/Footer'; + +export default function ContactPage() { + const [currentLang, setCurrentLang] = useState('zh-CN'); + const [isLoading, setIsLoading] = useState(true); + const [formData, setFormData] = useState({ + name: '', + email: '', + company: '', + message: '', + }); + + useEffect(() => { + const detectLanguage = () => { + const browserLang = navigator.language || navigator.languages[0]; + if (browserLang.startsWith('zh-TW') || browserLang.startsWith('zh-HK')) { + setCurrentLang('zh-TW'); + } else if (browserLang.startsWith('en')) { + setCurrentLang('en'); + } else { + setCurrentLang('zh-CN'); + } + setIsLoading(false); + }; + + detectLanguage(); + }, []); + + const content = { + 'zh-CN': { + title: '联系我们', + subtitle: '我们很乐意为您提供帮助和支持', + nav: { + home: '首页', + docs: '文档', + about: '关于', + contact: '联系我们', + }, + form: { + title: '发送消息', + name: '姓名', + email: '邮箱', + company: '公司', + message: '消息', + submit: '发送消息', + namePlaceholder: '请输入您的姓名', + emailPlaceholder: '请输入您的邮箱地址', + companyPlaceholder: '请输入您的公司名称(可选)', + messagePlaceholder: '请描述您的需求或问题...', + }, + contact: { + title: '联系方式', + email: { + title: '邮箱', + value: 'contact@multisite.com', + }, + phone: { + title: '电话', + value: '+86 400-123-4567', + }, + address: { + title: '地址', + value: '北京市朝阳区科技园区创新大厦 A 座 1001 室', + }, + hours: { + title: '工作时间', + value: '周一至周五 9:00 - 18:00', + }, + }, + support: { + title: '技术支持', + items: [ + { + title: '在线文档', + description: '查看详细的使用指南和 API 文档', + link: '/docs', + }, + { + title: 'GitHub', + description: '访问我们的开源项目和代码示例', + link: 'https://github.com', + }, + { + title: '社区论坛', + description: '与其他开发者交流经验和解决方案', + link: '#', + }, + ], + }, + }, + 'zh-TW': { + title: '聯繫我們', + subtitle: '我們很樂意為您提供幫助和支援', + nav: { + home: '首頁', + docs: '文檔', + about: '關於', + contact: '聯繫我們', + }, + form: { + title: '發送消息', + name: '姓名', + email: '郵箱', + company: '公司', + message: '消息', + submit: '發送消息', + namePlaceholder: '請輸入您的姓名', + emailPlaceholder: '請輸入您的郵箱地址', + companyPlaceholder: '請輸入您的公司名稱(可選)', + messagePlaceholder: '請描述您的需求或問題...', + }, + contact: { + title: '聯繫方式', + email: { + title: '郵箱', + value: 'contact@multisite.com', + }, + phone: { + title: '電話', + value: '+86 400-123-4567', + }, + address: { + title: '地址', + value: '北京市朝陽區科技園區創新大廈 A 座 1001 室', + }, + hours: { + title: '工作時間', + value: '週一至週五 9:00 - 18:00', + }, + }, + support: { + title: '技術支援', + items: [ + { + title: '在線文檔', + description: '查看詳細的使用指南和 API 文檔', + link: '/docs', + }, + { + title: 'GitHub', + description: '訪問我們的開源項目和代碼示例', + link: 'https://github.com', + }, + { + title: '社區論壇', + description: '與其他開發者交流經驗和解決方案', + link: '#', + }, + ], + }, + }, + en: { + title: 'Contact Us', + subtitle: "We'd love to help and support you", + nav: { + home: 'Home', + docs: 'Docs', + about: 'About', + contact: 'Contact', + }, + form: { + title: 'Send Message', + name: 'Name', + email: 'Email', + company: 'Company', + message: 'Message', + submit: 'Send Message', + namePlaceholder: 'Enter your name', + emailPlaceholder: 'Enter your email address', + companyPlaceholder: 'Enter your company name (optional)', + messagePlaceholder: 'Describe your needs or questions...', + }, + contact: { + title: 'Contact Information', + email: { + title: 'Email', + value: 'contact@multisite.com', + }, + phone: { + title: 'Phone', + value: '+86 400-123-4567', + }, + address: { + title: 'Address', + value: 'Room 1001, Building A, Innovation Tower, Tech Park, Chaoyang District, Beijing', + }, + hours: { + title: 'Business Hours', + value: 'Monday - Friday 9:00 AM - 6:00 PM', + }, + }, + support: { + title: 'Technical Support', + items: [ + { + title: 'Documentation', + description: 'View detailed usage guides and API documentation', + link: '/docs', + }, + { + title: 'GitHub', + description: 'Access our open source projects and code examples', + link: 'https://github.com', + }, + { + title: 'Community Forum', + description: 'Exchange experiences and solutions with other developers', + link: '#', + }, + ], + }, + }, + }; + + const currentContent = content[currentLang]; + + const handleInputChange = (e: React.ChangeEvent) => { + const { name, value } = e.target; + setFormData((prev) => ({ + ...prev, + [name]: value, + })); + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + // 这里可以添加表单提交逻辑 + console.log('Form submitted:', formData); + alert(currentLang === 'en' ? 'Message sent successfully!' : '消息发送成功!'); + }; + + if (isLoading) { + return ( +
+
+
+ ); + } + + return ( +
+
+ + {/* Hero Section */} +
+
+
+

+ {currentContent.title} +

+

+ {currentContent.subtitle} +

+
+
+
+ + {/* Main Content */} +
+
+ {/* Contact Form */} +
+

+ {currentContent.form.title} +

+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+ +
+
+ + {/* Contact Information */} +
+
+

+ {currentContent.contact.title} +

+
+
+
+ + + +
+
+

+ {currentContent.contact.email.title} +

+

+ {currentContent.contact.email.value} +

+
+
+
+
+ + + +
+
+

+ {currentContent.contact.phone.title} +

+

+ {currentContent.contact.phone.value} +

+
+
+
+
+ + + + + +
+
+

+ {currentContent.contact.address.title} +

+

+ {currentContent.contact.address.value} +

+
+
+
+
+ + + +
+
+

+ {currentContent.contact.hours.title} +

+

+ {currentContent.contact.hours.value} +

+
+
+
+
+ + {/* Technical Support */} +
+

+ {currentContent.support.title} +

+
+ {currentContent.support.items.map((item, index) => ( +
+

+ {item.title} +

+

+ {item.description} +

+ + {currentLang === 'en' ? 'Learn more →' : '了解更多 →'} + +
+ ))} +
+
+
+
+
+ +
+
+ ); +} diff --git a/app/docs/[slug]/DocDetail.tsx b/app/docs/[slug]/DocDetail.tsx new file mode 100644 index 0000000..206cf06 --- /dev/null +++ b/app/docs/[slug]/DocDetail.tsx @@ -0,0 +1,114 @@ +'use client'; + +import { useState, useEffect } from 'react'; +import ReactMarkdown from 'react-markdown'; +import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter'; +import { tomorrow } from 'react-syntax-highlighter/dist/esm/styles/prism'; +import { ContentItem } from '@/lib/content'; +import { Header } from '@/components/Header'; +import { Footer } from '@/components/Footer'; +import Link from 'next/link'; + +interface DocDetailProps { + doc: ContentItem | null; + relatedDocs: ContentItem[]; + currentLang: string; +} + +export default function DocDetail({ doc, relatedDocs, currentLang }: DocDetailProps) { + const [lang, setLang] = useState(currentLang); + + // 你原有的语言检测逻辑也可以放在这里 + useEffect(() => { + const browserLang = navigator.language; + if (browserLang.startsWith('zh-TW') || browserLang.startsWith('zh-HK')) { + setLang('zh-TW'); + } else if (browserLang.startsWith('en')) { + setLang('en'); + } else { + setLang('zh-CN'); + } + }, []); + + if (!doc) { + return ( +
+

文档未找到

+
+ ); + } + + // 你原先的多语言文本映射 + const contentMap = { + 'zh-CN': { backTo: '← 返回文档', related: '相关文档' }, + 'zh-TW': { backTo: '← 返回文檔', related: '相關文檔' }, + en: { backTo: '← Back to Docs', related: 'Related Documents' }, + }; + + const labels = contentMap[lang] || contentMap['zh-CN']; + + return ( +
+
+ +
+ + {labels.backTo} + + +
+

{doc.metadata.title}

+

{doc.metadata.description}

+ + {String(children).replace(/\n$/, '')} + + ) : ( + + {children} + + ); + }, + }} + > + {doc.content} + +
+ + {relatedDocs.length > 0 && ( +
+

{labels.related}

+
    + {relatedDocs.map((item) => ( +
  • + + {item.metadata.title} + +
  • + ))} +
+
+ )} +
+ +
+
+ ); +} diff --git a/app/docs/[slug]/page.tsx b/app/docs/[slug]/page.tsx new file mode 100644 index 0000000..0842b91 --- /dev/null +++ b/app/docs/[slug]/page.tsx @@ -0,0 +1,28 @@ +import { getContentData, getAllContent, ContentItem } from '@/lib/content'; +import DocDetail from './DocDetail'; + +interface PageProps { + params: { slug: string }; +} + +export default async function Page({ params: { slug } }: PageProps) { + // 你可以根据需要改为从 headers、cookies 或其它方式获取语言 + const currentLang = 'zh-CN'; + + let doc: ContentItem | null; + let related: ContentItem[]; + try { + doc = getContentData(currentLang, slug); + const all = getAllContent(currentLang); + related = all + .filter( + (item) => item.metadata.category === doc.metadata.category && item.slug !== slug, + ) + .slice(0, 3); + } catch { + doc = null; + related = []; + } + + return ; +} diff --git a/app/docs/page.tsx b/app/docs/page.tsx new file mode 100644 index 0000000..4637f6a --- /dev/null +++ b/app/docs/page.tsx @@ -0,0 +1,369 @@ +'use client'; + +import { useState, useEffect } from 'react'; +import { Header } from '../../components/Header'; +import { Footer } from '../../components/Footer'; +import { DocumentList } from '../../components/DocumentList'; +import { ContentItem } from '../../lib/content'; +import Link from 'next/link'; + +export default function DocsPage() { + const [currentLang, setCurrentLang] = useState('zh-CN'); + const [isLoading, setIsLoading] = useState(true); + const [documents, setDocuments] = useState([]); + + useEffect(() => { + const detectLanguage = () => { + const browserLang = navigator.language || navigator.languages[0]; + if (browserLang.startsWith('zh-TW') || browserLang.startsWith('zh-HK')) { + setCurrentLang('zh-TW'); + } else if (browserLang.startsWith('en')) { + setCurrentLang('en'); + } else { + setCurrentLang('zh-CN'); + } + setIsLoading(false); + }; + + detectLanguage(); + }, []); + + useEffect(() => { + const loadDocuments = () => { + // 创建模拟文档数据 + const mockDocuments: ContentItem[] = [ + { + slug: 'getting-started', + metadata: { + title: currentLang === 'en' ? 'Getting Started' : '快速开始', + description: + currentLang === 'en' + ? 'Learn how to quickly get started with MultiSite for building multi-language websites' + : '学习如何快速开始使用 MultiSite 构建多语言网站', + date: '2024-01-15', + author: currentLang === 'en' ? 'MultiSite Team' : 'MultiSite 团队', + category: currentLang === 'en' ? 'Getting Started' : '入门指南', + tags: + currentLang === 'en' + ? ['getting-started', 'installation', 'setup'] + : ['快速开始', '安装', '设置'], + }, + content: '', + }, + { + slug: 'configuration', + metadata: { + title: currentLang === 'en' ? 'Configuration Guide' : '配置指南', + description: + currentLang === 'en' + ? 'Learn how to configure MultiSite to meet your project requirements' + : '了解如何配置 MultiSite 以满足您的项目需求', + date: '2024-01-16', + author: currentLang === 'en' ? 'MultiSite Team' : 'MultiSite 团队', + category: currentLang === 'en' ? 'Configuration' : '配置', + tags: + currentLang === 'en' + ? ['configuration', 'setup', 'customization'] + : ['配置', '设置', '自定义'], + }, + content: '', + }, + { + slug: 'content-management', + metadata: { + title: currentLang === 'en' ? 'Content Management' : '内容管理', + description: + currentLang === 'en' + ? 'Learn how to manage and organize your content in MultiSite' + : '学习如何在 MultiSite 中管理和组织您的内容', + date: '2024-01-17', + author: currentLang === 'en' ? 'MultiSite Team' : 'MultiSite 团队', + category: currentLang === 'en' ? 'Content' : '内容', + tags: + currentLang === 'en' + ? ['content', 'management', 'markdown'] + : ['内容', '管理', 'markdown'], + }, + content: '', + }, + { + slug: 'deployment', + metadata: { + title: currentLang === 'en' ? 'Deployment Guide' : '部署指南', + description: + currentLang === 'en' + ? 'Learn how to deploy your MultiSite project to production' + : '了解如何将您的 MultiSite 项目部署到生产环境', + date: '2024-01-18', + author: currentLang === 'en' ? 'MultiSite Team' : 'MultiSite 团队', + category: currentLang === 'en' ? 'Deployment' : '部署', + tags: + currentLang === 'en' + ? ['deployment', 'production', 'CI/CD'] + : ['部署', '生产', 'CI/CD'], + }, + content: '', + }, + ]; + + setDocuments(mockDocuments); + }; + + if (!isLoading) { + loadDocuments(); + } + }, [currentLang, isLoading]); + + const content = { + 'zh-CN': { + title: '文档', + subtitle: '完整的多语言静态站点开发指南', + description: '了解如何使用我们的多语言静态站点解决方案构建现代化的网站。', + nav: { + home: '首页', + docs: '文档', + about: '关于', + contact: '联系我们', + }, + }, + 'zh-TW': { + title: '文檔', + subtitle: '完整的多語言靜態站點開發指南', + description: '了解如何使用我們的多語言靜態站點解決方案構建現代化的網站。', + nav: { + home: '首頁', + docs: '文檔', + about: '關於', + contact: '聯繫我們', + }, + }, + en: { + title: 'Documentation', + subtitle: 'Complete guide for multi-language static site development', + description: + 'Learn how to build modern websites using our multi-language static site solution.', + nav: { + home: 'Home', + docs: 'Docs', + about: 'About', + contact: 'Contact', + }, + }, + }; + + const currentContent = content[currentLang]; + + if (isLoading) { + return ( +
+
+
+ ); + } + + return ( +
+
+
+
+
+
+ MS +
+
+ + MultiSite + +
+
+ + + +
+ +
+
+
+
+ +
+
+
+

+ {currentContent.title} +

+

+ {currentContent.subtitle} +

+

+ {currentContent.description} +

+
+
+
+ +
+ {/* Quick Start Section */} +
+

+ {currentLang === 'en' ? 'Getting Started' : '快速开始'} +

+
+

+ {currentLang === 'en' + ? 'Welcome to the MultiSite documentation. This guide will help you get started with building multi-language static websites.' + : '欢迎使用 MultiSite 文档。本指南将帮助您开始构建多语言静态网站。'} +

+

+ {currentLang === 'en' ? 'Features' : '特性'} +

+
    +
  • + {currentLang === 'en' ? 'Multi-language support' : '多语言支持'} +
  • +
  • + {currentLang === 'en' ? 'Static site generation' : '静态站点生成'} +
  • +
  • {currentLang === 'en' ? 'SEO optimization' : 'SEO 优化'}
  • +
  • {currentLang === 'en' ? 'Responsive design' : '响应式设计'}
  • +
+
+
+ + {/* Documentation Cards Section */} +
+
+

+ {currentLang === 'en' ? 'Documentation' : '文档列表'} +

+
+ {currentLang === 'en' + ? `${documents.length} documents available` + : `共 ${documents.length} 篇文档`} +
+
+ + {isLoading ? ( +
+
+ + {currentLang === 'en' ? 'Loading documents...' : '加载文档中...'} + +
+ ) : ( + + )} +
+
+ +
+
+
+
+
+
+ MS +
+ MultiSite +
+

+ {currentLang === 'en' + ? 'Enterprise-grade multi-language static site solution powered by React/Next.js' + : '基于 React/Next.js 的企业级多语言静态站点解决方案'} +

+
+ +
+

+ {currentLang === 'en' ? 'Resources' : '资源'} +

+
    +
  • + + {currentLang === 'en' ? 'Docs' : '文档'} + +
  • +
  • + + API + +
  • +
  • + + {currentLang === 'en' ? 'Examples' : '示例'} + +
  • +
+
+ +
+

+ {currentLang === 'en' ? 'Support' : '支持'} +

+
    +
  • + + {currentLang === 'en' ? 'Contact' : '联系我们'} + +
  • +
  • + + GitHub + +
  • +
  • + + {currentLang === 'en' ? 'Community' : '社区'} + +
  • +
+
+
+ +
+

+ © 2024 MultiSite.{' '} + {currentLang === 'en' ? 'All rights reserved.' : '保留所有权利。'} +

+
+
+
+
+ ); +} diff --git a/app/favicon.ico b/app/favicon.ico new file mode 100644 index 0000000..1b3613c Binary files /dev/null and b/app/favicon.ico differ diff --git a/app/globals.css b/app/globals.css new file mode 100644 index 0000000..f4447b4 --- /dev/null +++ b/app/globals.css @@ -0,0 +1,88 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +:root { + --foreground-rgb: 0, 0, 0; + --background-start-rgb: 214, 219, 220; + --background-end-rgb: 255, 255, 255; +} + +@media (prefers-color-scheme: dark) { + :root { + --foreground-rgb: 255, 255, 255; + --background-start-rgb: 0, 0, 0; + --background-end-rgb: 0, 0, 0; + } +} + +@layer utilities { + .text-balance { + text-wrap: balance; + } +} + +@layer base { + :root { + --background: 0 0% 100%; + --foreground: 0 0% 3.9%; + --card: 0 0% 100%; + --card-foreground: 0 0% 3.9%; + --popover: 0 0% 100%; + --popover-foreground: 0 0% 3.9%; + --primary: 0 0% 9%; + --primary-foreground: 0 0% 98%; + --secondary: 0 0% 96.1%; + --secondary-foreground: 0 0% 9%; + --muted: 0 0% 96.1%; + --muted-foreground: 0 0% 45.1%; + --accent: 0 0% 96.1%; + --accent-foreground: 0 0% 9%; + --destructive: 0 84.2% 60.2%; + --destructive-foreground: 0 0% 98%; + --border: 0 0% 89.8%; + --input: 0 0% 89.8%; + --ring: 0 0% 3.9%; + --chart-1: 12 76% 61%; + --chart-2: 173 58% 39%; + --chart-3: 197 37% 24%; + --chart-4: 43 74% 66%; + --chart-5: 27 87% 67%; + --radius: 0.5rem; + } + .dark { + --background: 0 0% 3.9%; + --foreground: 0 0% 98%; + --card: 0 0% 3.9%; + --card-foreground: 0 0% 98%; + --popover: 0 0% 3.9%; + --popover-foreground: 0 0% 98%; + --primary: 0 0% 98%; + --primary-foreground: 0 0% 9%; + --secondary: 0 0% 14.9%; + --secondary-foreground: 0 0% 98%; + --muted: 0 0% 14.9%; + --muted-foreground: 0 0% 63.9%; + --accent: 0 0% 14.9%; + --accent-foreground: 0 0% 98%; + --destructive: 0 62.8% 30.6%; + --destructive-foreground: 0 0% 98%; + --border: 0 0% 14.9%; + --input: 0 0% 14.9%; + --ring: 0 0% 83.1%; + --chart-1: 220 70% 50%; + --chart-2: 160 60% 45%; + --chart-3: 30 80% 55%; + --chart-4: 280 65% 60%; + --chart-5: 340 75% 55%; + } +} + +@layer base { + * { + @apply border-border; + } + body { + @apply bg-background text-foreground; + } +} diff --git a/app/layout.tsx b/app/layout.tsx new file mode 100644 index 0000000..d07aad6 --- /dev/null +++ b/app/layout.tsx @@ -0,0 +1,18 @@ +import type { Metadata } from 'next'; +import './globals.css'; +import Script from 'next/script'; +export const metadata: Metadata = { + title: 'MultiSite - 企业级多语言静态站点解决方案', + description: '基于 React/Next.js + gray-matter 构建的高性能多语言静态网站', +}; +export default function RootLayout({ children }: { children: React.ReactNode }) { + return ( + + + {children} + +