From b380fef99b278a30770d44c9bf0b30f69c3e3365 Mon Sep 17 00:00:00 2001
From: Oliver-Akins <Tyler.Akins1999@gmail.com>
Date: Tue, 26 Jan 2021 16:48:49 -0700
Subject: [PATCH] Add a card ID for if there are multiple guessers in the game

---
 web/src/components/Hand.vue | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/web/src/components/Hand.vue b/web/src/components/Hand.vue
index 342a5ab..1350b42 100644
--- a/web/src/components/Hand.vue
+++ b/web/src/components/Hand.vue
@@ -28,6 +28,12 @@
 				:key="`card_${cardIndex}`"
 				@click.self="handleCardClick(cardIndex)"
 			>
+				<span
+					class="card-id"
+					v-if="multipleGuessersOnTeam"
+				>
+					{{ cardIndex }}
+				</span>
 				<p class="card-text centre">
 					{{ questions[cardIndex - 1] }}
 				</p>
@@ -66,7 +72,7 @@ export default {
 				return this.$store.state.writer_card_button;
 			} else {
 				return `Unknown Role`;
-			}
+			};
 		},
 		questions() {
 			return this.$store.state.questions;
@@ -210,11 +216,18 @@ export default {
 	flex-direction: column;
 	width: calc(100% / 9);
 	border-radius: 10px;
+	position: relative;
 	padding: 10px;
 	display: flex;
 	height: 80%;
 }
 
+.card-id {
+	position: absolute;
+	left: 5px;
+	top: 5px;
+}
+
 .card-text {
 	flex-grow: 1;
 }