Combat stats under the doll at its width; empty food slot shows red instead of a warning

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
rope 2026-10-20 15:50:54 +01:00
parent 7c87978d12
commit ac73fa996d
2 changed files with 15 additions and 11 deletions

View file

@ -561,7 +561,6 @@ function combatFrame() {
const you = `<div class="fighter">
<div class="fighter-name"><b>${esc(me.name)}</b><span class="small muted">${HEART} <span data-f="you-hp">${fmt(me.hp)} / ${me.max_hp}</span></span></div>
${bars("you")}
${me.edible.length ? "" : `<div class="small warn">No food in your bank.</div>`}
</div>`;
let foe = `<div class="foe-idle muted">Not fighting.</div>`;
if (f) {
@ -1263,9 +1262,9 @@ function paperDoll(p, mine) {
${it ? gearChips(it, p) : ""}${mine ? swapGrid(p, pick, two) : ""}`;
}
return `<div class="doll-wrap">
<div class="doll"><span class="doll-figure">${glyph("swordman", "#e6e8ee")}</span>
${DOLL.map(([s, name, outline]) => dollSlot(p, s, name, outline, s === pick)).join("")}</div>
<div class="doll-side"><div class="doll-slot-info">${slot}</div>${combatStats(p)}</div>
<div class="doll-col"><div class="doll"><span class="doll-figure">${glyph("swordman", "#e6e8ee")}</span>
${DOLL.map(([s, name, outline]) => dollSlot(p, s, name, outline, s === pick)).join("")}</div>${combatStats(p)}</div>
<div class="doll-side"><div class="doll-slot-info">${slot}</div></div>
</div>`;
}
@ -1285,7 +1284,7 @@ function combatStats(p) {
cell(glyph("dodging", "#8fd0e0"), fmt(f.evasion), "Evasion"),
cell(glyph("shield-reflect", "#e0b04a"), pct(f.block), "Block chance (with a shield)"),
];
return `<div class="combat-stats"><div class="muted small">Combat stats</div><div class="stat-grid">${cells.join("")}</div></div>`;
return `<div class="combat-stats stat-grid">${cells.join("")}</div>`;
}
// What else in the bank fits the picked slot, best first: click one to put it on. For weapons the
@ -1316,9 +1315,10 @@ function slot2(slot, p) {
function foodSlot(p, picked) {
if (!("food" in p)) return `<span class="doll-slot future" title="Food"></span>`;
const id = p.food && p.bank[p.food] ? p.food : null;
const tip = id ? `Food: ${item(id).name}, heals ${item(id).heal}` : "Food: cheapest first";
return `<button class="doll-slot ${picked ? "on" : ""} ${p.edible.length ? "" : "empty"}" data-doll="food" title="${esc(tip)}">
${id ? item(id).icon : glyph("two-coins", "#e0b04a")}${id ? `<span class="swap-qty">${fmt(p.bank[id])}</span>` : ""}</button>`;
const none = !p.edible.length;
const tip = none ? "No food in your bank" : id ? `Food: ${item(id).name}, heals ${item(id).heal}` : "Food: cheapest first";
return `<button class="doll-slot ${picked ? "on" : ""} ${none ? "starving" : ""}" data-doll="food" title="${esc(tip)}">
${none ? glyph("hot-meal", "#e2645c") : id ? item(id).icon : glyph("two-coins", "#e0b04a")}${id ? `<span class="swap-qty">${fmt(p.bank[id])}</span>` : ""}</button>`;
}
function foodPanel(p) {