refining/climperor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v0.5.87: fill ability loc tokens and tidy skill detail layout.

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
voson
2026-07-29 20:32:37 +08:00
co-authored by Cursor
parent ad7f5d0e1a
commit 09f0a0b4a0
10 changed files with 410 additions and 330 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/frontend/app.js
+18 -11
View File
@@ -2254,7 +2254,7 @@ function mountSkillInspect(root, skillEnt, heroKey) {
main.appendChild(head);
const desc = document.createElement("div");
desc.className = "skill-info-desc";
desc.textContent = skillEnt.desc_loc || "暂无描述";
desc.textContent = stripItemDesc(skillEnt.desc_loc) || "暂无描述";
main.appendChild(desc);
// Params panel, dota2.com.cn layout: a two-column "generic" grid of meta
@@ -2267,7 +2267,8 @@ function mountSkillInspect(root, skillEnt, heroKey) {
row.className = "skill-param";
const lab = document.createElement("span");
lab.className = "skill-param-label";
lab.textContent = label + "：";
// Defensive: stale caches may still carry Valve <font> in special labels.
lab.textContent = stripItemDesc(label) + "：";
const val = document.createElement("span");
val.className = "skill-param-value";
val.textContent = value;
@@ -2310,7 +2311,10 @@ function mountSkillInspect(root, skillEnt, heroKey) {
main.appendChild(params);
}
// Cooldown / mana footer with icons (actives only; passives have neither).
// Bottom cluster (costs + lore) shares one margin-top:auto so lore is not
// pushed past the column height after the sunk cooldown row.
const foot = document.createElement("div");
foot.className = "skill-info-foot";
const passiveLike =
skillEnt.target_label === "被动" || skillEnt.target_label === "光环";
if (!passiveLike && (skillEnt.cooldown || skillEnt.mana_cost)) {
@@ -2342,15 +2346,16 @@ function mountSkillInspect(root, skillEnt, heroKey) {
mp.appendChild(txt);
costs.appendChild(mp);
}
main.appendChild(costs);
foot.appendChild(costs);
}
// Flavor lore line.
if (skillEnt.lore_loc) {
const lore = document.createElement("div");
lore.className = "skill-info-lore";
lore.textContent = skillEnt.lore_loc;
main.appendChild(lore);
lore.textContent = stripItemDesc(skillEnt.lore_loc);
foot.appendChild(lore);
}
if (foot.childElementCount) {
main.appendChild(foot);
}
body.appendChild(main);
@@ -3160,8 +3165,10 @@ function statChip(icon) {
}
function patchNoteHtml(note) {
const esc = escapeHtml(note == null ? "" : String(note));
return esc.replace(/&lt;br\s*\/?&gt;/gi, "<br/>");
// Valve notes carry <br>, <font color=…>, <span class="New|Subtitle|…">.
// Keep line breaks; strip the rest so raw tags never leak into the UI.
const plain = stripItemDesc(note);
return escapeHtml(plain).replace(/\n/g, "<br/>");
}
function renderNotesList(notes) {
@@ -3250,7 +3257,7 @@ function renderPatchSection(root, title, html) {
if (!html) return;
const sec = document.createElement("section");
sec.className = "patch-section";
sec.innerHTML = `<h3 class="patch-section-title">${escapeHtml(title)}</h3>${html}`;
sec.innerHTML = `<h3 class="patch-section-title">${escapeHtml(stripItemDesc(title))}</h3>${html}`;
root.appendChild(sec);
}
web/frontend/config.js
+1 -1
View File
@@ -1,4 +1,4 @@
/* Local defaults; production export overwrites via export_relations_site.py. */
var SITE_VERSION = "0.5.86";
var SITE_VERSION = "0.5.87";
var ABILITY_VIDEO_BASE = "";
var STATIC_ASSET_BASE = "";
web/frontend/index.html
+5 -5
View File
@@ -5,8 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>DOTA2 上分帝</title>
<link rel="icon" href="/ui-icon/dota2_logo.png" type="image/png" />
<link rel="stylesheet" href="/style.css?v=0.5.86" />
<script src="/mobile-gate.js?v=0.5.86"></script>
<link rel="stylesheet" href="/style.css?v=0.5.87" />
<script src="/mobile-gate.js?v=0.5.87"></script>
</head>
<body>
<div id="mobile-gate" class="mobile-gate" role="dialog" aria-labelledby="mobile-gate-title" aria-modal="true">
@@ -165,8 +165,8 @@
<section class="detail" id="detail" aria-live="polite"></section>
<script src="/config.js?v=0.5.86"></script>
<script src="/router.js?v=0.5.86"></script>
<script src="/app.js?v=0.5.86"></script>
<script src="/config.js?v=0.5.87"></script>
<script src="/router.js?v=0.5.87"></script>
<script src="/app.js?v=0.5.87"></script>
</body>
</html>
web/frontend/style.css
+35 -16
View File
@@ -1100,10 +1100,11 @@ body {
min-width: 1.4em;
}
.hero-stat-attr-gain {
margin-left: 6px;
margin-left: auto;
font-size: 13px;
color: var(--muted);
letter-spacing: 0.02em;
text-align: right;
}
/* Right-rail combat panel: Attack | Defense | Mobility side by side. */
.hero-stats-combat-panel {
@@ -1413,24 +1414,27 @@ body {
font-size: 13px;
line-height: 1.4;
color: rgba(232, 238, 247, 0.88);
white-space: pre-wrap;
/* Keep Valve paragraph breaks; collapse runs of spaces. Prefer one line when
the detail column is wide enough (see video/main flex share below). */
white-space: pre-line;
}
.skill-info-body {
display: flex;
flex-wrap: wrap;
gap: 18px 30px;
gap: 18px 24px;
align-items: flex-start;
justify-content: center;
/* Spare width goes into the text column instead of centering a squeezed pair. */
justify-content: flex-start;
/* Fill the hero-inspect column so the video's 16:9 intrinsic height can no
longer push the row past the viewport and trigger a scrollbar. */
flex: 1 1 auto;
min-height: 0;
}
.skill-info-main {
flex: 1 1 340px;
flex: 1 1 420px;
min-width: 0;
/* Cap the detail column so it does not stretch edge-to-edge (leaving a big
empty band) when no demo video is cached beside it. */
/* Cap when alone (no demo clip). With a video sibling, allow a wider column
so ability blurbs stay on one line when the panel has room. */
max-width: 760px;
/* height:100% pins this column to the body's definite height (same trick as
the video) — align-self:stretch alone fails to shrink a column whose
@@ -1444,13 +1448,17 @@ body {
overflow-y: auto;
scrollbar-width: thin;
}
.skill-info-body:has(> .skill-info-video) .skill-info-main {
max-width: 920px;
flex: 1 1 480px;
}
/* height:100% resolves against the definite body height (set by the flex
chain from .detail's fixed height), so the 16:9 intrinsic ratio can no
longer push the player past the viewport — align-self:stretch alone can't
shrink a replaced element below its intrinsic size. cover crops to fill. */
.skill-info-video {
flex: 1 1 500px;
max-width: 820px;
flex: 1 1 380px;
max-width: 560px;
min-width: 0;
min-height: 0;
height: 100%;
@@ -1475,7 +1483,9 @@ body {
}
.skill-specific {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(178px, 1fr));
/* Wider tracks so multi-level values ("0.7 / 0.9 / 1.1 / 1.3") stay on one
line beside the label instead of leaving an empty band to the right. */
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 4px 20px;
margin-top: 8px;
padding-top: 8px;
@@ -1483,7 +1493,9 @@ body {
}
.skill-param {
display: flex;
flex-wrap: wrap;
align-items: baseline;
column-gap: 4px;
min-width: 0;
font-size: 13px;
line-height: 1.45;
@@ -1494,22 +1506,29 @@ body {
color: var(--muted);
}
.skill-param-value {
margin-left: 4px;
flex: 1 1 auto;
min-width: 0;
color: #fff;
font-weight: 600;
/* Keep "0.7 / 0.9 / 1.1 / 1.3" on one line; grid adds columns instead of
stacking each tier vertically in a squeezed value span. */
white-space: nowrap;
}
/* Cooldown / mana + lore sink together so lore cannot overflow past the
column after margin-top:auto on costs alone. */
.skill-info-foot {
margin-top: auto;
padding-top: 10px;
flex: 0 0 auto;
}
/* Cooldown / mana footer. Mana glyph is the official CSS gradient square;
cooldown uses the downloaded dota2.com.cn cooldown.png. */
.skill-bottom {
display: flex;
align-items: center;
justify-content: space-between;
gap: 26px;
/* Sinks the cooldown/mana footer to the column bottom (aligning with the
stretched video); padding-top keeps the minimum gap when there is no
spare height to absorb. */
margin-top: auto;
padding-top: 10px;
width: 100%;
}
.skill-stat {
display: inline-flex;