This commit is contained in:
Mashy 2019-11-20 23:07:44 +10:00
parent e53983db98
commit 3dddf4b1a8
4 changed files with 89 additions and 63 deletions

View File

@ -1,6 +1,8 @@
# WORK WORK
## NOW
* add combine between all of shop and stash, stash size -> 4
*PRODUCTION*
* can't reset password without knowing password =\

View File

@ -1,7 +1,7 @@
.instance {
overflow: hidden;
display: grid;
grid-template-columns: 1fr minmax(min-content, 1fr);
grid-template-columns: min-content minmax(min-content, 1fr);
grid-template-rows: min-content 1fr;
grid-template-areas:

View File

@ -3,46 +3,61 @@
align-content: space-between;
grid-area: vbox;
display: grid;
grid-template-rows: min-content 3.5em min-content 1em min-content 3.5em min-content;
grid-template-columns: 7em 1em 25em;
grid-template-rows: 9em 3em 2em min-content;
grid-template-columns: 7em 25em;
grid-template-areas:
"shop-hdr . shop"
". . shop"
"combiner . shop"
"combiner . ."
"combiner . stash"
". . stash"
"stash-hdr . stash";
"shop-hdr shop"
"combiner shop"
"combiner stash"
"stash-hdr stash";
border-top: 0.1em solid @gray-exists;
border-right: 0.1em solid @gray-exists;
border-bottom: 0.1em solid @gray-exists;
margin-bottom: 1em;
line-height: 0;
.items {
margin-left: 1em;
margin-bottom: 1em;
margin-top: 0.5em;
margin-right: 1em;
}
.shop {
grid-area: shop;
border-bottom: 0.1em solid @gray-exists;
}
.shop-hdr {
grid-area: shop-hdr;
display: flex;
flex-direction: column;
border-bottom: 0.1em solid @gray-exists;
border-left: 0.1em solid @gray-exists;
}
.combiner {
grid-area: combiner;
display: flex;
flex-direction: column;
border-right: 0.1em solid @gray-exists;
}
.stash {
grid-area: stash;
display: flex;
flex-direction: column;
}
.stash-hdr {
grid-area: stash-hdr;
display: flex;
flex-direction: column;
justify-content: flex-end;
border-left: 0.1em solid @gray-exists;
border-top: 0.1em solid @gray-exists;
}
.vbox-hdr {
@ -109,7 +124,7 @@
}
button {
height: 4em;
height: 3.25em;
margin: 0;
width: 100%;
@ -138,7 +153,7 @@
// figures don't scale well
figure {
svg {
height: 2em;
height: 1.5em;
stroke-width: 0.5em;
}

View File

@ -234,6 +234,7 @@ class Vbox extends preact.Component {
return (
<div class='shop'
onClick={e => e.stopPropagation()}>
<div class='items'>
<div class="vbox-colours">
{range(0, 6).map(i => availableBtn(vbox.free[0][i], 0, i))}
</div>
@ -241,7 +242,7 @@ class Vbox extends preact.Component {
{range(0, 3).map(i => availableBtn(vbox.free[1][i], 1, i))}
{range(0, 3).map(i => availableBtn(vbox.free[2][i], 2, i))}
</div>
</div>
</div>
);
}
@ -249,6 +250,7 @@ class Vbox extends preact.Component {
function vboxHdr() {
return (
<div class="shop-hdr">
<div class='items'>
<h3
onTouchStart={e => e.target.scrollIntoView(true)}
onMouseOver={e => hoverInfo(e, 'vbox')}> VBOX
@ -268,6 +270,7 @@ class Vbox extends preact.Component {
2b
</button>
</div>
</div>
);
}
//
@ -375,6 +378,7 @@ class Vbox extends preact.Component {
}
return (
<div class='combiner'>
<div clas='items'>
<button
class='vbox-btn'
disabled={!mouseEvent}
@ -383,6 +387,7 @@ class Vbox extends preact.Component {
{text}
</button>
</div>
</div>
);
}
@ -401,16 +406,19 @@ class Vbox extends preact.Component {
onDragOver={ev => ev.preventDefault()}
onDrop={inventoryClick}
>
<div class='items'>
<div class={`vbox-items ${reclaiming ? 'reclaiming' : ''}`}>
{range(0, 6).map(i => inventoryBtn(vbox.bound[i], i))}
</div>
</div>
</div>
);
}
function inventoryHdr() {
return (
<div class={`stash-hdr ${reclaiming ? 'reclaiming' : ''}`}>
<div class='items'>
<h3
onTouchStart={e => e.target.scrollIntoView(true)}
onMouseOver={e => hoverInfo(e, 'inventory')}> INVENTORY
@ -427,6 +435,7 @@ class Vbox extends preact.Component {
refund
</button>
</div>
</div>
);
}