Begin work on component for submitting the game code
This commit is contained in:
parent
1b9ba8ef8d
commit
c2ad722758
1 changed files with 51 additions and 0 deletions
51
src/components/GameCode.vue
Normal file
51
src/components/GameCode.vue
Normal file
|
|
@ -0,0 +1,51 @@
|
||||||
|
<template>
|
||||||
|
<div id="game_code_entry">
|
||||||
|
<h2>
|
||||||
|
Enter a game code:
|
||||||
|
</h2>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
name="Game Code"
|
||||||
|
v-model="game_code"
|
||||||
|
@keyup.enter="submit_game_code()"
|
||||||
|
>
|
||||||
|
<br>
|
||||||
|
<button
|
||||||
|
@onclick.stop="submit_game_code()"
|
||||||
|
>
|
||||||
|
Confirm URL
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'GameCodeEntry',
|
||||||
|
components: {},
|
||||||
|
data() {return {
|
||||||
|
game_code: ``,
|
||||||
|
}},
|
||||||
|
methods: {
|
||||||
|
submit_game_code() {
|
||||||
|
if (this.game_code.length > 0) {
|
||||||
|
this.$emit(`set-game-code`, this.game_code);
|
||||||
|
} else {
|
||||||
|
alert(`Invalid game code. Must have a code`)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="stylus">
|
||||||
|
#game_code_entry {
|
||||||
|
text-align: center
|
||||||
|
height: 100vh
|
||||||
|
width: 33vw
|
||||||
|
margin: 0 auto
|
||||||
|
|
||||||
|
@media screen and (max-width: 600px) {
|
||||||
|
width: 90vw
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Add table
Add a link
Reference in a new issue