Amount field for donate/give/sell

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

game.py

@@ -6089,6 +6089,7 @@ PATCH_NOTES = [
         ("fix", "Make box is wider: 1,000 fits."),
         ("new", "Fittings: ✓ Fitted on ones the town has (✓ Paused while damaged)."),
         ("fix", "Council threat card names the dragon or raid band, not always \"Raiders\"."),
+        ("new", "Donate, Give, Sell: type an amount (starts at 1). 1/10/100 buttons gone, All stays."),
     ]},
     {"date": "2026-10-25", "title": "Titles", "notes": [
         ("new", "🏆 Achievements (under You): 127. Patterns, uniques, titles, emblems, looks, home. Tracks only, awards nothing."),

static/app.js

@@ -1801,8 +1801,8 @@ function itemPanel(id) {
   const merchant = S.city.merchant_until > serverNow();
   const price = it.value * (merchant ? 1.5 : 1);
   const others = S.players.filter((p) => p.id !== S.uid);
-  const qtyBtns = (attr) => [1, 10, 100].filter((q) => q <= have).map((q) => `<button class="btn sm" ${attr}="${id}" data-qty="${q}">${q}</button>`).join("")
+  const qtyBox = (kind, label) => `<form data-form="qty" data-kind="${kind}" data-item="${id}" class="make sm"><button class="btn sm">${label}</button><input type="number" min="1" max="${have}" value="1" data-keep="${kind}-${id}"></form>`
-    + `<button class="btn sm" ${attr}="${id}" data-qty="all">All (${fmt(have)})</button>`;
+    + `<button class="btn sm" data-${kind}="${id}" data-qty="all">All (${fmt(have)})</button>`;
   return `<div class="panel item-panel">
     <div class="ico">${it.icon}</div>
     <h3>${esc(it.name)}</h3>
@@ -1819,11 +1819,11 @@ function itemPanel(id) {
     ${it.relic ? `<div class="row small muted">Reforges masterworks with a pattern from ${esc(C.actions.find((a) => a.id === it.relic).name)}.</div>` : ""}
     ${it.food ? `<div class="row small muted">Feeds ${it.food} townsfolk for 2 days.</div>` : ""}
     ${C.city_uses[id].length
-      ? `<div class="row"><div class="k">Donate to the city · +${it.value} favour each</div><div class="btns">${qtyBtns("data-donate")}</div>
+      ? `<div class="row"><div class="k">Donate to the city · +${it.value} favour each</div><div class="btns">${qtyBox("donate", "Donate")}</div>
           <div class="small muted">Used for ${esc(listing(C.city_uses[id]))}.</div></div>`
       : `<div class="row small muted">The city has no use for this.</div>`}
-    ${others.length ? `<div class="row"><div class="k">Give to <select data-keep="give-to">${others.map((p) => `<option value="${esc(p.id)}">${esc(p.name)}</option>`).join("")}</select></div><div class="btns">${qtyBtns("data-give")}</div></div>` : ""}
+    ${others.length ? `<div class="row"><div class="k">Give to <select data-keep="give-to">${others.map((p) => `<option value="${esc(p.id)}">${esc(p.name)}</option>`).join("")}</select></div><div class="btns">${qtyBox("give", "Give")}</div></div>` : ""}
-    <div class="row"><div class="k">Sell</div><div class="btns">${qtyBtns("data-sell")}</div></div>
+    <div class="row"><div class="k">Sell</div><div class="btns">${qtyBox("sell", "Sell")}</div></div>
     <div class="row"><button class="btn sm" data-select="">Close</button></div>
   </div>${goldPanel()}`;
 }
@@ -2981,6 +2981,12 @@ document.addEventListener("submit", async (e) => {
     field.value = "1";
     return act("/api/action", { id: form.dataset.id, once: n });
   }
+  if (form.dataset.form === "qty") {
+    const n = Math.floor(Number(value)), kind = form.dataset.kind;
+    if (!(n >= 1)) return toast("At least 1", "bad");
+    field.value = "1";
+    return act(`/api/${kind}`, { item: form.dataset.item, qty: n, ...(kind === "give" && { to: $("[data-keep=give-to]").value }) });
+  }
   if (form.dataset.form === "gold") {
     field.value = "";
     return act("/api/donate", { item: "gold", qty: Number(value) });

static/styles.css

@@ -710,6 +710,7 @@ button.sheet-skill:hover { background: var(--panel-2); }
 .make { display: flex; }
 .make .btn { border-top-right-radius: 0; border-bottom-right-radius: 0; }
 .make input { width: 60px; padding-inline: 8px; appearance: textfield; border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: -1px; }
+.make.sm input { width: 70px; padding-block: 3px; font-size: 13px; }
 .make input::-webkit-inner-spin-button, .make input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
 .reward-input { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
 .reward-input input { width: 110px; }