blob: f1e79c4eb30f28cd6591974cd44f56dea5f3c359 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
|
<template>
<td v-for="i in length" :key="i">
<div
class="letter"
v-bind:class="{
correct: colors[i - 1] === 2,
wrongPosition: colors[i - 1] === 1,
}"
>
{{ trial[i - 1] ? trial[i - 1] : " " }}
</div>
</td>
</template>
<script setup lang="ts">
defineProps<{
length: number;
trial: string;
colors: number[];
finished: boolean;
}>();
</script>
<style scoped>
.letter.correct {
background-color: #008000;
}
.letter.wrongPosition {
background-color: #808000;
}
</style>
|