feat: 完成navbar隐藏优化和侧边栏冻结功能

- 优化navbar滚动隐藏逻辑，更敏感响应
- 添加返回顶部按钮，固定在右下角
- 实现profile页面侧边栏真正冻结效果
- 修复首页滑动指示器位置
- 优化整体布局确保首屏内容完整显示

README.md

@@ -1,36 +1,125 @@
-This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
+# 🥕 CarrotSkin
 
-## Getting Started
+新一代现代化Minecraft Yggdrasil皮肤站，为创作者打造的专业皮肤管理平台。
 
-First, run the development server:
+## ✨ 项目特色
 
+### 🎨 现代化设计
+- **清新橘色主题**：温暖的橙色渐变配色方案，营造舒适的视觉体验
+- **玻璃态效果**：使用backdrop-filter实现现代化的毛玻璃效果
+- **流畅动画**：基于Framer Motion的丝滑动画和交互效果
+- **响应式布局**：完美适配桌面端、平板和移动设备
+
+### 🔧 技术栈
+- **Next.js 16**：最新的React框架，支持App Router
+- **TypeScript**：类型安全的开发体验
+- **Tailwind CSS v4**：现代化的CSS框架，支持自定义主题
+- **Framer Motion**：专业级动画库
+- **Heroicons**：精美的图标系统
+
+### 🚀 核心功能
+
+#### Yggdrasil API支持
+- 完整的Minecraft Yggdrasil认证系统
+- 安全可靠的API接口
+- 支持第三方启动器集成
+
+#### 皮肤管理
+- 无限皮肤存储空间
+- 3D皮肤预览功能
+- 多角色管理系统
+- 皮肤版本控制
+
+#### 社区功能
+- 皮肤分享和发现
+- 用户关注和互动
+- 皮肤收藏和点赞
+- 评论和评价系统
+
+#### 现代化体验
+- 拖拽上传皮肤
+- 实时预览效果
+- 批量管理操作
+- 智能搜索筛选
+
+## 🎯 页面结构
+
+### 主页 (/) 
+- 现代化英雄区域展示
+- Yggdrasil特色功能介绍
+- 统计数据展示
+- 行动召唤区域
+
+### 皮肤库 (/skins)
+- 网格化皮肤展示
+- 高级搜索和筛选
+- 分类标签系统
+- 排序和分页功能
+
+### 个人中心 (/profile)
+- 用户信息管理
+- 角色和皮肤管理
+- 账户设置
+- API密钥管理
+
+## 🛠️ 开发环境
+
+### 安装依赖
 ```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
+npm install
 ```
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+### 启动开发服务器
+```bash
+npm run dev
+```
 
-You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+### 构建生产版本
+```bash
+npm run build
+```
 
-This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
+## 🎨 设计亮点
 
-## Learn More
+### 视觉层次
+- 使用不同深浅的橙色创建视觉层次
+- 渐变背景增强深度感
+- 阴影效果营造立体感
 
-To learn more about Next.js, take a look at the following resources:
+### 交互体验
+- 鼠标跟随效果
+- 滚动视差动画
+- 悬停状态反馈
+- 加载动画效果
 
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+### 现代化元素
+- 圆角卡片设计
+- 渐变按钮效果
+- 玻璃态导航栏
+- 响应式断点优化
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
+## 🔮 未来规划
 
-## Deploy on Vercel
+### 即将推出
+- 3D皮肤编辑器
+- 皮肤模板系统
+- 高级统计分析
+- 移动端APP
 
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+### 长期目标
+- AI皮肤生成
+- 皮肤交易市场
+- 创作者激励计划
+- 国际化支持
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
+## 🤝 贡献指南
+
+欢迎提交Issue和Pull Request来帮助我们改进项目！
+
+## 📄 许可证
+
+MIT License - 详见 [LICENSE](LICENSE) 文件
+
+---
+
+**CarrotSkin** - 让Minecraft皮肤管理变得简单而优雅 🥕