feat: 默认语言改为英语 + 导航页添加i18n三语支持

- 导航页(index.html)添加完整i18n引擎,支持zh-CN/zh-TW/en
- 导航页添加语言切换按钮(EN/中/繁)
- 所有20个前端模板默认语言从zh-CN改为en
- 导航页SEO meta标签改为英文
This commit is contained in:
2026-09-09 19:48:45 +08:00
parent a84129330e
commit 10979351f8
22 changed files with 422 additions and 163 deletions

507
web/dist/index.html vendored
View File

@@ -1,37 +1,32 @@
<!DOCTYPE html>
<html lang="zh-CN">
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0">
<title>Gotest · 多行业网站模板集合 - 企业官网/电商/外卖/游戏/应用/音乐模板一站式导航</title>
<meta name="description" content="Gotest 提供 19 套精心设计的多行业网站模板,覆盖企业官网、跨境电商、外卖平台、游戏、应用商店、音乐平台 6 大行业,支持响应式设计,一键预览,即刻上线。">
<meta name="keywords" content="网站模板,企业官网模板,电商模板,响应式网站,网站设计,模板导航,跨境电商模板,外卖平台模板,游戏网站模板,应用商店模板,音乐平台模板,低成本建站">
<meta name="author" content="焉耆青梧映星软件开发工作室">
<title>Gotest · Multi-Industry Website Templates - Enterprise/E-commerce/Food/Gaming/App/Music</title>
<meta name="description" content="Gotest offers 19 carefully designed website templates covering enterprise, cross-border e-commerce, food delivery, gaming, app store, and music platforms. Responsive design, instant preview.">
<meta name="keywords" content="website templates,enterprise templates,ecommerce templates,responsive design,template gallery,cross-border ecommerce,food delivery,gaming platform,app store,music platform">
<meta name="author" content="Gotest">
<meta name="robots" content="index, follow">
<meta name="googlebot" content="index, follow">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="/">
<meta property="og:title" content="Gotest · 多行业网站模板集合">
<meta property="og:description" content="19 套精心设计的多行业网站模板,覆盖 6 大行业,响应式设计,一键预览。">
<meta property="og:site_name" content="Gotest 模板导航">
<meta property="og:title" content="Gotest · Multi-Industry Website Templates">
<meta property="og:description" content="19 carefully designed website templates covering 6 industries. Responsive design, instant preview.">
<meta property="og:site_name" content="Gotest Templates">
<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Gotest · 多行业网站模板集合">
<meta name="twitter:description" content="19 套精心设计的多行业网站模板,覆盖 6 大行业,响应式设计,一键预览。">
<!-- GEO -->
<meta name="geo.region" content="CN-XJ">
<meta name="geo.placename" content="焉耆回族自治县">
<meta name="geo.position" content="42.05;86.57">
<meta name="ICBM" content="42.05, 86.57">
<meta name="twitter:title" content="Gotest · Multi-Industry Website Templates">
<meta name="twitter:description" content="19 carefully designed website templates covering 6 industries. Responsive design, instant preview.">
<link rel="canonical" href="/">
<!-- Structured Data -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebSite",
"name": "Gotest 模板导航",
"description": "多行业网站模板集合,覆盖企业官网、跨境电商、外卖、游戏、应用、音乐 6 大行业",
"name": "Gotest Templates",
"description": "Multi-Industry website templates covering enterprise, e-commerce, food delivery, gaming, app store, and music platforms",
"url": "/",
"potentialAction": {
"@type": "SearchAction",
@@ -40,18 +35,8 @@
}
}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "焉耆青梧映星软件开发工作室",
"url": "/",
"sameAs": []
}
</script>
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><rect width='100' height='100' rx='22' fill='%23000'/><text x='50' y='70' font-size='58' font-weight='bold' fill='white' text-anchor='middle' font-family='Arial'>G</text></svg)">
<script>
// Prevent FOUC: apply theme before render
(function(){
var t = localStorage.getItem('theme') || 'dark';
document.documentElement.setAttribute('data-theme', t);
@@ -63,7 +48,6 @@
[data-theme="dark"]{--bg:#0f0f12;--text:#f5f5f7;--text-sub:#a1a1aa;--card:#1c1c22;--border:rgba(255,255,255,.08);--shadow:0 4px 24px rgba(0,0,0,.3);--shadow-hover:0 12px 40px rgba(0,0,0,.5);--form-bg:rgba(28,28,34,0.95);--input-bg:#27272a;--input-border:#3f3f46;--admin-btn-bg:#f5f5f7;--admin-btn-hover:#fff}
body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}
.wrap{max-width:1120px;margin:0 auto;padding:48px 24px 64px}
/* Hero */
.hero{text-align:center;padding:48px 0 56px}
.hero h1{font-size:56px;font-weight:700;letter-spacing:-2px;line-height:1.1;margin-bottom:16px}
.hero h1 span{background:linear-gradient(90deg,#6366f1,#ec4899,#f59e0b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
@@ -72,13 +56,11 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
.pill{padding:6px 16px;border-radius:100px;background:#fff;border:1px solid var(--border);font-size:13px;color:var(--text-sub);font-weight:500}
[data-theme="dark"] .pill{background:#27272a}
.pill b{color:var(--text)}
/* Section */
.sec{margin-bottom:56px}
.sec-head{display:flex;align-items:baseline;gap:12px;margin-bottom:24px}
.sec-head h2{font-size:28px;font-weight:700;letter-spacing:-.5px}
.sec-head .sub{font-size:14px;color:var(--text-sub)}
.sec-line{flex:1;height:1px;background:var(--border)}
/* Grid */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.item{background:var(--card);border-radius:var(--radius);overflow:hidden;cursor:pointer;transition:all .35s cubic-bezier(.25,.46,.45,.94);text-decoration:none;color:inherit;position:relative;display:block;box-shadow:var(--shadow)}
.item:hover{box-shadow:var(--shadow-hover);transform:translateY(-6px)}
@@ -91,7 +73,6 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
.item-desc{font-size:13px;color:var(--text-sub);line-height:1.4}
.item-go{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.15);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;opacity:0;transform:scale(.8);transition:all .3s}
.item:hover .item-go{opacity:1;transform:scale(1)}
/* Banner gradients */
.g-enterprise .glow{background:linear-gradient(135deg,#1e3a5f 0%,#2563eb 40%,#60a5fa 100%)}
.g-shop .glow{background:linear-gradient(135deg,#991b1b 0%,#ef4444 40%,#fb923c 100%)}
.g-food .glow{background:linear-gradient(135deg,#92400e 0%,#f59e0b 40%,#fde047 100%)}
@@ -100,12 +81,10 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
.g-music .glow{background:linear-gradient(135deg,#312e81 0%,#7c3aed 40%,#f472b6 100%)}
.g-appshow .glow{background:linear-gradient(135deg,#0f766e 0%,#14b8a6 40%,#5eead4 100%)}
.g-bizsys .glow{background:linear-gradient(135deg,#1e3a5f 0%,#3b82f6 40%,#93c5fd 100%)}
/* Admin */
.admin-row{display:flex;justify-content:center;margin-top:56px}
.admin-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 32px;border-radius:100px;background:var(--admin-btn-bg);color:var(--text);text-decoration:none;font-size:15px;font-weight:600;transition:all .25s}
.admin-btn:hover{background:var(--admin-btn-hover);transform:scale(1.03)}
.admin-btn svg{width:18px;height:18px}
/* Theme Toggle */
.theme-toggle{position:fixed;top:24px;right:24px;z-index:100;width:48px;height:48px;border-radius:50%;border:2px solid var(--border);background:var(--card);box-shadow:var(--shadow);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s}
.theme-toggle:hover{transform:scale(1.1);box-shadow:var(--shadow-hover)}
.theme-toggle .icon-sun,.theme-toggle .icon-moon{position:absolute;transition:all .3s;font-size:20px}
@@ -113,15 +92,14 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
.theme-toggle .icon-moon{opacity:1;transform:rotate(0) scale(1)}
[data-theme="dark"] .theme-toggle .icon-sun{opacity:1;transform:rotate(0) scale(1)}
[data-theme="dark"] .theme-toggle .icon-moon{opacity:0;transform:rotate(90deg) scale(.5)}
/* Footer */
/* Lang switcher */
.lang-toggle{position:fixed;top:24px;right:80px;z-index:100;width:48px;height:48px;border-radius:50%;border:2px solid var(--border);background:var(--card);box-shadow:var(--shadow);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s;font-size:13px;font-weight:700;color:var(--text)}
.lang-toggle:hover{transform:scale(1.1);box-shadow:var(--shadow-hover)}
.foot{text-align:center;padding:32px 0 0;color:var(--text-sub);font-size:12px}
/* Responsive - base tablet */
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}}
/* Anim */
.item{animation:up .6s ease both}
.item:nth-child(1){animation-delay:.05s}.item:nth-child(2){animation-delay:.12s}.item:nth-child(3){animation-delay:.19s}
@keyframes up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
/* Consult Section */
.consult-section{max-width:680px;margin:64px auto 0;padding:40px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:24px;box-shadow:0 20px 60px rgba(102,126,234,0.3)}
.consult-header{text-align:center;margin-bottom:32px}
.consult-header h2{font-size:32px;font-weight:700;color:#fff;margin-bottom:8px}
@@ -141,8 +119,6 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
.success-icon{width:64px;height:64px;background:linear-gradient(135deg,#10b981 0%,#059669 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:32px;color:#fff}
.consult-success h3{font-size:24px;font-weight:700;color:var(--text);margin-bottom:8px}
.consult-success p{font-size:16px;color:var(--text-sub)}
/* ===== Mobile Responsive ===== */
@media(max-width:600px){
.wrap{padding:24px 16px 48px}
.hero{padding:24px 0 32px}
@@ -161,6 +137,7 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
.item-desc{font-size:12px}
.item-go{opacity:1;transform:scale(1)}
.theme-toggle{width:40px;height:40px;top:16px;right:16px}
.lang-toggle{width:40px;height:40px;top:16px;right:64px;font-size:11px}
.consult-section{margin:36px 0 0;padding:0;border-radius:0;box-shadow:none;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}
.consult-header{padding:24px 20px 0;margin-bottom:20px}
.consult-header h2{font-size:22px}
@@ -178,92 +155,93 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
</style>
</head>
<body>
<button class="theme-toggle" id="themeToggle" aria-label="切换主题">
<button class="theme-toggle" id="themeToggle" aria-label="Toggle theme">
<span class="icon-sun">☀️</span>
<span class="icon-moon">🌙</span>
</button>
<button class="lang-toggle" id="langToggle" onclick="cycleLang()">EN</button>
<div class="wrap">
<div class="hero">
<h1><span id="s_hero_title">Gotest</span> <span id="s_hero_highlight">模板导航</span></h1>
<p id="s_hero_desc">6 大行业,19 套精心设计的网站模板,一键切换,即刻预览</p>
<h1><span id="s_hero_title">Gotest</span> <span id="s_hero_highlight" data-i18n="hero_highlight">Template Gallery</span></h1>
<p id="s_hero_desc" data-i18n="hero_desc">6 industries, 19 beautifully designed website templates. Switch instantly, preview now</p>
<div class="hero-pills">
<span class="pill"><b id="s_pill_templates">19</b> 套模板</span>
<span class="pill"><b id="s_pill_lines">6</b> 大行业</span>
<span class="pill"><b id="s_pill_per_industry">3</b> 套 / 行业</span>
<span class="pill" id="s_pill_responsive">响应式设计</span>
<span class="pill"><b>19</b> <span data-i18n="pill_templates">Templates</span></span>
<span class="pill"><b>6</b> <span data-i18n="pill_lines">Industries</span></span>
<span class="pill"><b>3</b> <span data-i18n="pill_per">/ Industry</span></span>
<span class="pill" data-i18n="pill_responsive">Responsive</span>
</div>
</div>
<!-- 企业官网 -->
<!-- Enterprise -->
<div class="sec">
<div class="sec-head"><h2 id="s_sec_enterprise_title">企业官网</h2><span class="sub" id="s_sec_enterprise_sub">3 套风格</span><div class="sec-line"></div></div>
<div class="sec-head"><h2 data-i18n="sec_enterprise">Enterprise</h2><span class="sub" data-i18n="sec_enterprise_sub">3 Styles</span><div class="sec-line"></div></div>
<div class="grid">
<a class="item" href="/site1" target="_blank"><div class="item-banner g-enterprise"><div class="glow"></div><div class="pattern"></div><span class="item-tag">科技蓝</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">科技企业 · site1</div><div class="item-desc">现代科技公司风格,蓝色主调</div></div></a>
<a class="item" href="/site2" target="_blank"><div class="item-banner g-enterprise"><div class="glow" style="background:linear-gradient(135deg,#1c1917 0%,#b45309 40%,#fbbf24 100%)"></div><div class="pattern"></div><span class="item-tag">制造金</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">制造企业 · site2</div><div class="item-desc">工业制造风格,深色金调</div></div></a>
<a class="item" href="/site3" target="_blank"><div class="item-banner g-enterprise"><div class="glow" style="background:linear-gradient(135deg,#064e3b 0%,#10b981 40%,#6ee7b7 100%)"></div><div class="pattern"></div><span class="item-tag">咨询绿</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">咨询服务 · site3</div><div class="item-desc">专业咨询风格,绿色清新</div></div></a>
<a class="item" href="/site1" target="_blank"><div class="item-banner g-enterprise"><div class="glow"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_tech_blue">Tech Blue</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">Tech Enterprise · site1</div><div class="item-desc" data-i18n="desc_site1">Modern tech company style, blue theme</div></div></a>
<a class="item" href="/site2" target="_blank"><div class="item-banner g-enterprise"><div class="glow" style="background:linear-gradient(135deg,#1c1917 0%,#b45309 40%,#fbbf24 100%)"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_mfg_gold">Mfg Gold</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">Manufacturing · site2</div><div class="item-desc" data-i18n="desc_site2">Industrial manufacturing style, dark gold</div></div></a>
<a class="item" href="/site3" target="_blank"><div class="item-banner g-enterprise"><div class="glow" style="background:linear-gradient(135deg,#064e3b 0%,#10b981 40%,#6ee7b7 100%)"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_consult_green">Consult Green</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">Consulting · site3</div><div class="item-desc" data-i18n="desc_site3">Professional consulting style, fresh green</div></div></a>
</div>
</div>
<!-- 跨境电商 -->
<!-- E-commerce -->
<div class="sec">
<div class="sec-head"><h2 id="s_sec_shop_title">跨境电商</h2><span class="sub" id="s_sec_shop_sub">4 套风格</span><div class="sec-line"></div></div>
<div class="sec-head"><h2 data-i18n="sec_shop">E-Commerce</h2><span class="sub" data-i18n="sec_shop_sub">4 Styles</span><div class="sec-line"></div></div>
<div class="grid">
<a class="item" href="/shop" target="_blank"><div class="item-banner g-shop"><div class="glow"></div><div class="pattern"></div><span class="item-tag">红色经典</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">经典电商 · shop</div><div class="item-desc">经典电商红,大促风格</div></div></a>
<a class="item" href="/shop2" target="_blank"><div class="item-banner g-shop"><div class="glow" style="background:linear-gradient(135deg,#18181b 0%,#3f3f46 40%,#71717a 100%)"></div><div class="pattern"></div><span class="item-tag">暗黑模式</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">暗黑电商 · shop2</div><div class="item-desc">黑色高端,极简暗色</div></div></a>
<a class="item" href="/shop3" target="_blank"><div class="item-banner g-shop"><div class="glow" style="background:linear-gradient(135deg,#f5f5f0 0%,#d6d3d1 40%,#a8a29e 100%)"></div><div class="pattern" style="opacity:.08"></div><span class="item-tag" style="background:rgba(0,0,0,.1);color:#1c1917;border-color:rgba(0,0,0,.1)">北欧极简</span><div class="item-go" style="color:#1c1917">→</div></div><div class="item-body"><div class="item-title">北欧极简 · shop3</div><div class="item-desc">NORDI 风格,自然柔和</div></div></a>
<a class="item" href="/shop4" target="_blank"><div class="item-banner g-shop"><div class="glow" style="background:linear-gradient(135deg,#0f172a 0%,#1a3a2a 50%,#2d5a1f 100%)"></div><div class="pattern" style="opacity:.06"></div><span class="item-tag">古树生机</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">古树商城 · shop4</div><div class="item-desc">古树壁纸,光追生命力</div></div></a>
<a class="item" href="/shop" target="_blank"><div class="item-banner g-shop"><div class="glow"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_red_classic">Red Classic</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">Classic Shop · shop</div><div class="item-desc" data-i18n="desc_shop">Classic e-commerce red, sale style</div></div></a>
<a class="item" href="/shop2" target="_blank"><div class="item-banner g-shop"><div class="glow" style="background:linear-gradient(135deg,#18181b 0%,#3f3f46 40%,#71717a 100%)"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_dark">Dark Mode</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">Dark Shop · shop2</div><div class="item-desc" data-i18n="desc_shop2">Premium dark, minimalist noir</div></div></a>
<a class="item" href="/shop3" target="_blank"><div class="item-banner g-shop"><div class="glow" style="background:linear-gradient(135deg,#f5f5f0 0%,#d6d3d1 40%,#a8a29e 100%)"></div><div class="pattern" style="opacity:.08"></div><span class="item-tag" style="background:rgba(0,0,0,.1);color:#1c1917;border-color:rgba(0,0,0,.1)" data-i18n="tag_nordic">Nordic</span><div class="item-go" style="color:#1c1917">→</div></div><div class="item-body"><div class="item-title">Nordic · shop3</div><div class="item-desc" data-i18n="desc_shop3">NORDI style, natural and soft</div></div></a>
<a class="item" href="/shop4" target="_blank"><div class="item-banner g-shop"><div class="glow" style="background:linear-gradient(135deg,#0f172a 0%,#1a3a2a 50%,#2d5a1f 100%)"></div><div class="pattern" style="opacity:.06"></div><span class="item-tag" data-i18n="tag_ancient">Ancient Tree</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">Tree Mall · shop4</div><div class="item-desc" data-i18n="desc_shop4">Ancient tree wallpaper, ray-traced vitality</div></div></a>
</div>
</div>
<!-- 外卖平台 -->
<!-- Food Delivery -->
<div class="sec">
<div class="sec-head"><h2 id="s_sec_food_title">外卖平台</h2><span class="sub" id="s_sec_food_sub">3 套风格</span><div class="sec-line"></div></div>
<div class="sec-head"><h2 data-i18n="sec_food">Food Delivery</h2><span class="sub" data-i18n="sec_food_sub">3 Styles</span><div class="sec-line"></div></div>
<div class="grid">
<a class="item" href="/food1" target="_blank"><div class="item-banner g-food"><div class="glow"></div><div class="pattern"></div><span class="item-tag">橙黄活力</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">美味达 · food1</div><div class="item-desc">暖橙食欲风格,活力满满</div></div></a>
<a class="item" href="/food2" target="_blank"><div class="item-banner g-food"><div class="glow" style="background:linear-gradient(135deg,#18181b 0%,#44403c 40%,#78716c 100%)"></div><div class="pattern"></div><span class="item-tag">深色模式</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">GOURMET · food2</div><div class="item-desc">暗色高端外卖平台</div></div></a>
<a class="item" href="/food3" target="_blank"><div class="item-banner g-food"><div class="glow" style="background:linear-gradient(135deg,#14532d 0%,#22c55e 40%,#86efac 100%)"></div><div class="pattern"></div><span class="item-tag">清新自然</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">绿野鲜送 · food3</div><div class="item-desc">绿色健康,清新自然</div></div></a>
<a class="item" href="/food1" target="_blank"><div class="item-banner g-food"><div class="glow"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_orange">Orange Energy</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">YummyGo · food1</div><div class="item-desc" data-i18n="desc_food1">Warm orange appetite style</div></div></a>
<a class="item" href="/food2" target="_blank"><div class="item-banner g-food"><div class="glow" style="background:linear-gradient(135deg,#18181b 0%,#44403c 40%,#78716c 100%)"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_dark_mode">Dark Mode</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">GOURMET · food2</div><div class="item-desc" data-i18n="desc_food2">Premium dark food platform</div></div></a>
<a class="item" href="/food3" target="_blank"><div class="item-banner g-food"><div class="glow" style="background:linear-gradient(135deg,#14532d 0%,#22c55e 40%,#86efac 100%)"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_fresh">Fresh Natural</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">GreenFresh · food3</div><div class="item-desc" data-i18n="desc_food3">Green and healthy, fresh natural</div></div></a>
</div>
</div>
<!-- 游戏平台 -->
<!-- Gaming -->
<div class="sec">
<div class="sec-head"><h2 id="s_sec_game_title">游戏平台</h2><span class="sub" id="s_sec_game_sub">3 套风格</span><div class="sec-line"></div></div>
<div class="sec-head"><h2 data-i18n="sec_game">Gaming</h2><span class="sub" data-i18n="sec_game_sub">3 Styles</span><div class="sec-line"></div></div>
<div class="grid">
<a class="item" href="/game1" target="_blank"><div class="item-banner g-game"><div class="glow"></div><div class="pattern"></div><span class="item-tag">赛博朋克</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">NEON ARCADE · game1</div><div class="item-desc">霓虹未来,赛博朋克风格</div></div></a>
<a class="item" href="/game2" target="_blank"><div class="item-banner g-game"><div class="glow" style="background:linear-gradient(135deg,#052e16 0%,#16a34a 40%,#4ade80 100%)"></div><div class="pattern"></div><span class="item-tag">像素复古</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">PIXEL GAMES · game2</div><div class="item-desc">8-bit 像素复古游戏风</div></div></a>
<a class="item" href="/game3" target="_blank"><div class="item-banner g-game"><div class="glow" style="background:linear-gradient(135deg,#083344 0%,#06b6d4 40%,#67e8f9 100%)"></div><div class="pattern"></div><span class="item-tag">云游戏</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">云游平台 · game3</div><div class="item-desc">流线科技,云游戏风格</div></div></a>
<a class="item" href="/game1" target="_blank"><div class="item-banner g-game"><div class="glow"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_cyber">Cyberpunk</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">NEON ARCADE · game1</div><div class="item-desc" data-i18n="desc_game1">Neon future, cyberpunk style</div></div></a>
<a class="item" href="/game2" target="_blank"><div class="item-banner g-game"><div class="glow" style="background:linear-gradient(135deg,#052e16 0%,#16a34a 40%,#4ade80 100%)"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_pixel">Pixel Retro</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">PIXEL GAMES · game2</div><div class="item-desc" data-i18n="desc_game2">8-bit pixel retro gaming</div></div></a>
<a class="item" href="/game3" target="_blank"><div class="item-banner g-game"><div class="glow" style="background:linear-gradient(135deg,#083344 0%,#06b6d4 40%,#67e8f9 100%)"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_cloud">Cloud Gaming</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">CloudPlay · game3</div><div class="item-desc" data-i18n="desc_game3">Streamlined tech, cloud gaming</div></div></a>
</div>
</div>
<!-- 应用商店 -->
<!-- App Store -->
<div class="sec">
<div class="sec-head"><h2 id="s_sec_app_title">应用商店</h2><span class="sub" id="s_sec_app_sub">3 套风格</span><div class="sec-line"></div></div>
<div class="sec-head"><h2 data-i18n="sec_app">App Store</h2><span class="sub" data-i18n="sec_app_sub">3 Styles</span><div class="sec-line"></div></div>
<div class="grid">
<a class="item" href="/app1" target="_blank"><div class="item-banner g-app"><div class="glow" style="background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 40%,#cbd5e1 100%)"></div><div class="pattern" style="opacity:.06"></div><span class="item-tag" style="background:rgba(0,0,0,.08);color:#1e293b;border-color:rgba(0,0,0,.08)">极简白</span><div class="item-go" style="color:#1e293b">→</div></div><div class="item-body"><div class="item-title">极简白 · app1</div><div class="item-desc">Apple 风格,简洁清爽</div></div></a>
<a class="item" href="/app2" target="_blank"><div class="item-banner g-app"><div class="glow" style="background:linear-gradient(135deg,#052e16 0%,#10b981 40%,#34d399 100%)"></div><div class="pattern"></div><span class="item-tag">暗黑模式</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">暗黑应用 · app2</div><div class="item-desc">霓虹绿暗色,科技感十足</div></div></a>
<a class="item" href="/app3" target="_blank"><div class="item-banner g-app"><div class="glow"></div><div class="pattern"></div><span class="item-tag">清新蓝</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">清新蓝 · app3</div><div class="item-desc">明亮配色,活泼现代</div></div></a>
<a class="item" href="/app1" target="_blank"><div class="item-banner g-app"><div class="glow" style="background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 40%,#cbd5e1 100%)"></div><div class="pattern" style="opacity:.06"></div><span class="item-tag" style="background:rgba(0,0,0,.08);color:#1e293b;border-color:rgba(0,0,0,.08)" data-i18n="tag_minimal">Minimal White</span><div class="item-go" style="color:#1e293b">→</div></div><div class="item-body"><div class="item-title">Minimal · app1</div><div class="item-desc" data-i18n="desc_app1">Apple style, clean and simple</div></div></a>
<a class="item" href="/app2" target="_blank"><div class="item-banner g-app"><div class="glow" style="background:linear-gradient(135deg,#052e16 0%,#10b981 40%,#34d399 100%)"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_dark_neon">Dark Neon</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">APP HUB · app2</div><div class="item-desc" data-i18n="desc_app2">Neon green dark, high-tech</div></div></a>
<a class="item" href="/app3" target="_blank"><div class="item-banner g-app"><div class="glow"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_fresh_blue">Fresh Blue</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">Fresh Blue · app3</div><div class="item-desc" data-i18n="desc_app3">Bright colors, lively modern</div></div></a>
</div>
</div>
<!-- 音乐平台 -->
<!-- Music -->
<div class="sec">
<div class="sec-head"><h2 id="s_sec_music_title">音乐平台</h2><span class="sub" id="s_sec_music_sub">3 套风格</span><div class="sec-line"></div></div>
<div class="sec-head"><h2 data-i18n="sec_music">Music</h2><span class="sub" data-i18n="sec_music_sub">3 Styles</span><div class="sec-line"></div></div>
<div class="grid">
<a class="item" href="/music1" target="_blank"><div class="item-banner g-music"><div class="glow" style="background:linear-gradient(135deg,#1e1b4b 0%,#4f46e5 40%,#818cf8 100%)"></div><div class="pattern"></div><span class="item-tag">暗黑播放器</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">云音 Music · music1</div><div class="item-desc">暗夜沉浸式音乐播放器</div></div></a>
<a class="item" href="/music2" target="_blank"><div class="item-banner g-music"><div class="glow" style="background:linear-gradient(135deg,#451a03 0%,#92400e 40%,#d97706 100%)"></div><div class="pattern"></div><span class="item-tag">黑胶复古</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">Vinyl · music2</div><div class="item-desc">黑胶唱片复古风格</div></div></a>
<a class="item" href="/music3" target="_blank"><div class="item-banner g-music"><div class="glow"></div><div class="pattern"></div><span class="item-tag">渐变流媒体</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">流媒体 · music3</div><div class="item-desc">紫粉渐变,现代流媒体</div></div></a>
<a class="item" href="/music1" target="_blank"><div class="item-banner g-music"><div class="glow" style="background:linear-gradient(135deg,#1e1b4b 0%,#4f46e5 40%,#818cf8 100%)"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_dark_player">Dark Player</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">CloudMusic · music1</div><div class="item-desc" data-i18n="desc_music1">Dark immersive music player</div></div></a>
<a class="item" href="/music2" target="_blank"><div class="item-banner g-music"><div class="glow" style="background:linear-gradient(135deg,#451a03 0%,#92400e 40%,#d97706 100%)"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_vinyl">Vinyl Retro</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">Vinyl · music2</div><div class="item-desc" data-i18n="desc_music2">Vinyl record retro style</div></div></a>
<a class="item" href="/music3" target="_blank"><div class="item-banner g-music"><div class="glow"></div><div class="pattern"></div><span class="item-tag" data-i18n="tag_gradient">Gradient Stream</span><div class="item-go">→</div></div><div class="item-body"><div class="item-title">Stream · music3</div><div class="item-desc" data-i18n="desc_music3">Purple-pink gradient, modern streaming</div></div></a>
</div>
</div>
<!-- App 候选码 -->
<!-- App Showcase -->
<div class="sec" id="sec-apps" style="display:none">
<div class="sec-head"><h2 id="s_sec_appshow_title">App 候选码</h2><span class="sub" id="s_sec_appshow_sub">精选应用</span><div class="sec-line"></div></div>
<div class="sec-head"><h2 data-i18n="sec_appshow">App Showcase</h2><span class="sub" data-i18n="sec_appshow_sub">Featured Apps</span><div class="sec-line"></div></div>
<div class="grid" id="appShowGrid"></div>
</div>
<!-- 业务系统 -->
<!-- Biz Systems -->
<div class="sec" id="sec-systems" style="display:none">
<div class="sec-head"><h2 id="s_sec_bizsys_title">业务系统</h2><span class="sub" id="s_sec_bizsys_sub">定制 / 年付</span><div class="sec-line"></div></div>
<div class="sec-head"><h2 data-i18n="sec_bizsys">Business Systems</h2><span class="sub" data-i18n="sec_bizsys_sub">Custom / Annual</span><div class="sec-line"></div></div>
<div class="grid" id="bizSysGrid"></div>
</div>
@@ -271,58 +249,345 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
<div class="admin-row">
<a class="admin-btn" href="/admin">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
管理后台
<span data-i18n="admin_btn">Admin Panel</span>
</a>
</div>
<!-- 客户咨询表单 -->
<!-- Consultation Form -->
<div class="consult-section">
<div class="consult-header">
<h2 id="s_consult_title">需要定制网站?</h2>
<p id="s_consult_desc">只需几百块,即可拥有同款精美站点!留下您的信息,我们尽快联系您</p>
<h2 data-i18n="consult_title">Need a Custom Website?</h2>
<p data-i18n="consult_desc">Get a beautiful site like these for just a few hundred! Leave your info and we'll contact you soon</p>
</div>
<form class="consult-form" id="consultForm">
<div class="form-row">
<div class="form-group">
<label for="name">姓名 *</label>
<input type="text" id="name" name="name" placeholder="请输入您的姓名" required>
<label for="name" data-i18n="label_name">Name *</label>
<input type="text" id="name" name="name" data-i18n-placeholder="ph_name" placeholder="Your name" required>
</div>
<div class="form-group">
<label for="phone">联系电话 *</label>
<input type="tel" id="phone" name="phone" placeholder="请输入您的手机号" required>
<label for="phone" data-i18n="label_phone">Phone *</label>
<input type="tel" id="phone" name="phone" data-i18n-placeholder="ph_phone" placeholder="Your phone number" required>
</div>
</div>
<div class="form-row">
<div class="form-group">
<label for="company">公司名称</label>
<input type="text" id="company" name="company" placeholder="请输入公司名称(选填)">
<label for="company" data-i18n="label_company">Company</label>
<input type="text" id="company" name="company" data-i18n-placeholder="ph_company" placeholder="Company name (optional)">
</div>
<div class="form-group">
<label for="email">邮箱</label>
<input type="email" id="email" name="email" placeholder="请输入邮箱(选填)">
<label for="email" data-i18n="label_email">Email</label>
<input type="email" id="email" name="email" data-i18n-placeholder="ph_email" placeholder="Email (optional)">
</div>
</div>
<div class="form-group">
<label for="needs">需求描述 *</label>
<textarea id="needs" name="needs" rows="4" placeholder="请描述您的需求,比如:想要一个企业官网,类似科技风格..." required></textarea>
<label for="needs" data-i18n="label_needs">Requirements *</label>
<textarea id="needs" name="needs" rows="4" data-i18n-placeholder="ph_needs" placeholder="Describe your needs, e.g.: I want a tech-style enterprise website..." required></textarea>
</div>
<button type="submit" class="submit-btn" id="submitBtn">
<span class="btn-text">立即咨询</span>
<span class="btn-loading" style="display:none">提交中...</span>
<span class="btn-text" data-i18n="btn_submit">Submit Inquiry</span>
<span class="btn-loading" style="display:none" data-i18n="btn_loading">Submitting...</span>
</button>
</form>
<div class="consult-success" id="consultSuccess" style="display:none">
<div class="success-icon">✓</div>
<h3 id="s_consult_success">提交成功!</h3>
<p>我们会尽快联系您,请保持电话畅通</p>
<h3 data-i18n="consult_success">Submitted!</h3>
<p data-i18n="consult_success_desc">We'll contact you soon. Please keep your phone available</p>
</div>
</div>
<div class="foot" id="s_footer">Gotest · 多行业网站模板集合 · 点击卡片进入对应模板</div>
<div class="foot" data-i18n="footer">Gotest · Multi-Industry Website Templates · Click a card to preview</div>
<div class="foot" id="s_company" style="margin-top:4px;font-size:11px;opacity:.6"></div>
</div>
<script>
/* =========================================================
i18n Engine
========================================================= */
var I18N_NAV = {
'en': {
hero_highlight: 'Template Gallery',
hero_desc: '6 industries, 19 beautifully designed website templates. Switch instantly, preview now',
pill_templates: 'Templates',
pill_lines: 'Industries',
pill_per: '/ Industry',
pill_responsive: 'Responsive',
sec_enterprise: 'Enterprise',
sec_enterprise_sub: '3 Styles',
sec_shop: 'E-Commerce',
sec_shop_sub: '4 Styles',
sec_food: 'Food Delivery',
sec_food_sub: '3 Styles',
sec_game: 'Gaming',
sec_game_sub: '3 Styles',
sec_app: 'App Store',
sec_app_sub: '3 Styles',
sec_music: 'Music',
sec_music_sub: '3 Styles',
sec_appshow: 'App Showcase',
sec_appshow_sub: 'Featured Apps',
sec_bizsys: 'Business Systems',
sec_bizsys_sub: 'Custom / Annual',
admin_btn: 'Admin Panel',
consult_title: 'Need a Custom Website?',
consult_desc: 'Get a beautiful site like these for just a few hundred! Leave your info and we\'ll contact you soon',
label_name: 'Name *',
label_phone: 'Phone *',
label_company: 'Company',
label_email: 'Email',
label_needs: 'Requirements *',
ph_name: 'Your name',
ph_phone: 'Your phone number',
ph_company: 'Company name (optional)',
ph_email: 'Email (optional)',
ph_needs: 'Describe your needs, e.g.: I want a tech-style enterprise website...',
btn_submit: 'Submit Inquiry',
btn_loading: 'Submitting...',
consult_success: 'Submitted!',
consult_success_desc: 'We\'ll contact you soon. Please keep your phone available',
footer: 'Gotest · Multi-Industry Website Templates · Click a card to preview',
tag_tech_blue: 'Tech Blue',
tag_mfg_gold: 'Mfg Gold',
tag_consult_green: 'Consult Green',
tag_red_classic: 'Red Classic',
tag_dark: 'Dark Mode',
tag_nordic: 'Nordic',
tag_ancient: 'Ancient Tree',
tag_orange: 'Orange Energy',
tag_dark_mode: 'Dark Mode',
tag_fresh: 'Fresh Natural',
tag_cyber: 'Cyberpunk',
tag_pixel: 'Pixel Retro',
tag_cloud: 'Cloud Gaming',
tag_minimal: 'Minimal White',
tag_dark_neon: 'Dark Neon',
tag_fresh_blue: 'Fresh Blue',
tag_dark_player: 'Dark Player',
tag_vinyl: 'Vinyl Retro',
tag_gradient: 'Gradient Stream',
desc_site1: 'Modern tech company style, blue theme',
desc_site2: 'Industrial manufacturing style, dark gold',
desc_site3: 'Professional consulting style, fresh green',
desc_shop: 'Classic e-commerce red, sale style',
desc_shop2: 'Premium dark, minimalist noir',
desc_shop3: 'NORDI style, natural and soft',
desc_shop4: 'Ancient tree wallpaper, ray-traced vitality',
desc_food1: 'Warm orange appetite style',
desc_food2: 'Premium dark food platform',
desc_food3: 'Green and healthy, fresh natural',
desc_game1: 'Neon future, cyberpunk style',
desc_game2: '8-bit pixel retro gaming',
desc_game3: 'Streamlined tech, cloud gaming',
desc_app1: 'Apple style, clean and simple',
desc_app2: 'Neon green dark, high-tech',
desc_app3: 'Bright colors, lively modern',
desc_music1: 'Dark immersive music player',
desc_music2: 'Vinyl record retro style',
desc_music3: 'Purple-pink gradient, modern streaming',
err_submit: 'Submission failed, please try again later',
err_network: 'Network error, please try again later'
},
'zh-CN': {
hero_highlight: '模板导航',
hero_desc: '6 大行业,19 套精心设计的网站模板,一键切换,即刻预览',
pill_templates: '套模板',
pill_lines: '大行业',
pill_per: '套 / 行业',
pill_responsive: '响应式设计',
sec_enterprise: '企业官网',
sec_enterprise_sub: '3 套风格',
sec_shop: '跨境电商',
sec_shop_sub: '4 套风格',
sec_food: '外卖平台',
sec_food_sub: '3 套风格',
sec_game: '游戏平台',
sec_game_sub: '3 套风格',
sec_app: '应用商店',
sec_app_sub: '3 套风格',
sec_music: '音乐平台',
sec_music_sub: '3 套风格',
sec_appshow: 'App 候选码',
sec_appshow_sub: '精选应用',
sec_bizsys: '业务系统',
sec_bizsys_sub: '定制 / 年付',
admin_btn: '管理后台',
consult_title: '需要定制网站?',
consult_desc: '只需几百块,即可拥有同款精美站点!留下您的信息,我们尽快联系您',
label_name: '姓名 *',
label_phone: '联系电话 *',
label_company: '公司名称',
label_email: '邮箱',
label_needs: '需求描述 *',
ph_name: '请输入您的姓名',
ph_phone: '请输入您的手机号',
ph_company: '请输入公司名称(选填)',
ph_email: '请输入邮箱(选填)',
ph_needs: '请描述您的需求,比如:想要一个企业官网,类似科技风格...',
btn_submit: '立即咨询',
btn_loading: '提交中...',
consult_success: '提交成功!',
consult_success_desc: '我们会尽快联系您,请保持电话畅通',
footer: 'Gotest · 多行业网站模板集合 · 点击卡片进入对应模板',
tag_tech_blue: '科技蓝',
tag_mfg_gold: '制造金',
tag_consult_green: '咨询绿',
tag_red_classic: '红色经典',
tag_dark: '暗黑模式',
tag_nordic: '北欧极简',
tag_ancient: '古树生机',
tag_orange: '橙黄活力',
tag_dark_mode: '深色模式',
tag_fresh: '清新自然',
tag_cyber: '赛博朋克',
tag_pixel: '像素复古',
tag_cloud: '云游戏',
tag_minimal: '极简白',
tag_dark_neon: '暗黑模式',
tag_fresh_blue: '清新蓝',
tag_dark_player: '暗黑播放器',
tag_vinyl: '黑胶复古',
tag_gradient: '渐变流媒体',
desc_site1: '现代科技公司风格,蓝色主调',
desc_site2: '工业制造风格,深色金调',
desc_site3: '专业咨询风格,绿色清新',
desc_shop: '经典电商红,大促风格',
desc_shop2: '黑色高端,极简暗色',
desc_shop3: 'NORDI 风格,自然柔和',
desc_shop4: '古树壁纸,光追生命力',
desc_food1: '暖橙食欲风格,活力满满',
desc_food2: '暗色高端外卖平台',
desc_food3: '绿色健康,清新自然',
desc_game1: '霓虹未来,赛博朋克风格',
desc_game2: '8-bit 像素复古游戏风',
desc_game3: '流线科技,云游戏风格',
desc_app1: 'Apple 风格,简洁清爽',
desc_app2: '霓虹绿暗色,科技感十足',
desc_app3: '明亮配色,活泼现代',
desc_music1: '暗夜沉浸式音乐播放器',
desc_music2: '黑胶唱片复古风格',
desc_music3: '紫粉渐变,现代流媒体',
err_submit: '提交失败,请稍后重试',
err_network: '网络错误,请稍后重试'
},
'zh-TW': {
hero_highlight: '模板導航',
hero_desc: '6 大行業,19 套精心設計的網站模板,一切換,即刻預覽',
pill_templates: '套模板',
pill_lines: '大行業',
pill_per: '套 / 行業',
pill_responsive: '響應式設計',
sec_enterprise: '企業官網',
sec_enterprise_sub: '3 套風格',
sec_shop: '跨境電商',
sec_shop_sub: '4 套風格',
sec_food: '外賣平台',
sec_food_sub: '3 套風格',
sec_game: '遊戲平台',
sec_game_sub: '3 套風格',
sec_app: '應用商店',
sec_app_sub: '3 套風格',
sec_music: '音樂平台',
sec_music_sub: '3 套風格',
sec_appshow: 'App 候選碼',
sec_appshow_sub: '精選應用',
sec_bizsys: '業務系統',
sec_bizsys_sub: '定制 / 年付',
admin_btn: '管理後台',
consult_title: '需要定制網站?',
consult_desc: '只需幾百塊,即可擁有同款精美站點!留下您的資訊,我們盡快聯繫您',
label_name: '姓名 *',
label_phone: '聯繫電話 *',
label_company: '公司名稱',
label_email: '信箱',
label_needs: '需求描述 *',
ph_name: '請輸入您的姓名',
ph_phone: '請輸入您的手機號',
ph_company: '請輸入公司名稱(選填)',
ph_email: '請輸入信箱(選填)',
ph_needs: '請描述您的需求,比如:想要一個企業官網,類似科技風格...',
btn_submit: '立即諮詢',
btn_loading: '提交中...',
consult_success: '提交成功!',
consult_success_desc: '我們會盡快聯繫您,請保持電話暢通',
footer: 'Gotest · 多行業網站模板集合 · 點擊卡片進入對應模板',
tag_tech_blue: '科技藍',
tag_mfg_gold: '製造金',
tag_consult_green: '諮詢綠',
tag_red_classic: '紅色經典',
tag_dark: '暗黑模式',
tag_nordic: '北歐極簡',
tag_ancient: '古樹生機',
tag_orange: '橙黃活力',
tag_dark_mode: '深色模式',
tag_fresh: '清新自然',
tag_cyber: '賽博朋克',
tag_pixel: '像素復古',
tag_cloud: '雲遊戲',
tag_minimal: '極簡白',
tag_dark_neon: '暗黑模式',
tag_fresh_blue: '清新藍',
tag_dark_player: '暗黑播放器',
tag_vinyl: '黑膠復古',
tag_gradient: '漸變流媒體',
desc_site1: '現代科技公司風格,藍色主調',
desc_site2: '工業製造風格,深色金調',
desc_site3: '專業諮詢風格,綠色清新',
desc_shop: '經典電商紅,大促風格',
desc_shop2: '黑色高端,極簡暗色',
desc_shop3: 'NORDI 風格,自然柔和',
desc_shop4: '古樹壁紙,光追生命力',
desc_food1: '暖橙食慾風格,活力滿滿',
desc_food2: '暗色高端外賣平台',
desc_food3: '綠色健康,清新自然',
desc_game1: '霓虹未來,賽博朋克風格',
desc_game2: '8-bit 像素復古遊戲風',
desc_game3: '流線科技,雲遊戲風格',
desc_app1: 'Apple 風格,簡潔清爽',
desc_app2: '霓虹綠暗色,科技感十足',
desc_app3: '明亮配色,活潑現代',
desc_music1: '暗夜沉浸式音樂播放器',
desc_music2: '黑膠唱片復古風格',
desc_music3: '紫粉漸變,現代流媒體',
err_submit: '提交失敗,請稍後重試',
err_network: '網路錯誤,請稍後重試'
}
};
var currentLang = (function(){
try{
var u=new URLSearchParams(location.search).get('lang');
if(u&&I18N_NAV[u]) return u;
}catch(e){}
try{var s=localStorage.getItem('nav_lang');if(s&&I18N_NAV[s]) return s;}catch(e){}
var b=navigator.language||navigator.userLanguage||'';
if(b.startsWith('zh-TW')||b.startsWith('zh-Hant')) return 'zh-TW';
if(b.startsWith('zh')) return 'zh-CN';
return 'en';
})();
function tNav(key){return (I18N_NAV[currentLang]&&I18N_NAV[currentLang][key])||(I18N_NAV['en'][key])||key;}
function applyNavI18n(){
document.querySelectorAll('[data-i18n]').forEach(function(el){
var key=el.getAttribute('data-i18n');
el.textContent=tNav(key);
});
document.querySelectorAll('[data-i18n-placeholder]').forEach(function(el){
var key=el.getAttribute('data-i18n-placeholder');
el.placeholder=tNav(key);
});
document.documentElement.lang=currentLang==='zh-TW'?'zh-TW':currentLang==='zh-CN'?'zh-CN':'en';
document.getElementById('langToggle').textContent={'zh-CN':'中','en':'EN','zh-TW':'繁'}[currentLang]||'EN';
}
function cycleLang(){
var langs=['en','zh-CN','zh-TW'];
var idx=langs.indexOf(currentLang);
currentLang=langs[(idx+1)%langs.length];
try{localStorage.setItem('nav_lang',currentLang);}catch(e){}
applyNavI18n();
}
// Theme toggle
(function(){
var toggle = document.getElementById('themeToggle');
@@ -334,7 +599,7 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
});
})();
// 加载后台配置,覆盖默认文案
// Load nav settings from backend
(async function(){
try {
var resp = await fetch('/api/v1/nav-settings');
@@ -345,10 +610,6 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
s_hero_title: 'nav_hero_title',
s_hero_highlight: 'nav_hero_highlight',
s_hero_desc: 'nav_hero_desc',
s_pill_templates: 'nav_pill_templates',
s_pill_lines: 'nav_pill_lines',
s_pill_per_industry: 'nav_pill_per_industry',
s_pill_responsive: 'nav_pill_responsive',
s_consult_title: 'nav_consult_title',
s_consult_desc: 'nav_consult_desc',
s_consult_success: 'nav_consult_success',
@@ -381,7 +642,7 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
} catch(e) {}
})();
// 加载 App 候选码
// Load App Showcase
(async function(){
try {
var resp = await fetch('/api/v1/showcase/apps');
@@ -401,7 +662,7 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
} catch(e) {}
})();
// 加载业务系统
// Load Biz Systems
(async function(){
try {
var resp = await fetch('/api/v1/showcase/systems');
@@ -412,10 +673,10 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
var gradients = ['#1e3a5f,#3b82f6,#93c5fd','#0f766e,#14b8a6,#5eead4','#7c2d12,#ea580c,#fdba74','#581c87,#9333ea,#d8b4fe','#065f46,#10b981,#6ee7b7'];
grid.innerHTML = items.map(function(item, i) {
var g = gradients[i % gradients.length].split(',');
var priceLabel = item.price_type === '定制' ? '定制开发' : (item.price || '咨询报价');
var priceLabel = item.price_type === 'custom' ? 'Custom Dev' : (item.price || 'Contact');
return '<div class="item">' +
'<div class="item-banner g-bizsys"><div class="glow" style="background:linear-gradient(135deg,' + g[0] + ' 0%,' + g[1] + ' 40%,' + g[2] + ' 100%)"></div><div class="pattern"></div>' +
'<span class="item-tag">' + (item.category || '系统') + '</span><div class="item-go">\u2192</div></div>' +
'<span class="item-tag">' + (item.category || 'System') + '</span><div class="item-go">\u2192</div></div>' +
'<div class="item-body"><div class="item-title">' + item.name + '</div><div class="item-desc">' + (item.description || '') + '</div>' +
'<div style="margin-top:8px"><span style="display:inline-block;padding:3px 10px;border-radius:6px;font-size:12px;font-weight:600;background:rgba(59,130,246,0.1);color:#3b82f6">' + priceLabel + '</span></div></div></div>';
}).join('');
@@ -423,51 +684,49 @@ body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',Ro
} catch(e) {}
})();
// Consult form
document.getElementById('consultForm').addEventListener('submit', async function(e) {
e.preventDefault();
const submitBtn = document.getElementById('submitBtn');
const btnText = submitBtn.querySelector('.btn-text');
const btnLoading = submitBtn.querySelector('.btn-loading');
var submitBtn = document.getElementById('submitBtn');
var btnText = submitBtn.querySelector('.btn-text');
var btnLoading = submitBtn.querySelector('.btn-loading');
btnText.style.display = 'none';
btnLoading.style.display = 'inline';
submitBtn.disabled = true;
const formData = {
var formData = {
name: document.getElementById('name').value,
phone: document.getElementById('phone').value,
company: document.getElementById('company').value,
email: document.getElementById('email').value,
needs: document.getElementById('needs').value
};
try {
const response = await fetch('/api/v1/customer/submit', {
var response = await fetch('/api/v1/customer/submit', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(formData)
});
const result = await response.json();
var result = await response.json();
if (result.code === 0) {
document.getElementById('consultForm').style.display = 'none';
document.getElementById('consultSuccess').style.display = 'block';
} else {
alert(result.message || '提交失败,请稍后重试');
alert(result.message || tNav('err_submit'));
btnText.style.display = 'inline';
btnLoading.style.display = 'none';
submitBtn.disabled = false;
}
} catch (error) {
console.error('提交失败:', error);
alert('网络错误,请稍后重试');
console.error('Submit error:', error);
alert(tNav('err_network'));
btnText.style.display = 'inline';
btnLoading.style.display = 'none';
submitBtn.disabled = false;
}
});
// Init
applyNavI18n();
</script>
</body>
</html>