From e6b8c327e84262ac130e32c90bf78cf4031c3a57 Mon Sep 17 00:00:00 2001
From: rope <fredrik@nordhammer.it>
Date: Mon, 19 Oct 2026 10:57:55 +0100
Subject: [PATCH] Centre the Working label; glyphs on the building site

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 static/app.js     | 8 ++++----
 static/styles.css | 4 +++-
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/static/app.js b/static/app.js
index deb3ea8..ef5c5c8 100644
--- a/static/app.js
+++ b/static/app.js
@@ -488,9 +488,9 @@ function actionCard(a) {
   }
   if (a.special === "recon") extra = `<div class="small muted">+${a.recon} recon on the next event</div>`;
   const temple = S.city.buildings.temple?.level || 0;
-  if (a.special === "labour") extra = `<div class="small makes">🏗️ +${me.labour_per_action} labour per action</div>`;
+  if (a.special === "labour") extra = `<div class="small makes">${skillOf("construction").icon} +${me.labour_per_action} labour per action</div>`;
   if (a.special === "bury") extra = `<div class="small makes">${skillOf("prayer").icon} +${a.pp + temple} prayer points</div>`;
-  if (a.special === "offer") extra = `<div class="small makes">⛪ +${+(a.devotion * (1 + 0.25 * temple)).toFixed(1)} devotion for the city's ward</div>`;
+  if (a.special === "offer") extra = `<div class="small makes">${C.buildings.temple.icon} +${+(a.devotion * (1 + 0.25 * temple)).toFixed(1)} devotion for the city's ward</div>`;
   const made = Object.keys(a.outputs).map(itemStats).filter(Boolean);
   if (made.length) extra += `<div class="small makes">${made.join(" · ")}</div>`;
   return `
@@ -646,11 +646,11 @@ function siteBanner() {
   const hire = S.favours.builders;
   const working = me.action?.id === "labour";
   const builders = S.players.filter((p) => p.skill === "construction" && p.doing === "Work on the building site").map((p) => esc(p.name));
-  return `<div class="banner">🏗️<div class="grow">
+  return `<div class="banner"><span class="banner-ico">${skillOf("construction").icon}</span><div class="grow">
     <div class="site-head"><b>${work.repair ? "Repairing" : "Building"} ${esc(spec.name)}</b>
       <span class="muted small">${fmt(work.labour)} / ${fmt(work.needed)} labour</span>
       <span class="btns">
-        ${working ? `<span class="tag good">You're working on it</span>` : `<button class="btn sm primary" data-start="labour">Work on it</button>`}
+        ${working ? `<span class="btn sm working">Working</span>` : `<button class="btn sm primary" data-start="labour">Work on it</button>`}
         ${hire.why ? "" : `<button class="btn sm gold" data-favour="builders" ${me.favour < hire.cost ? "disabled" : ""} title="Adds half the labour that's left">Hire builders ${FAVOUR} ${fmt(hire.cost)}</button>`}
       </span></div>
     <div class="bar gold" style="margin-top:6px"><span style="width:${Math.min(100, work.labour / work.needed * 100)}%"></span></div>
diff --git a/static/styles.css b/static/styles.css
index 6e3c750..b8cf834 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -153,7 +153,7 @@ main { padding: 24px; max-width: 1200px; width: 100%; }
 .btn.danger { background: #6b2f2f; border-color: #8a3f3f; }
 .btn.gold { background: #6b5320; border-color: #8f6f2a; }
 .btn.sm { padding: 3px 9px; font-size: 13px; }
-.btns { display: flex; flex-wrap: wrap; gap: 6px; }
+.btns { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
 
 input[type=text], input[type=number], textarea {
   background: var(--bg); border: 1px solid var(--line); border-radius: 8px; padding: 7px 10px;
@@ -404,3 +404,5 @@ button.sheet-skill:hover { background: var(--panel-2); }
 .nav .ic .gi { width: 20px; height: 20px; vertical-align: middle; }
 .credit { margin: 14px 18px 0; font-size: 11.5px; color: var(--muted); }
 .credit a { color: var(--muted); }
+.btn.working { color: var(--good); border-color: rgba(92, 191, 106, .5); background: rgba(92, 191, 106, .1); cursor: default; }
+.banner-ico { font-size: 22px; display: flex; }