Spaces:
Runtime error
Runtime error
| <script lang="ts"> | |
| import { fade } from 'svelte/transition'; | |
| import { GameState } from '../types'; | |
| import { createEventDispatcher } from 'svelte'; | |
| const dispatch = createEventDispatcher(); | |
| export let gameState: GameState; | |
| export let message: string | null = null; | |
| </script> | |
| <div class="message" transition:fade> | |
| {message} | |
| {#if gameState === GameState.FAIL} | |
| <div class="font-light flex-1 text-xs sm:text-base text-center"> | |
| <button | |
| on:click={() => dispatch('restart')} | |
| class="hover:no-underline underline underline-offset-2 hover:scale-105 transition-all duration-200 ease-in-out" | |
| >Try Again</button | |
| > | |
| </div> | |
| {/if} | |
| </div> | |
| <style lang="postcss" scoped> | |
| .message { | |
| @apply absolute left-1/2 top-1/2 text-white bg-black bg-opacity-80 font-semibold | |
| text-center p-5 z-20 rounded-sm -translate-x-1/2 transition-opacity duration-300 ease-in-out; | |
| } | |
| </style> | |