fix(web): 恢复移动端 Header 的 GitHub/X 链接 (#81)

* fix(web): restore GitHub/X links in mobile header

上一个 PR (#80) 为缓解 Header 移动端拥挤,给 GitHub/X 图标加了
hidden sm:inline-flex,导致手机端(<640px)看不到这两个入口。
横向溢出的真正元凶(导入按钮负偏移)已在 #80 修复,Header 全显示
不会重新引入左右滑动,故恢复图标在所有视口常驻显示。

* fix(web): 移动端 UserChip 只显示头像,宽度与其他图标按钮对齐

登录态 UserChip 之前是「头像 + 名字」的宽按钮(≈90px),
是齿轮/GitHub/X 图标按钮(≈16px)的 5-6 倍,导致 Header
右侧集群宽度在登录/未登录切换时剧烈变化,所有按钮位置大幅偏移。

改动:
- 去掉名字显示,只保留头像圆圈
- 头像尺寸 h-5→h-4(16px,与图标按钮一致)
- 按钮 padding 收窄至 p-0.5(总宽≈22px)
- 加 title 属性保留完整用户名(hover 可见)
- 移除开发过程中使用的 mock 登录态临时代码
This commit is contained in:
Zonghao Yuan
2026-06-15 15:28:24 +08:00
committed by GitHub
parent ba9f9c1342
commit dc08f64ec1
2 changed files with 9 additions and 6 deletions
+5 -2
View File
@@ -1313,6 +1313,7 @@ export default function HomePage() {
const [authModalOpen, setAuthModalOpen] = useState(false);
const [pendingAction, setPendingAction] = useState<"start" | null>(null);
const styleRow = OPTS.findIndex((o) => o.modal);
const voiceRow = OPTS.findIndex((o) => o.label === "语音配音");
const paceRow = OPTS.findIndex((o) => o.label === "内容节奏");
@@ -1652,7 +1653,7 @@ export default function HomePage() {
target="_blank"
rel="noopener noreferrer"
aria-label="GitHub"
className="hidden sm:inline-flex text-lg text-clay-500 hover:text-ember-500 transition-colors"
className="inline-flex text-lg text-clay-500 hover:text-ember-500 transition-colors"
>
<i className="fa-brands fa-github" />
</a>
@@ -1661,7 +1662,7 @@ export default function HomePage() {
target="_blank"
rel="noopener noreferrer"
aria-label="X / Twitter"
className="hidden sm:inline-flex text-base text-clay-500 hover:text-ember-500 transition-colors"
className="inline-flex text-base text-clay-500 hover:text-ember-500 transition-colors"
>
<i className="fa-brands fa-x-twitter" />
</a>
@@ -1776,6 +1777,8 @@ export default function HomePage() {
))}
</div>
{/* 使用提示:可被用户永久关闭(localStorage:infiplot:hintClosed */}
{!hintClosed && (
<div className="relative mx-auto mt-10 md:mt-12 max-w-[640px] rounded-sm border border-clay-900/10 bg-cream-100/50 px-5 md:px-8 py-3.5">