From 4101221eb125484cd65ee357a6d9ace4e6b36b6d Mon Sep 17 00:00:00 2001 From: slaguru666 <111923774+slaguru666@users.noreply.github.com> Date: Wed, 12 Aug 2026 16:12:47 +0100 Subject: [PATCH] Fill the empty space in the actor sheet header MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The header was one flex row — identity, then vitals pinned to the top right. The identity column is tall (name, rank, marksmanship, the two style hints, two age fields) and the vitals row is short, so everything under the vitals was empty blue: roughly a third of the header. Split it into two columns and stack the status column: vitals, then the derived numbers, then the readied weapons. Both of those already existed as full-width bands directly below, so nothing new is on screen — it is the same content arranged to use the space, and it puts damage modifier and readied weapons next to hit points, which is where they are read during a fight. Two sizing traps, both found by measuring rather than looking: The status column is an auto track, so its width came from max-content — the readied-weapons line, whose length is whatever the weapon names happen to be. That crushed identity into a 190px gutter with the name truncated to "Marta Hollow". width:0 + min-width:100% keeps those panels out of the measurement so the column is sized by the vitals and they stretch to match. The vitals row is wide enough on its own to do the same thing, so the columns are proportional (1fr / 1.6fr) and the vitals now wrap. Measured at 1020px: header 367px tall before, 266px after, columns 241 and 235 so they end level. At 1400px: 214px tall, columns 189 and 158, vitals unwrapped. Co-Authored-By: Claude Opus 5 --- styles/ringbrp.css | 28 +++++++++++++-- templates/character-sheet.hbs | 68 ++++++++++++++++++----------------- 2 files changed, 62 insertions(+), 34 deletions(-) diff --git a/styles/ringbrp.css b/styles/ringbrp.css index da70305..94abe80 100644 --- a/styles/ringbrp.css +++ b/styles/ringbrp.css @@ -139,12 +139,36 @@ Header — identity ============================================================ */ +/* Two columns: who they are on the left, how they are on the right. + The vitals row is the widest thing in the right column, so the derived numbers + and the readied weapons stack underneath it and take their width from it. That + is what fills the header — it used to be one flex row with the vitals pinned to + the top, which left the whole area under them empty. It also puts damage + modifier and readied weapons next to hit points, where they are actually read. */ .rb-header { - display: flex; gap: 14px; align-items: flex-start; + display: grid; + grid-template-columns: minmax(320px, 1fr) minmax(0, 1.6fr); + gap: 10px 14px; align-items: start; padding: 12px 14px 10px; background: transparent; border-bottom: 3px solid var(--rb-yellow); } +.rb-ident { display: flex; gap: 14px; align-items: flex-start; min-width: 0; } +.rb-status { display: flex; flex-direction: column; gap: 8px; min-width: 0; } +/* Inside the header these two are panels, not full-width bands, so they lose the + page-width padding and rule and gain a border of their own. */ +.rb-status > .rb-derived, +.rb-status > .rb-weaponstrip { + padding: 6px 10px; border: 1px solid var(--rb-hairline); + /* width:0 + min-width:100% keeps these OUT of the auto track's max-content + measurement, so the column is sized by the vitals row and these stretch to + match it. Without it the readied-weapons line — which is as long as the + weapon names happen to be — sets the column width and crushes the portrait + and name into a 190px gutter. */ + width: 0; min-width: 100%; +} +.rb-status > .rb-derived { gap: 14px; } +.rb-status > .rb-weaponstrip { gap: 12px; } .rb-portrait { width: 84px; height: 84px; flex: 0 0 84px; object-fit: cover; border: 1px solid var(--rb-line); background: var(--rb-void); @@ -179,7 +203,7 @@ } /* --- vitals: HP reads as one expression --- */ -.rb-vitals { display: flex; gap: 8px; align-items: stretch; } +.rb-vitals { display: flex; gap: 8px; align-items: stretch; flex-wrap: wrap; } .rb-vitals > div { min-width: 78px; padding: 6px 10px; text-align: center; background: var(--rb-void); border: 1px solid var(--rb-line); diff --git a/templates/character-sheet.hbs b/templates/character-sheet.hbs index 3fb2a61..da31033 100644 --- a/templates/character-sheet.hbs +++ b/templates/character-sheet.hbs @@ -1,6 +1,7 @@
+
@@ -26,7 +27,9 @@
{{/if}}
+ +
{{localize "RINGBRP.Sheet.HP"}} @@ -76,6 +79,39 @@
{{/if}}
+ +
+
+ {{localize "RINGBRP.Sheet.DamageMod"}}{{sys.damageModifier}} +
+
+ {{localize "RINGBRP.Sheet.MOV"}}{{sys.mov}} +
+
+ {{localize "RINGBRP.Sheet.Carry"}} + {{sys.carriedKg}} / {{sys.freeCarryKg}} kg +
+
+ + + +
+
+ +
+ {{localize "RINGBRP.Sheet.Readied"}} + {{#each equippedWeapons as |w|}} + + {{w.name}} + {{#if (rbEq w.system.damage.mode "byBand")}}{{w.system.damage.short}}/{{w.system.damage.medium}}/{{w.system.damage.long}}{{else}}{{w.system.damage.formula}}{{/if}} + {{#if w.system.rangeSummary}}{{w.system.rangeSummary}}{{/if}} + {{#if w.system.ammo.capacity}}{{w.system.ammo.loaded}}/{{w.system.ammo.capacity}}{{/if}} + + {{else}} + {{localize "RINGBRP.Sheet.NothingReadied"}} + {{/each}} +
+
@@ -90,38 +126,6 @@ {{/each}}
-
-
- {{localize "RINGBRP.Sheet.DamageMod"}}{{sys.damageModifier}} -
-
- {{localize "RINGBRP.Sheet.MOV"}}{{sys.mov}} -
-
- {{localize "RINGBRP.Sheet.Carry"}} - {{sys.carriedKg}} / {{sys.freeCarryKg}} kg -
-
- - - -
-
- -
- {{localize "RINGBRP.Sheet.Readied"}} - {{#each equippedWeapons as |w|}} - - {{w.name}} - {{#if (rbEq w.system.damage.mode "byBand")}}{{w.system.damage.short}}/{{w.system.damage.medium}}/{{w.system.damage.long}}{{else}}{{w.system.damage.formula}}{{/if}} - {{#if w.system.rangeSummary}}{{w.system.rangeSummary}}{{/if}} - {{#if w.system.ammo.capacity}}{{w.system.ammo.loaded}}/{{w.system.ammo.capacity}}{{/if}} - - {{else}} - {{localize "RINGBRP.Sheet.NothingReadied"}} - {{/each}} -
-