4.0 KiB

Executable File

Raw Blame History

Logo 使用规范

版本: v1.0.0
更新日期: 2026-03-16
状态: ✅ 官方指定 Logo

🐉 官方 Logo

主 Logo

文件: jiachenlong-logo.png

位置:

本地：/static/images/jiachenlong-logo.png
前端服务器：/var/www/html/static/images/jiachenlong-logo.png

规格:

格式：PNG
大小：606KB
尺寸：正方形（适合圆形裁剪）
颜色：橙色（中国传统色）
设计：龙型环绕 + "甲辰收藏"文字

📋 使用场景

1. 登录页面

文件: frontend/src/pages/Login.jsx

<img 
  src="/static/images/jiachenlong-logo.png" 
  alt="甲辰收藏" 
  style={{ 
    width: '200px', 
    height: '200px',
    borderRadius: '50%',
    boxShadow: '0 0 40px rgba(251, 191, 36, 0.4)',
    background: '#fff'
  }} 
/>

2. 首页

文件: frontend/src/pages/Home.jsx

<img 
  src="/static/images/jiachenlong-logo.png" 
  alt="甲辰收藏" 
  style={{ 
    width: '48px', 
    height: '48px', 
    borderRadius: '50%', 
    objectFit: 'cover' 
  }} 
/>

3. 藏品详情页

文件: frontend/src/pages/Detail.jsx

<img 
  src="/static/images/jiachenlong-logo.png" 
  alt="甲辰收藏"
  onError={(e) => { 
    e.target.src = '/static/images/jiachenlong-logo.png'; 
  }} 
/>

🎨 样式规范

圆形样式（推荐）

.logo {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 0 40px rgba(251, 191, 36, 0.4);
  background: #fff;
}

小尺寸（导航栏等）

.logo-small {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
}

中等尺寸

.logo-medium {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  object-fit: cover;
}

📦 部署规范

部署脚本

文件: scripts/deploy.sh

部署脚本会自动：

✅ 检查 Logo 文件是否存在
✅ 部署前端构建文件
✅ 部署 Logo 到服务器
✅ 重启 Nginx

部署命令

# 测试环境
./scripts/deploy.sh 1.0.0 test

# 生产环境
./scripts/deploy.sh 1.0.0 production

手动部署

# 1. 构建前端
cd frontend
npm run build

# 2. 部署到服务器
scp -r dist/* root@8.149.137.26:/var/www/html/
scp static/images/jiachenlong-logo.png root@8.149.137.26:/var/www/html/static/images/

# 3. 重启 Nginx
ssh root@8.149.137.26 "nginx -s reload"

⚠️ 注意事项

必须遵守

✅ 统一使用 jiachenlong-logo.png
✅ 禁止使用 旧版 logo.jpg、dragon-logo.jpg、title_logo.svg
✅ 保持比例 - 始终使用正方形容器
✅ 圆形裁剪 - 使用 border-radius: 50%
✅ 白色背景 - Logo 需要白色背景衬托

禁止行为

❌ 不要修改 Logo 颜色
❌ 不要拉伸变形
❌ 不要添加其他效果
❌ 不要使用其他 Logo 文件

📁 文件位置

本地开发

jiachenlong/
└── static/
    └── images/
        └── jiachenlong-logo.png  # ✅ 官方 Logo

前端服务器

/var/www/html/
└── static/
    └── images/
        └── jiachenlong-logo.png  # ✅ 官方 Logo

🔄 更新流程

如需更新 Logo：

替换文件

cp new-logo.png /static/images/jiachenlong-logo.png

重新构建
```
cd frontend
npm run build
```
部署到服务器
```
./scripts/deploy.sh 1.0.1 production
```

验证部署

curl http://8.149.137.26/static/images/jiachenlong-logo.png -o /tmp/logo-check.png

📊 Logo 对比

文件	状态	说明
`jiachenlong-logo.png`	✅ 官方指定	橙色圆形龙型 Logo
`logo.jpg`	❌ 废弃	旧版 Logo
`dragon-logo.jpg`	❌ 废弃	旧版龙型 Logo
`title_logo.svg`	❌ 废弃	旧版 SVG Logo

所有部署必须使用 jiachenlong-logo.png！

最后更新: 2026-03-16

4.0 KiB Executable File Raw Blame History Unescape Escape