fix(手机): 收起键盘后「提交」按钮不回来;比赛领奖台第一名被挤出屏幕;iPhone 点输入框整页放大

- 题目页:安卓按返回键收键盘时编辑器不失焦,符号键一直贴底、「运行例子 / 提交」不回来。
  改成看键盘真弹着没有(可视视口变矮),不只看焦点
- 比赛排名:结束后的领奖台三块共 646px,手机上第一名被切掉、第三名看不见;改成平分一行
- iPhone:点 14/15px 的输入框和代码编辑器,Safari 会整页放大且不缩回;只给 iOS 加 maximum-scale=1
- 登录:手机上选完班不再自动聚焦搜索框(键盘弹出来盖住半张名单)
- 题单:窄屏上题目拆成两张没标题的卡片,像分了两组;放不下两栏时合成一张
- 「中等」在题目页是蓝色、在题目列表是橙色,统一成橙色
- 零碎:自学四列表格在 360 宽上收窄格子;统计「错得最多的题」表头不再挤成竖排;
  「第 N 名」「14 道」不再把最后一个字甩到下一行

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
xuyueandClaude Opus 5.5 committed 2026-10-15 12:36:33 +08:00
1 parent 90ce1ab0f5
commit a5d5c39411
12 files changed
+177 -28

No files matched your search

+50 -3
View File
@@ -137,9 +137,13 @@ const columns = computed(
</svg>
<template v-if="podium[place - 1]">
<UserName class="podium-name" :username="podium[place - 1]!.username" />
<span class="muted small">
{{ classLabel(podium[place - 1]!.className) }} · {{ podium[place - 1]!.solved }} 道 ·
{{ secondsToDuration(podium[place - 1]!.totalTime) }}
<span class="muted small podium-meta">
<span>{{ classLabel(podium[place - 1]!.className) }}</span
><span class="sep"> · </span
><span
>{{ podium[place - 1]!.solved }} 道 ·
{{ secondsToDuration(podium[place - 1]!.totalTime) }}</span
>
</span>
</template>
<div class="block">{{ place }}</div>
@@ -534,4 +538,47 @@ const columns = computed(
.empty {
padding: 32px var(--oj-pad-x);
}
/* 手机:三级台阶一共 646px 宽,原样摆第一名就被挤到屏幕外了。三块平分一行,
名字截断、班级和用时折成两行 */
@media (max-width: 640px) {
.podium-row {
gap: 16px;
}
.podium {
width: 100%;
gap: 6px;
}
.step {
flex: 1 1 0;
width: auto;
min-width: 0;
}
.podium-name,
.p1 .podium-name {
font-size: 15px;
max-width: 100%;
}
.podium-meta {
font-size: var(--oj-fs-meta);
text-align: center;
}
.podium-meta > span {
display: block;
white-space: nowrap;
}
.podium-meta > .sep {
display: none;
}
.mine {
width: 100%;
}
}
</style>