第一次上传

.svn/pristine/99/9991bee86b5c39789a3a25be63ce6a51f44ab223.svn-base

@@ -0,0 +1,199 @@
+# 项目图标清单
+
+> 本项目需要从 https://www.iconfont.cn/ 下载以下图标
+
+## 📋 图标清单
+
+### 底部导航栏（必须）
+
+| 图标名称 | 文件名 | 颜色（未选中） | 颜色（选中） | 尺寸 |
+|---------|--------|--------------|------------|------|
+| 首页 | home.png | #94A3B8 | #6366F1 | 48x48 px |
+| 首页激活 | home-active.png | - | #6366F1 | 48x48 px |
+| 我的 | profile.png | #94A3B8 | #6366F1 | 48x48 px |
+| 我的激活 | profile-active.png | - | #6366F1 | 48x48 px |
+
+**搜索关键词：** 首页 / home / 我的 / 用户 / user
+
+---
+
+### 首页图标
+
+| 图标名称 | 文件名 | 尺寸 | 颜色 |
+|---------|--------|------|------|
+| 搜索 | search.png | 24x24 px | #94A3B8 |
+| 位置 | location.png | 24x24 px | #94A3B8 |
+| 全部 | all.png | 32x32 px | #6366F1 |
+| 餐饮 | restaurant.png | 32x32 px | #6366F1 |
+| 酒馆 | bar.png | 32x32 px | #6366F1 |
+| 超市 | supermarket.png | 32x32 px | #6366F1 |
+| 空状态 | empty.png | 80x80 px | #CBD5E1 |
+
+**搜索关键词：** search / location / grid / food / drink / shop / empty
+
+---
+
+### 个人中心图标
+
+| 图标名称 | 文件名 | 尺寸 | 颜色 |
+|---------|--------|------|------|
+| 编辑 | edit.png | 24x24 px | #FFFFFF |
+| 会员 | vip.png | 32x32 px | #FFFFFF |
+| 优惠券 | coupon.png | 32x32 px | #FFFFFF |
+| 积分 | points.png | 32x32 px | #FFFFFF |
+| 订单 | order.png | 32x32 px | #FFFFFF |
+| 地址 | location.png | 24x24 px | #64748B |
+| 收藏 | favorite.png | 24x24 px | #64748B |
+| 帮助 | help.png | 24x24 px | #64748B |
+| 设置 | settings.png | 24x24 px | #64748B |
+| 右箭头 | arrow-right.png | 20x20 px | #CBD5E1 |
+
+**搜索关键词：** edit / VIP / ticket / coin / list / map / heart / question / settings / arrow
+
+---
+
+### 店铺详情图标
+
+| 图标名称 | 文件名 | 尺寸 | 颜色 |
+|---------|--------|------|------|
+| 电话 | phone.png | 32x32 px | #FFFFFF |
+| 导航 | navigation.png | 32x32 px | #FFFFFF |
+| 时间 | clock.png | 24x24 px | #64748B |
+| 地址 | location.png | 24x24 px | #64748B |
+
+**搜索关键词：** phone / navigation / clock / map-pin
+
+---
+
+### 优惠券图标
+
+| 图标名称 | 文件名 | 尺寸 | 颜色 |
+|---------|--------|------|------|
+| 已使用 | check.png | 24x24 px | #10B981 |
+| 已过期 | close.png | 24x24 px | #94A3B8 |
+
+**搜索关键词：** check / close
+
+---
+
+## 🎨 颜色规范
+
+| 用途 | 颜色代码 | 说明 |
+|------|---------|------|
+| 主色 | #6366F1 | 靛蓝色 |
+| 辅助色 | #8B5CF6 | 紫色 |
+| 未选中 | #94A3B8 | 浅灰色 |
+| 次要文字 | #64748B | 灰色 |
+| 辅助文字 | #94A3B8 | 更浅灰色 |
+| 边框 | #CBD5E1 | 极浅灰色 |
+| 背景 | #F8FAFC | 极浅蓝灰 |
+
+---
+
+## 📥 下载步骤
+
+### 方法一：使用 Iconfont
+
+1. 访问 https://www.iconfont.cn/
+2. 搜索对应关键词
+3. 选择合适的图标（选择 linear 或 outline 风格）
+4. 点击"下载"
+5. 选择 PNG 格式
+6. 调整颜色和尺寸
+7. 保存到 `static/icons/` 目录
+
+### 方法二：使用其他图标库
+
+#### Remix Icon（推荐）
+- 网址：https://remixicon.com/
+- 风格：简约线条
+- 格式：SVG（可转PNG）
+- 免费：✅
+
+#### Heroicons
+- 网址：https://heroicons.com/
+- 风格：现代简约
+- 格式：SVG（可转PNG）
+- 免费：✅
+
+#### Tabler Icons
+- 网址：https://tabler-icons.io/
+- 风格：线条图标
+- 格式：SVG（可转PNG）
+- 免费：✅
+
+---
+
+## 🔧 图标处理
+
+### 调整颜色
+1. 下载 SVG 格式
+2. 使用在线工具或设计软件调整颜色
+3. 导出为 PNG 格式
+4. 确保背景透明
+
+### 调整尺寸
+- 导出时设置对应尺寸
+- 确保清晰度（2x 或 3x）
+- 保持背景透明
+
+### 批量处理
+推荐工具：
+- 在线转换：https://convertio.co/zh/
+- Sketch / Figma
+- Adobe Illustrator
+
+---
+
+## ⚠️ 注意事项
+
+1. **命名规范：** 严格按照文件名清单命名
+2. **格式要求：** PNG格式，透明背景
+3. **尺寸要求：** 按照清单中的尺寸导出
+4. **颜色准确：** 使用指定的颜色代码
+5. **风格统一：** 保持所有图标风格一致（建议线性图标）
+
+---
+
+## 📦 临时方案
+
+如果暂时无法下载图标，可以：
+
+### 1. 使用占位色块
+```css
+background: #6366F1;
+border-radius: 50%;
+```
+
+### 2. 使用纯色图标
+创建简单的纯色圆形或方形作为临时图标
+
+### 3. 使用文字替代
+```html
+<text style="font-size: 40rpx;">🏠</text>
+```
+
+---
+
+## ✅ 检查清单
+
+- [ ] 底部导航栏图标（4个）
+- [ ] 首页图标（7个）
+- [ ] 个人中心图标（10个）
+- [ ] 店铺详情图标（4个）
+- [ ] 优惠券图标（2个）
+
+**总计：27 个图标**
+
+---
+
+## 📞 帮助
+
+如有问题，请参考：
+- Iconfont 帮助文档
+- 在线图标转换工具
+- 设计工具使用教程
+
+---
+
+**最后更新：** 2025-01-24