fix styles

This commit is contained in:
ntr 2019-09-11 12:29:09 +10:00
parent 73ae1e083d
commit b2658d5150
2 changed files with 32 additions and 21 deletions

View File

@ -125,6 +125,7 @@ section {
"vcons game"; "vcons game";
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
grid-template-rows: min-content 1fr;
.colour-info { .colour-info {
grid-area: vinfo; grid-area: vinfo;
@ -141,6 +142,10 @@ section {
} }
} }
.vbox-demo {
grid-area: vinfo;
}
.game-demo { .game-demo {
grid-area: game; grid-area: game;

View File

@ -106,33 +106,38 @@ function Demo(args) {
); );
} }
return (
<div class="news vbox-demo">
{inventoryElement()}
</div>
);
};
const vboxConstructs = () => {
const btnClass = equipping const btnClass = equipping
? 'equipping empty gray' ? 'equipping empty gray'
: 'empty gray'; : 'empty gray';
return ( return (
<div class="news"> <div class='construct-list'>
{inventoryElement()} {players[0].constructs.map((c, i) => (
<div class='construct-list'> <div class="instance-construct" key={i}>
{players[0].constructs.map((c, i) => ( <h2 class="name" >{c.name}</h2>
<div class="instance-construct" key={i}> <ConstructAvatar construct={c} />
<h2 class="name" >{c.name}</h2> <div class="skills">
<ConstructAvatar construct={c} /> {i === 0 && equipped
<div class="skills"> ? <button>Strike</button>
{i === 0 && equipped : <button disabled={!equipping} class={btnClass}>SKILL</button>
? <button>Strike</button> }
: <button disabled={!equipping} class={btnClass}>SKILL</button> <button disabled={!equipping} class={btnClass}>SKILL</button>
} <button disabled={!equipping} class={btnClass}>SKILL</button>
<button disabled={!equipping} class={btnClass}>SKILL</button>
<button disabled={!equipping} class={btnClass}>SKILL</button>
</div>
<div class="specs">
</div>
<div class="stats">
</div>
</div> </div>
))} <div class="specs">
</div> </div>
<div class="stats">
</div>
</div>
))}
</div> </div>
); );
}; };
@ -163,6 +168,7 @@ function Demo(args) {
return ( return (
<section class='demo'> <section class='demo'>
{vboxDemo()} {vboxDemo()}
{vboxConstructs()}
{gameDemo()} {gameDemo()}
</section> </section>
); );