Bold player names on their turn

kcgidw · May 13, 2020 · 61dcc18 · 61dcc18
1 parent 380c06d
commit 61dcc18
Showing 1 changed file with 6 additions and 1 deletion.
diff --git a/src/public/js/player-statuses-list.vue b/src/public/js/player-statuses-list.vue
@@ -3,7 +3,9 @@
 		<li v-for="u in users" :key="'0' + u.name">
 			<span v-if="u.connected" :style="{ color: color(u) }"><user-icon /></span>
 			<span v-else><wifi-off-icon /></span>
-			<span class="username" :style="{ color: color(u) }">{{ u.name }}</span>
+			<span :style="{ color: color(u), fontWeight: isMyTurn(u) ? 'bold' : 'normal' }">{{
+				u.name
+			}}</span>
 		</li>
 	</ul>
 </template>
@@ -26,6 +28,9 @@ export default {
 		color(user) {
 			return Store.state.gameState.getUserColor(user.name);
 		},
+		isMyTurn(user) {
+			return Store.state.gameState.whoseTurn === user.name;
+		},
 	},
 };
 </script>