feat: 全站统一横版锁标(官网页头 + 管理端登录页改用 logo.svg)

## 背景

上一提交把官网页头换成了**方形**品牌图标(favicon.svg)+ 文字 span,
用户指出仓库里本就有**横版带字样**的锁标 —— 确实有:
`logo/纯色横向.svg`(12.4KB)与 `logo/纯色横向@2x.png`(74.7KB)。

**重要发现**:`logo/纯色横向@2x.png` 与 `software/web/public/logo.png`
**是同一个文件**(SHA256 均为 `8E40298E…`、76523 B、3025×829)——
即管理端登录页早就在用这套设计,只是 PNG 拷贝,且我此前没认出来。

## 改动

新增 `logo.svg`(由 `logo/纯色横向.svg` 机械变换,**渲染零差异**):

1. `<style>` 的 class 上色 → 内联 `fill`(14 处);
2. 中文 id(`图层_2`/`图层_1-2`)→ ASCII;`data-name` 元数据删除;
3. 删 `<style>` 与空掉的 `<defs>`;加 `<title>`。

> 该 SVG 的 `<text>` 元素数为 **0** —— "艾动智能"字样**已转为路径**,
> 无字体依赖,任何环境渲染都一致。

落点:

| 位置 | 改动 |
|---|---|
| `deploy/landing/logo.svg` | 新增;官网页头 `<img src="logo.svg">` |
| `deploy/landing/index.html` | 删掉 `<span class="top-name">`(字样已在锁标里,否则重复)及失效的 `.top-name` CSS |
| `software/web/public/logo.svg` | 新增;`Login.tsx` 由 `logo.png` 改指 `logo.svg` |
| `software/web/public/logo.png` | **删除**(全仓已无引用,74.7KB 死文件) |

## 渲染等价验证

resvg 逐像素比对(600×164):**393600 字节零差异**。

## 实测(发布后打真实 URL)

```
200  21.1KB  app.anzhizhichong.com/favicon.svg       (tab 图标,方形变体)
200  12.3KB  app.anzhizhichong.com/logo.svg          (官网页头)
200  12.3KB  app.anzhizhichong.com/pms/logo.svg      (管理端登录页·生产)
200  12.3KB  test.anzhizhichong.com/pms/logo.svg     (管理端登录页·测试)
200  21.1KB  test.anzhizhichong.com/pms/favicon.svg
```
三处 logo.svg 均确认含 `<title>艾动智能</title>` 与 `fill="#0366e6"` 路径。

## 一个差点误判的"异常"

`/pms/logo.png` 返回 **HTTP 200**,一度以为旧文件没删掉。
实测其 `Content-Type` 是 **`text/html`**、0.47KB(内容是 index.html)——
nginx `location /pms/` 配了 `try_files $uri $uri/ /pms/index.html`(SPA 回退),
**任何**不存在路径都返回 200。对照测试:访问一个肯定不存在的
`/pms/definitely-not-exist-xyz.png` 同样 200 + index.html。
服务器目录实测已无 `logo.png`。**是 404 的预期写错了,不是文件没删。**

## 验收

- `npm run typecheck`:exit 0
- `npm run build`:exit 0,产物仅 `logo.svg`(12.3KB,无 logo.png)
- 已发布:生产(web + 官网)、测试(web)
- 生产 0 ERROR、域名 401/200;nginx `nginx -t` 通过后 reload
This commit is contained in:
12451 2026-09-21 01:24:58 +08:00
parent 8df2c0c7a0
commit 318501d6e7
5 changed files with 13 additions and 8 deletions

View File

@ -37,13 +37,12 @@ a { color: inherit; text-decoration: none; }
.top-brand { display: flex; align-items: center; gap: 8px; }
.logo {
/* 横版锁标 1511.75x413.59(≈3.65:1):48px 高 ⇒ 约 175px 宽,
锁标内部的"艾动智能"字样约 24px,与页头原有文字观感一致 */
height: 48px;
width: auto;
display: block;
/* 品牌图标是满幅方形(本身无圆角),48px 下加一点圆角更像 app 图标,不至于是一块硬方块 */
border-radius: 10px;
}
.top-name { font-size: 24px; font-weight: 800; color: #1A1C20; letter-spacing: 0.02em; }
.top-links { display: flex; gap: 8px; }
.top-link {
@ -165,9 +164,9 @@ h1 .accent { color: #2563EB; }
<!-- 上:顶部导航 -->
<div class="top">
<div class="top-brand">
<!-- 页头品牌图标:与 favicon 同一个文件(logo/favicon.svg),保证全站一致 -->
<img class="logo" src="favicon.svg" alt="艾动智能">
<span class="top-name">艾动智能</span>
<!-- 横版锁标(图标 + "艾动智能"字样,文字已转为路径、无字体依赖)。
与 tab 图标同源:logo/纯色横向.svg → favicon 用其方形变体 -->
<img class="logo" src="logo.svg" alt="艾动智能">
</div>
<div class="top-links">
<a href="/doc/" class="top-link">开发文档</a>

2
deploy/landing/logo.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 75 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 12 KiB

View File

@ -1,4 +1,4 @@
import { useCallback, useEffect, useRef, useState } from 'react';
import { useCallback, useEffect, useRef, useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { useAuthStore } from '@/stores/auth';
import { api } from '@/api/request';
@ -125,7 +125,9 @@ export default function Login() {
border: '1px solid #e2e8f0',
}}>
<div style={{ textAlign: 'center', marginBottom: 32 }}>
<img src="/pms/logo.png" alt="艾动智能" style={{ height: 40, display: 'block', margin: '0 auto' }} />
{/* 横版锁标:与官网页头同源(logo/纯色横向.svg)。用 SVG 而非 PNG 拷贝,
矢量更锐利,且 12KB vs 76KB */}
<img src="/pms/logo.svg" alt="艾动智能" style={{ height: 40, display: 'block', margin: '0 auto' }} />
</div>
<form onSubmit={handleLoginClick} autoComplete="off">