From e83591c9ef0fc70653aa91877fe9804c57c1e555 Mon Sep 17 00:00:00 2001
From: AudricV <74829229+AudricV@users.noreply.github.com>
Date: Wed, 15 Mar 2023 23:40:25 +0100
Subject: [PATCH] [Client] Add button to go back to the home page on game
 results view

This button has been placed at the top right of the page.

Also merge some common properties into a single one.
---
 truthinquiry/static/css/game_ui_game.css | 27 +++++++++++-------------
 truthinquiry/templates/game.html         |  7 ++++++
 2 files changed, 19 insertions(+), 15 deletions(-)

diff --git a/truthinquiry/static/css/game_ui_game.css b/truthinquiry/static/css/game_ui_game.css
index ab13be0..d7c057b 100644
--- a/truthinquiry/static/css/game_ui_game.css
+++ b/truthinquiry/static/css/game_ui_game.css
@@ -80,11 +80,11 @@ html {
     margin: 0.25em;
 }
 
-.next_btn, .suspect_emotion_chooser {
+.home_button, .next_btn, .suspect_emotion_chooser {
     border: none;
 }
 
-.next_btn, #return_lobby_button {
+.home_button, .next_btn, #return_lobby_button {
     background-color: transparent;
 }
 
@@ -96,12 +96,11 @@ html {
     font-family: "Roboto Mono", sans-serif;
 }
 
-.reveal_culprit_explaination, .question_button, .players_list, .reveal_culprit, .scores, .summary, .suspect, .suspect_emotion_chooser {
+.explain_suspect_emotion_description, .question_button, .players_list, .return_button, .reveal_culprit, .reveal_culprit_explaination, .scores, .summary, .suspect, .suspect_emotion_chooser, .suspect_picture, .suspects_list {
     margin: 1em;
 }
 
 .suspect_picture {
-    margin: 1em;
     height: 15em;
     width: 15em;
 }
@@ -111,10 +110,17 @@ html {
 }
 
 /* Buttons */
-.action_button, .next_btn {
+.action_button, .home_button, .next_btn {
     cursor: pointer;
 }
 
+.home_button, .next_btn {
+    fill: var(--game-red);
+    height: 5em;
+    padding: 0;
+    width: 5em;
+}
+
 .action_button {
     font-size: 1.5em;
     min-width: 10em;
@@ -126,14 +132,10 @@ html {
 }
 
 .next_btn {
-    fill: var(--game-red);
-    height: 5em;
-    padding: 0;
     transform: rotate(180deg);
-    width: 5em;
 }
 
-#emotion_and_culprit_choices_next_btn, #interrogation_next_btn, #interrogation_suspect_previous_btn {
+#emotion_and_culprit_choices_next_btn, #interrogation_next_btn, #interrogation_suspect_previous_btn, #return_to_home_btn {
     position: fixed;
     left: calc(100% - 6em);
     top: 1em;
@@ -233,7 +235,6 @@ html {
 .explain_suspect_emotion_description {
     font-size: 1.25em;
     font-weight: normal;
-    margin: 1em;
 }
 
 .explain_suspect_emotion_title {
@@ -276,10 +277,6 @@ html {
     font-size: 4em;
 }
 
-.suspects_list {
-    margin: 1em;
-}
-
 #return_lobby_button {
     border: transparent;
 }
diff --git a/truthinquiry/templates/game.html b/truthinquiry/templates/game.html
index 31af18a..86cf93e 100644
--- a/truthinquiry/templates/game.html
+++ b/truthinquiry/templates/game.html
@@ -67,6 +67,13 @@
         </div>
         <div class="results_game hidden">
             <h1 class="results_title">Résultats</h1>
+            <a href="/" title="Cliquez ici pour revenir à la page d'accueil du jeu">
+                <button id="return_to_home_btn" class="home_button" aria-label="Revenir à la page d'accueil du jeu">
+                    <svg class="home_btn" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
+                        <path d="M6.9 43.1V17.4L24 4.55 41.15 17.4v25.7h-12.9V27.7h-8.5v15.4Z"/>
+                    </svg>
+                </button>
+            </a>
             <div class="reveal_and_scores">
                 <div class="scores">
                     <div class="player_score">