[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.
This commit is contained in:
		
							parent
							
								
									320b733bfd
								
							
						
					
					
						commit
						e83591c9ef
					
				@ -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;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@ -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">
 | 
			
		||||
 | 
			
		||||
		Loading…
	
		Reference in New Issue
	
	Block a user