- index.css 加一张 --oj-* 尺寸表和 .oj-page 外壳，二十几个前台页面改成引用它： 正文 14→15、页标题 20→24、题目/提交列表行高 40→48、比赛/公告 56、筛选控件 28→34 - 阅读型页面限宽 1200 居中；题目/提交列表 1600、比赛详情 1400、排名 1280、班级 PK 1440 - 1280 宽的筛选条放大后放不下，题目/提交列表在 1366 以下退回 13px 的字 - 班级 PK 五个班起格子里不写「一次 x%」（只剩「一次 8…」）；赛跑图线尾的数字不再被截掉 - 手机上比赛列表的「没参加」挪到比赛名下面；题单里「以前做对过 · 旧代码先藏着」缩成「做对过」 - 题目详情页（编辑器）和后台不在这一轮 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
xuyueandClaude Opus 5.5 committed
1 parent
45d79ed366
commit
1e441411a5
43 files changed
+1016
-752
No files matched your search
@@ -467,7 +467,7 @@ function pct(done: number, total: number) {
|
||||
}
|
||||
|
||||
.problems {
|
||||
width: 380px;
|
||||
width: 404px; /* 380 + 放大一档后多出的留白和字宽，「求两门课程成绩总分(1)」在 1280 下要放得下 */
|
||||
flex: none;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -476,13 +476,13 @@ function pct(done: number, total: number) {
|
||||
}
|
||||
|
||||
.col-head {
|
||||
height: 36px;
|
||||
height: 40px;
|
||||
flex: none;
|
||||
box-sizing: border-box;
|
||||
padding: 0 16px 0 20px;
|
||||
padding: 0 16px 0 var(--oj-pad-x);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
color: v-bind("theme.textColor3");
|
||||
background: v-bind("theme.actionColor");
|
||||
border-bottom: 1px solid v-bind("theme.dividerColor");
|
||||
@@ -496,9 +496,9 @@ function pct(done: number, total: number) {
|
||||
|
||||
.problem {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
height: 56px;
|
||||
box-sizing: border-box;
|
||||
padding: 0 16px 0 20px;
|
||||
padding: 0 16px 0 var(--oj-pad-x);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
@@ -550,7 +550,7 @@ function pct(done: number, total: number) {
|
||||
|
||||
.muted {
|
||||
color: v-bind("theme.textColor3");
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
}
|
||||
|
||||
.spacer {
|
||||
@@ -566,10 +566,10 @@ function pct(done: number, total: number) {
|
||||
}
|
||||
|
||||
.s-head {
|
||||
height: 44px;
|
||||
height: 52px;
|
||||
flex: none;
|
||||
box-sizing: border-box;
|
||||
padding: 0 20px;
|
||||
padding: 0 var(--oj-pad-x);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
@@ -578,17 +578,17 @@ function pct(done: number, total: number) {
|
||||
}
|
||||
|
||||
.s-title {
|
||||
font-size: 15px;
|
||||
font-size: var(--oj-fs-h2);
|
||||
}
|
||||
|
||||
.chip {
|
||||
height: 28px;
|
||||
padding: 0 12px;
|
||||
height: 32px;
|
||||
padding: 0 14px;
|
||||
border: 1px solid v-bind("theme.borderColor");
|
||||
border-radius: 14px;
|
||||
border-radius: 16px;
|
||||
background: transparent;
|
||||
font: inherit;
|
||||
font-size: 13px;
|
||||
font-size: var(--oj-fs-sec);
|
||||
color: v-bind("theme.textColor2");
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -606,14 +606,14 @@ function pct(done: number, total: number) {
|
||||
}
|
||||
|
||||
.cols {
|
||||
height: 32px;
|
||||
height: 40px;
|
||||
flex: none;
|
||||
box-sizing: border-box;
|
||||
padding: 0 20px;
|
||||
padding: 0 var(--oj-pad-x);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
color: v-bind("theme.textColor3");
|
||||
background: v-bind("theme.actionColor");
|
||||
border-bottom: 1px solid v-bind("theme.dividerColor");
|
||||
@@ -626,9 +626,9 @@ function pct(done: number, total: number) {
|
||||
}
|
||||
|
||||
.row {
|
||||
min-height: 38px;
|
||||
min-height: 46px;
|
||||
box-sizing: border-box;
|
||||
padding: 6px 20px;
|
||||
padding: 8px var(--oj-pad-x);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
@@ -695,7 +695,7 @@ function pct(done: number, total: number) {
|
||||
}
|
||||
|
||||
.none {
|
||||
font-size: 13px;
|
||||
font-size: var(--oj-fs-sec);
|
||||
}
|
||||
|
||||
.cells {
|
||||
@@ -707,9 +707,9 @@ function pct(done: number, total: number) {
|
||||
|
||||
.cell {
|
||||
width: 30px;
|
||||
height: 18px;
|
||||
height: 20px;
|
||||
border-radius: 4px;
|
||||
font-size: 11px;
|
||||
font-size: 12px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@@ -739,7 +739,7 @@ function pct(done: number, total: number) {
|
||||
.d-state {
|
||||
width: 100px;
|
||||
flex: none;
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
}
|
||||
|
||||
.empty {
|
||||
@@ -749,8 +749,8 @@ function pct(done: number, total: number) {
|
||||
}
|
||||
|
||||
.truncated {
|
||||
padding: 8px 20px;
|
||||
font-size: 12px;
|
||||
padding: 10px var(--oj-pad-x);
|
||||
font-size: var(--oj-fs-meta);
|
||||
color: v-bind("tone('warning').color");
|
||||
border-top: 1px solid v-bind("theme.dividerColor");
|
||||
}
|
||||
|
||||
@@ -311,13 +311,13 @@ function gradeStyle(grade: string | null) {
|
||||
}
|
||||
|
||||
.summary {
|
||||
height: 72px;
|
||||
height: 84px;
|
||||
flex: none;
|
||||
box-sizing: border-box;
|
||||
padding: 0 20px;
|
||||
padding: 0 var(--oj-pad-x);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 36px;
|
||||
gap: 40px;
|
||||
border-bottom: 1px solid v-bind("theme.dividerColor");
|
||||
background: v-bind("theme.actionColor");
|
||||
}
|
||||
@@ -333,7 +333,7 @@ function gradeStyle(grade: string | null) {
|
||||
}
|
||||
|
||||
.ring-label {
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
line-height: 1.5;
|
||||
color: v-bind("theme.textColor3");
|
||||
}
|
||||
@@ -343,7 +343,7 @@ function gradeStyle(grade: string | null) {
|
||||
min-height: 0;
|
||||
overflow-y: auto;
|
||||
box-sizing: border-box;
|
||||
padding: 16px 20px;
|
||||
padding: 20px var(--oj-pad-x);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 14px;
|
||||
@@ -365,7 +365,7 @@ function gradeStyle(grade: string | null) {
|
||||
border: 1px solid v-bind("theme.dividerColor");
|
||||
border-radius: 8px;
|
||||
background: v-bind("theme.cardColor");
|
||||
padding: 12px 14px;
|
||||
padding: 14px 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
@@ -392,7 +392,7 @@ function gradeStyle(grade: string | null) {
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 13px;
|
||||
font-size: var(--oj-fs-sec);
|
||||
font-weight: 600;
|
||||
color: v-bind("theme.textColor2");
|
||||
}
|
||||
@@ -411,12 +411,12 @@ function gradeStyle(grade: string | null) {
|
||||
}
|
||||
|
||||
.person {
|
||||
height: 34px;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
border-bottom: 1px solid v-bind("theme.dividerColor");
|
||||
font-size: 13px;
|
||||
font-size: var(--oj-fs-sec);
|
||||
}
|
||||
|
||||
.p-name {
|
||||
@@ -427,9 +427,9 @@ function gradeStyle(grade: string | null) {
|
||||
.grade-pill {
|
||||
width: 100px;
|
||||
flex: none;
|
||||
height: 22px;
|
||||
height: 24px;
|
||||
border-radius: 11px;
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
font-weight: 700;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
@@ -438,7 +438,7 @@ function gradeStyle(grade: string | null) {
|
||||
|
||||
.muted {
|
||||
color: v-bind("theme.textColor3");
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
}
|
||||
|
||||
.empty {
|
||||
|
||||
@@ -292,7 +292,7 @@ function percent(value: number, total: number) {
|
||||
min-height: 0;
|
||||
overflow: auto;
|
||||
padding-bottom: 20px;
|
||||
font-size: 14px;
|
||||
font-size: var(--oj-fs-body);
|
||||
}
|
||||
|
||||
.live {
|
||||
@@ -323,8 +323,8 @@ function percent(value: number, total: number) {
|
||||
}
|
||||
|
||||
.note {
|
||||
padding: 16px 20px 4px;
|
||||
font-size: 13px;
|
||||
padding: 20px var(--oj-pad-x) 6px;
|
||||
font-size: var(--oj-fs-sec);
|
||||
color: v-bind("theme.textColor3");
|
||||
}
|
||||
|
||||
@@ -332,11 +332,11 @@ function percent(value: number, total: number) {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
height: 28px;
|
||||
height: 36px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20px;
|
||||
font-size: 12px;
|
||||
padding: 0 var(--oj-pad-x);
|
||||
font-size: var(--oj-fs-meta);
|
||||
font-weight: 600;
|
||||
color: v-bind("theme.textColor3");
|
||||
background: v-bind("theme.actionColor");
|
||||
@@ -344,10 +344,10 @@ function percent(value: number, total: number) {
|
||||
}
|
||||
|
||||
.row {
|
||||
height: 44px;
|
||||
height: 52px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20px;
|
||||
padding: 0 var(--oj-pad-x);
|
||||
border-bottom: 1px solid v-bind("theme.dividerColor");
|
||||
color: v-bind("theme.textColor1");
|
||||
text-decoration: none;
|
||||
@@ -396,7 +396,7 @@ function percent(value: number, total: number) {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 13px;
|
||||
font-size: var(--oj-fs-sec);
|
||||
}
|
||||
|
||||
.pid {
|
||||
@@ -409,7 +409,7 @@ function percent(value: number, total: number) {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
font-size: 13px;
|
||||
font-size: var(--oj-fs-sec);
|
||||
color: v-bind("theme.primaryColor");
|
||||
}
|
||||
|
||||
@@ -439,7 +439,7 @@ function percent(value: number, total: number) {
|
||||
|
||||
.axis-row {
|
||||
display: flex;
|
||||
padding: 0 20px;
|
||||
padding: 0 var(--oj-pad-x);
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
@@ -452,7 +452,7 @@ function percent(value: number, total: number) {
|
||||
top: 3px;
|
||||
transform: translateX(-50%);
|
||||
white-space: nowrap;
|
||||
font-size: 11px;
|
||||
font-size: 12px;
|
||||
color: v-bind("theme.textColor3");
|
||||
}
|
||||
|
||||
@@ -464,8 +464,8 @@ function percent(value: number, total: number) {
|
||||
}
|
||||
|
||||
.scattered {
|
||||
padding: 7px 20px;
|
||||
font-size: 12px;
|
||||
padding: 8px var(--oj-pad-x);
|
||||
font-size: var(--oj-fs-meta);
|
||||
color: v-bind("theme.textColor3");
|
||||
border-bottom: 1px solid v-bind("theme.dividerColor");
|
||||
}
|
||||
@@ -481,25 +481,25 @@ function percent(value: number, total: number) {
|
||||
}
|
||||
|
||||
.more {
|
||||
padding: 12px 20px 0;
|
||||
padding: 14px var(--oj-pad-x) 0;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
gap: 10px;
|
||||
padding: 18px 20px 6px;
|
||||
padding: 22px var(--oj-pad-x) 8px;
|
||||
}
|
||||
|
||||
.small {
|
||||
font-size: 13px;
|
||||
font-size: var(--oj-fs-sec);
|
||||
}
|
||||
|
||||
.hard {
|
||||
width: calc(100% - 40px);
|
||||
margin: 0 20px;
|
||||
border-collapse: collapse;
|
||||
font-size: 13px;
|
||||
font-size: var(--oj-fs-sec);
|
||||
}
|
||||
|
||||
.hard th {
|
||||
|
||||
@@ -37,7 +37,7 @@ const color = computed(() => (props.tone ? toneOf(props.tone).color : theme.valu
|
||||
|
||||
.label,
|
||||
.unit {
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
color: v-bind("theme.textColor3");
|
||||
}
|
||||
|
||||
@@ -48,7 +48,7 @@ const color = computed(() => (props.tone ? toneOf(props.tone).color : theme.valu
|
||||
}
|
||||
|
||||
.value {
|
||||
font-size: 22px;
|
||||
font-size: 26px;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
</style>
|
||||
@@ -524,10 +524,10 @@ function resultWidth(value: number) {
|
||||
}
|
||||
|
||||
.filters {
|
||||
height: 52px;
|
||||
height: 60px;
|
||||
flex: none;
|
||||
box-sizing: border-box;
|
||||
padding: 0 20px;
|
||||
padding: 0 var(--oj-pad-x);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
@@ -536,18 +536,18 @@ function resultWidth(value: number) {
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 17px;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
margin-right: 6px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.back {
|
||||
height: 28px;
|
||||
height: 32px;
|
||||
padding: 0 10px 0 6px;
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
font: inherit;
|
||||
font-size: 13px;
|
||||
font-size: var(--oj-fs-sec);
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
@@ -578,7 +578,7 @@ function resultWidth(value: number) {
|
||||
.result-legend {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
white-space: nowrap;
|
||||
color: v-bind("theme.textColor2");
|
||||
}
|
||||
@@ -622,7 +622,7 @@ function resultWidth(value: number) {
|
||||
}
|
||||
|
||||
.range {
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
color: v-bind("theme.textColor3");
|
||||
}
|
||||
|
||||
@@ -649,13 +649,13 @@ function resultWidth(value: number) {
|
||||
}
|
||||
|
||||
.summary {
|
||||
height: 72px;
|
||||
height: 84px;
|
||||
flex: none;
|
||||
box-sizing: border-box;
|
||||
padding: 0 20px;
|
||||
padding: 0 var(--oj-pad-x);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 36px;
|
||||
gap: 40px;
|
||||
border-bottom: 1px solid v-bind("theme.dividerColor");
|
||||
background: v-bind("theme.actionColor");
|
||||
}
|
||||
@@ -667,7 +667,7 @@ function resultWidth(value: number) {
|
||||
}
|
||||
|
||||
.ring-label {
|
||||
font-size: 12px;
|
||||
font-size: var(--oj-fs-meta);
|
||||
line-height: 1.5;
|
||||
color: v-bind("theme.textColor3");
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user