diff --git a/CHANGELOG.md b/CHANGELOG.md index 7264170..988ed89 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -12,6 +12,12 @@ - PC 选将 overlay 不再在顶栏头像下显示定位图标；仍保留网格「克/搭/补」与阵容分析条。 +## [0.6.7] - 2026-07-30 + +### Changed + +- 比赛页主列由 1680px 收至 1200px，并按居中布局预留右侧筛选栏宽度，避免选手列表被裁切。 + ## [0.6.6] - 2026-07-30 ### Changed diff --git a/DESIGN.md b/DESIGN.md index f9ffb20..f0b4805 100644 --- a/DESIGN.md +++ b/DESIGN.md @@ -110,7 +110,7 @@ spacing: content-read: 820px content-standard: 880px content-wide: 1080px - content-data: 1680px + content-data: 1200px components: button-primary: backgroundColor: "{colors.primary}" @@ -270,7 +270,7 @@ components: | read | `min(820px, 92%)` | 版本 | | standard | `min(880px, calc(100% - 48px))` | 排行、主播、机制 | | wide | `min(1080px, …)` | 走势 | -| data | `min(1680px, …)` | 比赛 | +| data | `min(1200px, …)`（居中时两侧预留侧栏） | 比赛 | 间距尺度：4 / 8 / 12 / 16 / 24 / 32 / 48px。页内 gutter 默认 16px；列表页上下 `page-y` 28px。侧栏与主列间距 20px。 diff --git a/web/export_relations_site.py b/web/export_relations_site.py index 9724112..3fbccda 100644 --- a/web/export_relations_site.py +++ b/web/export_relations_site.py @@ -56,7 +56,7 @@ from shared.paths import ( from seo_prerender import DEFAULT_SITE_ORIGIN, write_seo_bundle from serve_relations import WEB_DIR, build_payload -SITE_VERSION = "0.6.6" +SITE_VERSION = "0.6.7" DEFAULT_OSS_BASE = "https://climperor.oss-cn-shanghai.aliyuncs.com" diff --git a/web/frontend/config.js b/web/frontend/config.js index dbd3b46..2db46de 100644 --- a/web/frontend/config.js +++ b/web/frontend/config.js @@ -1,5 +1,5 @@ /* Local defaults; production export overwrites via export_relations_site.py. */ -var SITE_VERSION = "0.6.6"; +var SITE_VERSION = "0.6.7"; var SITE_ORIGIN = ""; var ABILITY_VIDEO_BASE = ""; var STATIC_ASSET_BASE = ""; diff --git a/web/frontend/index.html b/web/frontend/index.html index a5a9529..44d6523 100644 --- a/web/frontend/index.html +++ b/web/frontend/index.html @@ -43,8 +43,8 @@ } - - + +

DOTA2 上分帝

@@ -233,8 +233,8 @@ - - - + + + diff --git a/web/frontend/style.css b/web/frontend/style.css index 552fa96..206bf28 100644 --- a/web/frontend/style.css +++ b/web/frontend/style.css @@ -62,7 +62,8 @@ --content-read: 820px; --content-standard: 880px; --content-wide: 1080px; - --content-data: 1680px; + /* Matches list + right filter aside (centered column must leave aside room). */ + --content-data: 1200px; --aside-gap: 20px; --focus-ring: 2px solid var(--sel); } @@ -2256,6 +2257,11 @@ a.match-player-name:hover { gap: 5px; align-items: center; } +@media (max-width: 1200px) { + .match-skills { + flex-wrap: wrap; + } +} .match-inv { display: flex; flex-direction: column; @@ -2982,8 +2988,8 @@ body:has(#items-view:not(.hidden)) { } .matches-board .rankings-center-wrap.matches-center-wrap { align-items: stretch; - /* Fixed column width so cards align; ~lv30 skill row + a little slack. */ - width: min(var(--content-data), 100%, calc(100vw - 280px)); + /* Centered column + absolute aside: reserve ~aside(260)+gap on BOTH sides. */ + width: min(var(--content-data), calc(100% - 48px), calc(100vw - 560px)); } .matches-board .match-list, .matches-board .match-card { @@ -2993,14 +2999,13 @@ body:has(#items-view:not(.hidden)) { } .matches-board .match-skills { max-width: 100%; -} -@media (max-width: 1200px) { - .match-skills { - flex-wrap: wrap; - } + flex-wrap: wrap; } .matches-board .rankings-aside { align-items: stretch; + width: max-content; + min-width: 200px; + max-width: min(260px, 28vw); } .matches-origins, .matches-players { @@ -3012,6 +3017,9 @@ body:has(#items-view:not(.hidden)) { .matches-board .rankings-aside .rankings-region-btn { width: 100%; box-sizing: border-box; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .matches-board .match-list { gap: 12px; @@ -3148,7 +3156,10 @@ body:has(#items-view:not(.hidden)) { width: min(640px, 94%); } .matches-board .rankings-center-wrap.matches-center-wrap { - width: min(1680px, 94%); + width: min(var(--content-data), 94%); + } + .matches-board .rankings-aside { + max-width: none; } .rankings-aside { position: static;