feat: create ReadySet, Playground, Highscroes components

client/src/components/Highscores.vue

@@ -0,0 +1,9 @@
+<template>
+  <p>Highscores.vue</p>
+</template>
+
+<script setup lang="ts">
+</script>
+
+<style lang="scss">
+</style>

client/src/components/Playground.vue

@@ -0,0 +1,9 @@
+<template>
+  <p>Playground.vue</p>
+</template>
+
+<script setup lang="ts">
+</script>
+
+<style lang="scss">
+</style>

client/src/components/ReadySet.vue

@@ -0,0 +1,10 @@
+<template>
+  <p>ReadySet.vue</p>
+  <p>{{ text }}</p>
+</template>
+
+<script setup lang="ts">
+defineProps<{
+  text: string,
+}>()
+</script>

client/src/pages/play.vue

@@ -9,9 +9,9 @@
       <div class="page-play__playfield-content">
         <Lobby v-if="game.state === 'idle'" />
         <CollectQuotes v-if="game.state === 'collect'" />
-        <!-- <ReadySet v-if="game.state === 'ready-set'" :text="game.phase" /> -->
+        <ReadySet v-if="game.state === 'ready-set'" :text="game.phase" />
-        <!-- <Play v-if="game.state === 'play'" /> -->
+        <Playground v-if="game.state === 'play'" />
-        <!-- <Final v-if="game.state === 'final'" /> -->
+        <Highscores v-if="game.state === 'final'" />
       </div>
       <EngineDebug v-if="showEngineDebug" class="page-play__playfield-debug" />
     </div>