2 Commits
0.7.9 ... 0.8.0

Author SHA1 Message Date
Lukas
502adca81b Fix layout shift on turn change and restore concentration border width
All checks were successful
CI / check (push) Successful in 1m26s
CI / build-image (push) Successful in 21s
Give all combatant rows a consistent border-l-2 + border on all sides
(transparent when inactive) so toggling active/concentration states
never changes the row's box size. Show purple left border when a
combatant is both active and concentrating.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-16 13:57:02 +01:00
Lukas
12e8bf6e69 Constrain rename input width to prevent row layout breakage
Cap the editable name input at max-w-48 so it doesn't stretch the
full column width and push icons/conditions onto separate lines.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-16 13:50:48 +01:00

View File

@@ -79,7 +79,7 @@ function EditableName({
ref={inputRef} ref={inputRef}
type="text" type="text"
value={draft} value={draft}
className="h-7 text-sm" className="h-7 max-w-48 text-sm"
onChange={(e) => setDraft(e.target.value)} onChange={(e) => setDraft(e.target.value)}
onBlur={commit} onBlur={commit}
onKeyDown={(e) => { onKeyDown={(e) => {
@@ -365,9 +365,13 @@ function rowBorderClass(
isActive: boolean, isActive: boolean,
isConcentrating: boolean | undefined, isConcentrating: boolean | undefined,
): string { ): string {
if (isActive) return "border border-accent/40 bg-accent/10 card-glow"; if (isActive && isConcentrating)
if (isConcentrating) return "border-l-2 border-l-purple-400"; return "border border-l-2 border-accent/40 border-l-purple-400 bg-accent/10 card-glow";
return "border-l-2 border-l-transparent"; if (isActive)
return "border border-l-2 border-accent/40 bg-accent/10 card-glow";
if (isConcentrating)
return "border border-l-2 border-transparent border-l-purple-400";
return "border border-l-2 border-transparent";
} }
function concentrationIconClass( function concentrationIconClass(