enhance(frontend): tweak ui
This commit is contained in:
parent
0d49e94982
commit
0d830d720a
3 changed files with 9 additions and 3 deletions
BIN
packages/frontend/assets/drop-and-fusion/gameover.png
Normal file
BIN
packages/frontend/assets/drop-and-fusion/gameover.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 66 KiB |
|
@ -42,6 +42,7 @@ onMounted(() => {
|
||||||
|
|
||||||
<style lang="scss" module>
|
<style lang="scss" module>
|
||||||
.root {
|
.root {
|
||||||
|
user-select: none;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
width: 128px;
|
width: 128px;
|
||||||
|
|
|
@ -82,9 +82,14 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<div :class="$style.dropGuide" :style="{ left: (mouseX - 2) + 'px' }"/>
|
<div :class="$style.dropGuide" :style="{ left: (mouseX - 2) + 'px' }"/>
|
||||||
</template>
|
</template>
|
||||||
<div v-if="gameOver" :class="$style.gameOverLabel">
|
<div v-if="gameOver" :class="$style.gameOverLabel">
|
||||||
<div>GAME OVER!</div>
|
<div class="_gaps_s">
|
||||||
<div>SCORE: <MkNumber :value="score"/></div>
|
<img src="/client-assets/drop-and-fusion/gameover.png" style="width: 200px; max-width: 100%; display: block; margin: auto; margin-bottom: -5px;"/>
|
||||||
<MkButton primary rounded inline @click="share">Share</MkButton>
|
<div>SCORE: <MkNumber :value="score"/></div>
|
||||||
|
<div class="_buttonsCenter">
|
||||||
|
<MkButton primary rounded @click="restart">Restart</MkButton>
|
||||||
|
<MkButton primary rounded @click="share">Share</MkButton>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in a new issue