2021-03-16 04:40:28 +01:00
|
|
|
import { Sleeve } from "../Sleeve";
|
|
|
|
import { numeralWrapper } from "../../../ui/numeralFormat";
|
|
|
|
import * as React from "react";
|
|
|
|
|
|
|
|
export function StatsElement(sleeve: Sleeve): React.ReactElement {
|
|
|
|
let style = {};
|
|
|
|
style = { textAlign: "right" };
|
|
|
|
return (<>
|
|
|
|
<table>
|
|
|
|
<tbody>
|
|
|
|
<tr>
|
|
|
|
<td className="character-hp-cell">HP: </td>
|
2021-03-31 06:45:21 +02:00
|
|
|
<td className="character-hp-cell" style={style}>{numeralWrapper.formatHp(sleeve.hp)} / {numeralWrapper.formatHp(sleeve.max_hp)}</td>
|
2021-03-16 04:40:28 +01:00
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td>City: </td>
|
|
|
|
<td style={style}>{sleeve.city}</td>
|
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td className="character-hack-cell">Hacking: </td>
|
2021-03-31 06:45:21 +02:00
|
|
|
<td className="character-hack-cell" style={style}>{numeralWrapper.formatSkill(sleeve.hacking_skill)}</td>
|
2021-03-16 04:40:28 +01:00
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td className="character-combat-cell">Strength: </td>
|
2021-03-31 06:45:21 +02:00
|
|
|
<td className="character-combat-cell" style={style}>{numeralWrapper.formatSkill(sleeve.strength)}</td>
|
2021-03-16 04:40:28 +01:00
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td className="character-combat-cell">Defense: </td>
|
2021-03-31 06:45:21 +02:00
|
|
|
<td className="character-combat-cell" style={style}>{numeralWrapper.formatSkill(sleeve.defense)}</td>
|
2021-03-16 04:40:28 +01:00
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td className="character-combat-cell">Dexterity: </td>
|
2021-03-31 06:45:21 +02:00
|
|
|
<td className="character-combat-cell" style={style}>{numeralWrapper.formatSkill(sleeve.dexterity)}</td>
|
2021-03-16 04:40:28 +01:00
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td className="character-combat-cell">Agility: </td>
|
2021-03-31 06:45:21 +02:00
|
|
|
<td className="character-combat-cell" style={style}>{numeralWrapper.formatSkill(sleeve.agility)}</td>
|
2021-03-16 04:40:28 +01:00
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td className="character-cha-cell">Charisma: </td>
|
2021-03-31 06:45:21 +02:00
|
|
|
<td className="character-cha-cell" style={style}>{numeralWrapper.formatSkill(sleeve.charisma)}</td>
|
2021-03-16 04:40:28 +01:00
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td className="character-int-cell">Shock: </td>
|
2021-03-31 06:45:21 +02:00
|
|
|
<td className="character-int-cell" style={style}>{numeralWrapper.formatShock(100 - sleeve.shock)}</td>
|
2021-03-16 04:40:28 +01:00
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td className="character-int-cell">Sync: </td>
|
2021-03-31 06:45:21 +02:00
|
|
|
<td className="character-int-cell" style={style}>{numeralWrapper.formatSync(sleeve.sync)}</td>
|
2021-03-16 04:40:28 +01:00
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td className="character-int-cell">Memory: </td>
|
2021-03-31 06:45:21 +02:00
|
|
|
<td className="character-int-cell" style={style}>{numeralWrapper.formatMemory(sleeve.memory)}</td>
|
2021-03-16 04:40:28 +01:00
|
|
|
</tr>
|
|
|
|
</tbody>
|
|
|
|
</table>
|
|
|
|
</>)
|
|
|
|
}
|