From 64930fb22a6dd8aa82b02435eec06608c0d6fcc8 Mon Sep 17 00:00:00 2001
From: NilsUeter <nils.ueter@gmail.com>
Date: Mon, 8 May 2023 07:58:37 +0200
Subject: [PATCH] more responsive design for characteristics

---
 src/Roster.jsx | 73 +++++++++++++++++++++++++-------------------------
 1 file changed, 37 insertions(+), 36 deletions(-)

diff --git a/src/Roster.jsx b/src/Roster.jsx
index 8e57ef8..2c45b7a 100644
--- a/src/Roster.jsx
+++ b/src/Roster.jsx
@@ -392,44 +392,45 @@ const ModelStats = ({
 			<Characteristic title="SV" characteristic={save} index={index} />
 			<Characteristic title="W" characteristic={wounds} index={index} />
 			<Characteristic title="LD" characteristic={leadership} index={index} />
-
-			{showName && (
-				<div
-					style={{
-						marginTop: index === 0 ? 16 : 0,
-						marginLeft: -10,
-						whiteSpace: "nowrap",
-					}}
-				>
-					{name}
-				</div>
-			)}
-			{showWeapons && (
-				<div
-					style={{
-						marginTop: index === 0 ? 16 : 0,
-						marginLeft: -10,
-						fontSize: "0.7em",
-					}}
-				>
-					{modelListMatches.map((model, index) => (
-						<div key={model}>{model}</div>
-					))}
-				</div>
-			)}
-			{degradingStuff.length > 0 && (
-				<div
-					style={{
-						whiteSpace: "normal",
-						marginLeft: -10,
-						fontSize: "0.7em",
-					}}
-				>
-					{`Each time this model makes
+			<div>
+				{showName && (
+					<div
+						style={{
+							marginTop: index === 0 ? 16 : 0,
+							marginLeft: -10,
+							whiteSpace: "nowrap",
+						}}
+					>
+						{name}
+					</div>
+				)}
+				{showWeapons && (
+					<div
+						style={{
+							marginTop: index === 0 && !showName ? 16 : 0,
+							marginLeft: -10,
+							fontSize: "0.7em",
+						}}
+					>
+						{modelListMatches.map((model, index) => (
+							<div key={model}>{model}</div>
+						))}
+					</div>
+				)}
+				{degradingStuff.length > 0 && (
+					<div
+						style={{
+							whiteSpace: "normal",
+							marginLeft: -10,
+							fontSize: "0.7em",
+						}}
+					>
+						{`Each time this model makes
 							an attack, subtract 
 							${degradingStuff.join(" and ")}.`}
-				</div>
-			)}
+					</div>
+				)}
+			</div>
 		</div>
 	);
 };