Revamp website to '成长星路' skill-tree landing (HTML/CSS/JS + README)

website/README.md

@@ -1,6 +1,6 @@
-# 天启算力管理平台 - 官网
+# 天启智教 · 成长星路官网
 
-这是天启算力管理平台的官方网站，采用纯 HTML/CSS/JavaScript 开发，具有科技感的视觉设计。
+这是天启智教的静态官网页面，采用纯 HTML/CSS/JavaScript 实现，用于展示“成长星路”风格的导航与功能板块。
 
 ## 📁 目录结构
 
@@ -18,10 +18,10 @@ website/
 
 ## 🎨 设计特点
 
-- **科技风格**: 采用深色主题，配合青色和紫色的渐变效果
-- **响应式设计**: 完美适配桌面端、平板和移动设备
-- **动画效果**: 丰富的交互动画和过渡效果
-- **无依赖**: 纯原生开发，无需任何前端框架
+- **星空主题**: 采用蓝绿渐变与星空背景，突出“职业星路”的视觉意象
+- **板块化内容**: 成长星路、作品广场、灵感创作、实训平台、课程中心、技能评定、赛事专题、就业服务
+- **轻量交互**: 平滑滚动与导航高亮，保持页面简洁与连贯性
+- **无依赖**: 纯原生开发，无需前端框架
 
 ## 🚀 快速开始
 
@@ -51,53 +51,42 @@ php -S localhost:8000 -t website
 
 ### 主页 (index.html)
 
-- **导航栏**: 固定顶部，支持滚动效果和移动端菜单
-- **主视觉区**: 产品介绍、核心价值和统计数据
-- **核心功能**: 6 大核心功能模块展示
-- **技术架构**: 前端、后端技术栈可视化展示
-- **应用场景**: 6 大应用场景介绍
-- **快速部署**: Docker、Kubernetes、本地开发三种部署方式
-- **CTA 区域**: 引导用户开始使用
-- **页脚**: 链接和版权信息
+- **导航栏**: 固定顶部，提供各功能板块入口
+- **主视觉区**: 成长星路引导语与 CTA
+- **功能板块**: 成长星路 / 作品广场 / 灵感创作 / 实训平台 / 课程中心 / 技能评定 / 赛事专题 / 就业服务
+- **CTA 区域**: 登录 / 试用引导
+- **页脚**: 快速入口与咨询链接
 
 ## 🎯 主要功能
 
 ### 交互功能
 
 - ✅ 平滑滚动导航
-- ✅ 移动端响应式菜单
-- ✅ 数字动画计数
-- ✅ 标签页切换
-- ✅ 代码复制功能
-- ✅ 滚动到顶部按钮
-- ✅ 卡片悬浮效果
-- ✅ 键盘快捷键支持
-
-### 动画效果
-
-- ✅ 背景粒子动画
-- ✅ 网格背景动画
-- ✅ GPU 卡片 3D 旋转
-- ✅ 渐入动画
-- ✅ 悬浮效果
+- ✅ 导航高亮提示当前浏览板块
+
+### 视觉效果
+
+- ✅ 星空背景与渐变氛围
+- ✅ 卡片式板块布局
+- ✅ 响应式自适应布局
 
 ## 🎨 颜色主题
 
 ```css
---primary-color: #00f0ff;     /* 主色调：青色 */
---secondary-color: #7b2cbf;   /* 辅助色：紫色 */
---bg-primary: #0a0e27;        /* 主背景 */
---bg-secondary: #141832;      /* 次背景 */
---text-primary: #ffffff;      /* 主文字 */
---text-secondary: #a0aec0;    /* 次文字 */
+--bg-dark: #0a3a7a;
+--bg-light: #41d6c3;
+--card-bg: rgba(7, 20, 53, 0.7);
+--card-border: rgba(72, 220, 212, 0.3);
+--text-primary: #f5f9ff;
+--text-muted: #b7d3ff;
+--accent: #51ff91;
+--accent-2: #3bd6ff;
 ```
 
 ## 📱 响应式断点
 
-- **桌面端**: > 1024px
-- **平板端**: 768px - 1024px
-- **移动端**: < 768px
-- **小屏移动端**: < 480px
+- **桌面端**: > 960px
+- **移动端**: <= 960px（导航栏折叠）
 
 ## 🔧 自定义配置
 
@@ -107,8 +96,8 @@ php -S localhost:8000 -t website
 
 ```css
 :root {
-    --primary-color: #00f0ff;  /* 修改为你喜欢的颜色 */
-    /* ... */
+  --accent: #51ff91; /* 修改为你喜欢的强调色 */
+  /* ... */
 }
 ```
 
@@ -147,37 +136,13 @@ server {
         try_files $uri $uri/ /index.html;
     }
 
-    # 缓存静态资源
     location ~* \.(css|js|png|jpg|jpeg|gif|ico|svg)$ {
         expires 1y;
         add_header Cache-Control "public, immutable";
     }
 }
 ```
 
-## 📊 性能优化
-
-- ✅ 最小化 HTTP 请求
-- ✅ CSS 和 JavaScript 压缩（生产环境）
-- ✅ 图片懒加载（可添加）
-- ✅ 浏览器缓存
-- ✅ CDN 加速（可选）
-
-## 🛠️ 开发建议
-
-### 添加新页面
-
-1. 在 `website/` 目录下创建新的 HTML 文件
-2. 复制 `index.html` 的基本结构
-3. 修改内容和样式
-4. 在导航栏中添加链接
-
-### 添加新功能
-
-1. 在 `js/main.js` 中添加新的 JavaScript 代码
-2. 在 `css/style.css` 中添加对应的样式
-3. 在 `index.html` 中添加相应的 HTML 结构
-
 ## 📄 许可证
 
 MIT License