rope/guildhall
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Mood bar: gradient, growing / falling

Browse source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
rope 2026-10-28 15:36:38 +00:00
parent 9daa648017
commit faf186f102
3 changed files with 10 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

8
static/styles.css
View file

@ -879,10 +879,10 @@ button.swatch { width: 36px; height: 36px; }
.qp-then .x { background: none; border: 0; color: var(--muted); cursor: pointer; font-size: 11px; padding: 0 2px; }
/* Townsfolk mood */
.mood-bar { position: relative; height: 12px; border-radius: 99px; margin: 4px 0 8px;
background: linear-gradient(90deg, #e2645c33, #e3a04333 40%, #5cbf6a33); }
.mood-bar > span { display: block; height: 100%; border-radius: 99px; background: var(--c); }
.mood-bar > i { position: absolute; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; background: var(--text); border-radius: 2px; }
/* The whole bar is the red → yellow → green scale; the part above the mood is covered by the track. */
.mood-bar { position: relative; height: 12px; border-radius: 99px; margin: 4px 0 8px; overflow: hidden;
background: linear-gradient(90deg, var(--bad), #e3c34a 50%, var(--good)); }
.mood-bar > span { position: absolute; top: 0; right: 0; bottom: 0; background: var(--bg); }
.mood-effects { color: var(--muted); margin-bottom: 12px; }
.needs { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.need-head { display: flex; justify-content: space-between; margin-bottom: 8px; }