diff --git a/packages/frontend/assets/drop-and-fusion/gameover.png b/packages/frontend/assets/drop-and-fusion/gameover.png new file mode 100644 index 0000000000..8b622577ca Binary files /dev/null and b/packages/frontend/assets/drop-and-fusion/gameover.png differ diff --git a/packages/frontend/src/components/MkPlusOneEffect.vue b/packages/frontend/src/components/MkPlusOneEffect.vue index 6feb85d8de..e5e5a9edf4 100644 --- a/packages/frontend/src/components/MkPlusOneEffect.vue +++ b/packages/frontend/src/components/MkPlusOneEffect.vue @@ -42,6 +42,7 @@ onMounted(() => { <style lang="scss" module> .root { + user-select: none; pointer-events: none; position: fixed; width: 128px; diff --git a/packages/frontend/src/pages/drop-and-fusion.vue b/packages/frontend/src/pages/drop-and-fusion.vue index d4233c696f..4b5c3930ba 100644 --- a/packages/frontend/src/pages/drop-and-fusion.vue +++ b/packages/frontend/src/pages/drop-and-fusion.vue @@ -82,9 +82,14 @@ SPDX-License-Identifier: AGPL-3.0-only <div :class="$style.dropGuide" :style="{ left: (mouseX - 2) + 'px' }"/> </template> <div v-if="gameOver" :class="$style.gameOverLabel"> - <div>GAME OVER!</div> - <div>SCORE: <MkNumber :value="score"/></div> - <MkButton primary rounded inline @click="share">Share</MkButton> + <div class="_gaps_s"> + <img src="/client-assets/drop-and-fusion/gameover.png" style="width: 200px; max-width: 100%; display: block; margin: auto; margin-bottom: -5px;"/> + <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>