diff --git a/client/cryps.css b/client/cryps.css index 4b98de1e..3ee86ce6 100644 --- a/client/cryps.css +++ b/client/cryps.css @@ -634,6 +634,11 @@ table td svg { height: 100%; } +.cryp-box .effects { + height: 100%; + font-size: 1.5em; +} + .cryp-skill-btn { flex: 1 1 100%; font-size: 16pt; @@ -708,14 +713,8 @@ table td svg { padding: 0; } -.team-opponent .cryp-box-top { - flex-flow: column; - justify-content: center; - align-items: stretch; -} - -.team-opponent .cryp-box-top figure { - flex: 1; +.team-opponent .cryp-box .img { + order: 5; } /*.logs { diff --git a/client/src/components/game.component.jsx b/client/src/components/game.component.jsx index 809fef49..d3604a3a 100644 --- a/client/src/components/game.component.jsx +++ b/client/src/components/game.component.jsx @@ -153,11 +153,18 @@ function GamePanel(props) { className={`cryp-box ${ko} ${classes}`} style={ activeSkill ? { cursor: 'pointer' } : {}} onClick={() => selectSkillTarget(cryp.id)} > -
- {crypAvatar(cryp.name)} - {combatTextEl} -
{cryp.name}
-
+
+
selectSkillTarget(cryp.id)} > + {crypAvatar(cryp.name)} + {combatTextEl} +
{cryp.name}
+
+
+ {cryp.effects.map(c => {c.effect} - {c.duration}T)} +
+
{stats}