wi
This commit is contained in:
parent
672644514d
commit
d4f2f9623f
16
WORKLOG.md
16
WORKLOG.md
@ -12,6 +12,22 @@ _ntr_
|
||||
* animation effects
|
||||
* vbox combine / buy / equip etc
|
||||
* background music
|
||||
* effects rework
|
||||
|
||||
Siphon =
|
||||
[
|
||||
DamageBlue(50%),
|
||||
Apply(
|
||||
Siphon(2T)
|
||||
- Siphoning(2T)
|
||||
),
|
||||
]
|
||||
|
||||
Hexagon Set
|
||||
- Pick Colour
|
||||
- Random Walk
|
||||
- Draw hex
|
||||
- Increase intensity for each visit
|
||||
|
||||
_mashy_
|
||||
* buy from preview if you have the required bases in vbox / inventory
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
.instance {
|
||||
overflow: hidden;
|
||||
display: grid;
|
||||
grid-template-columns: min-content minmax(min-content, 1fr);
|
||||
grid-template-columns: 3fr minmax(min-content, 6fr);
|
||||
grid-template-rows: min-content 1fr;
|
||||
|
||||
grid-template-areas:
|
||||
|
||||
@ -125,7 +125,7 @@ button, input {
|
||||
font-family: 'Jura';
|
||||
color: whitesmoke;
|
||||
height: auto;
|
||||
border-width: 0.1em;
|
||||
border-width: 0.2em;
|
||||
border-color: @gray-exists;
|
||||
letter-spacing: 0.25em;
|
||||
box-sizing: border-box;
|
||||
|
||||
@ -2,40 +2,38 @@
|
||||
align-content: space-between;
|
||||
grid-area: vbox;
|
||||
display: grid;
|
||||
grid-template-rows: 9.5em 2.5em 4.5em min-content;
|
||||
grid-template-columns: 8em 24em;
|
||||
grid-template-rows: 1fr min-content;
|
||||
grid-template-columns: 1fr 3fr;
|
||||
grid-template-areas:
|
||||
"store-hdr store"
|
||||
"stash-hdr store"
|
||||
"stash stash"
|
||||
"stash-hdr stash"
|
||||
"refund combiner";
|
||||
margin-bottom: 1em;
|
||||
line-height: 0;
|
||||
|
||||
.vbox-padding {
|
||||
margin-left: 0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
margin-top: 0.5em;
|
||||
margin-right: 0.5em;
|
||||
// immediate children
|
||||
> div {
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.store {
|
||||
grid-area: store;
|
||||
border-bottom: 0.1em solid @gray-exists;
|
||||
border-right: 0.1em solid @gray-exists;
|
||||
border-top: 0.1em solid @gray-exists;
|
||||
border-right: 0.2em solid @gray-exists;
|
||||
border-top: 0.2em solid @gray-exists;
|
||||
}
|
||||
|
||||
.store-hdr {
|
||||
grid-area: store-hdr;
|
||||
border-bottom: 0.1em solid @gray-exists;
|
||||
border-left: 0.1em solid @gray-exists;
|
||||
border-top: 0.1em solid @gray-exists;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
|
||||
text-align: center;
|
||||
border-left: 0.2em solid @gray-exists;
|
||||
border-top: 0.2em solid @gray-exists;
|
||||
|
||||
button {
|
||||
margin-top: 0.5em;
|
||||
margin: 1em 0 0 0;
|
||||
line-height: 1.6;
|
||||
height: 4em;
|
||||
letter-spacing: 0.1em;
|
||||
background-color: #421010;
|
||||
&:hover {
|
||||
@ -47,18 +45,17 @@
|
||||
|
||||
.combiner {
|
||||
grid-area: combiner;
|
||||
border-top: 0.1em solid @gray-exists;
|
||||
border-left: 0.1em solid @gray-exists;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
padding: 0.5em 0 0 0;
|
||||
|
||||
.vbox-padding {
|
||||
margin-right: 0em;
|
||||
margin-bottom: 0em;
|
||||
}
|
||||
|
||||
button {
|
||||
height: 3em;
|
||||
letter-spacing: 0.1em;
|
||||
background-color: #996100;
|
||||
&[disabled] {
|
||||
@ -69,32 +66,39 @@
|
||||
|
||||
.stash {
|
||||
grid-area: stash;
|
||||
.vbox-padding {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
grid-gap: 0.5em 1em;
|
||||
|
||||
align-items: center;
|
||||
}
|
||||
border-right: 0.1em solid @gray-exists;
|
||||
border-left: 0.1em solid @gray-exists;
|
||||
padding: 0.5em;
|
||||
border: 0.2em solid @gray-exists;
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
.stash-hdr {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
justify-content: center;
|
||||
|
||||
grid-area: stash-hdr;
|
||||
border-left: 0.1em solid @gray-exists;
|
||||
border-right: 0.1em solid @gray-exists;
|
||||
text-align: center;
|
||||
border: 0.2em solid @gray-exists;
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
.refund {
|
||||
padding: 0.5em 0.5em 0 0;
|
||||
|
||||
button {
|
||||
line-height: 1.4;
|
||||
height: 3em;
|
||||
letter-spacing: 0.1em;
|
||||
background-color: #996100;
|
||||
}
|
||||
border-left: 0.1em solid @gray-exists;
|
||||
border-bottom: 0.1em solid @gray-exists;
|
||||
|
||||
.vbox-padding {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.vbox-hdr {
|
||||
@ -115,14 +119,12 @@
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-gap: 0.5em 1em;
|
||||
align-items: center;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.vbox-btn {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
background-color: @gray-box;
|
||||
height: 3em;
|
||||
line-height: 1em;
|
||||
border-width: 0;
|
||||
|
||||
@ -153,7 +155,7 @@
|
||||
}
|
||||
|
||||
button {
|
||||
height: 3.25em;
|
||||
height: 4.5em;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
|
||||
|
||||
@ -52,7 +52,6 @@ function combinerBtn(props) {
|
||||
}
|
||||
return (
|
||||
<div class='combiner'>
|
||||
<div class='vbox-padding'>
|
||||
<button
|
||||
class='vbox-btn'
|
||||
disabled={!mouseEvent}
|
||||
@ -61,7 +60,6 @@ function combinerBtn(props) {
|
||||
{text}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@ -177,7 +177,6 @@ class Vbox extends preact.Component {
|
||||
function storeHdr() {
|
||||
return (
|
||||
<div class="store-hdr">
|
||||
<div class='vbox-padding'>
|
||||
<h3
|
||||
onTouchStart={e => e.target.scrollIntoView(true)}
|
||||
onMouseOver={e => vboxHover(e, 'store')}> STORE
|
||||
@ -198,19 +197,16 @@ class Vbox extends preact.Component {
|
||||
2b
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function stashHdr() {
|
||||
return (
|
||||
<div class='stash-hdr'>
|
||||
<div class='vbox-padding'>
|
||||
<h3 onTouchStart={e => e.target.scrollIntoView(true)}
|
||||
onMouseOver={e => vboxHover(e, 'stash')}> STASH
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
function refundBtn() {
|
||||
@ -221,7 +217,6 @@ class Vbox extends preact.Component {
|
||||
&& instance.time_control === 'Practice' && instance.rounds.length === 1;
|
||||
return (
|
||||
<div class='refund'>
|
||||
<div class='vbox-padding'>
|
||||
<button
|
||||
disabled={tutorialDisabled || !refund}
|
||||
class='vbox-btn'
|
||||
@ -234,7 +229,6 @@ class Vbox extends preact.Component {
|
||||
{refund}b
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@ -99,10 +99,8 @@ function stashElement(props) {
|
||||
onDragOver={ev => ev.preventDefault()}
|
||||
onDrop={stashClick}
|
||||
>
|
||||
<div class='vbox-padding'>
|
||||
{range(0, 4).map(i => stashBtn(vbox.bound[i], i))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@ -65,7 +65,6 @@ function storeElement(props) {
|
||||
return (
|
||||
<div class='store'
|
||||
onClick={e => e.stopPropagation()}>
|
||||
<div class='vbox-padding'>
|
||||
<div class="vbox-colours">
|
||||
{range(0, 6).map(i => availableBtn(vbox.free[0][i], 0, i))}
|
||||
</div>
|
||||
@ -74,7 +73,6 @@ function storeElement(props) {
|
||||
{range(0, 3).map(i => availableBtn(vbox.free[2][i], 2, i))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user