DjalimSimaila/SAE-A2-TruthInquiry
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add results view and style

Browse Source
This commit is contained in:
mathiascazals 2023-01-11 11:49:02 +01:00 committed by AudricV
parent ae8446d64d
commit edf2f35010
No known key found for this signature in database
GPG Key ID: DA92EC7905614198
2 changed files with 130 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

95
truthseeker/static/css/game_ui_game.css
View File

@ -229,18 +229,109 @@ html {
right: 50;
}
.results_game {
grid-template-columns: 1fr;
}
.results_title {
color: #BD1E1E;
font-family: "Spicy Rice", serif;
font-weight: bold;
font-size: 4.5em;
margin: 0;
margin-left: 0.6em;
text-align: left;
margin-bottom:0;
}
.reveal_killer_title {
.reveal {
justify-content: left;
}
.scores {
font-family: "Titan One", sans-serif;
}
.summary {
font-family: "Titan One", sans-serif;
text-align: center;
}
.reveal_and_scores {
display: flex;
flex-direction: row;
justify-content: space-around;
}
@media (max-width: 500px) {
.reveal_and_scores {
display: flex;
flex-direction: column;
}
}
.reveal_culprit_title {
color: white;
font-family: "Spicy Rice", serif;
font-weight: bold;
font-size: 3em;
font-size: 2em;
margin-left: 1.3em;
}
.score_title {
text-align: center;
}
.reveal_score {
width: 15em;
height: 3em;
border-radius: 10%;
background-color: var(--button-color);
display: flex;
align-items: center;
justify-content: center;
margin-left: 2.3em;
}
.players_list {
margin-left: 5em;
margin-top: 1em;
}
.player_names, .player_scores {
display: inline-block;
}
.summary_title {
font-family: "Spicy Rice", sans-serif;
}
.suspects_list {
display: flex;
justify-content: space-between;
margin-left: 1em;
margin-right: 1em;
}
.suspect_title {
display: flex;
flex-direction: row;
display: inline-block;
}
@media (max-width: 650px) {
.suspects_list{
display: flex;
flex-direction: column;
}
}
.rtrn_lob_btn {
fill: #BD1E1E;
}
#return_lobby_button {
background-color: transparent;
border: transparent;
}

39
truthseeker/templates/game.html
View File

@ -81,10 +81,45 @@
<div class="final_choice hidden">
<h1 class="interrogation_title">Quelles sont vos déductions&nbsp;?</h1>
</div>
<div class="results_game hidden">
<div class="results_game">
<h1 class="results_title">Résultats</h1>
<h2 class="reveal_killer_title">Le tueur était&nbsp;...</h2>
<div class="reveal_and_scores">
<div class="scores">
<h1 class="score_title">SCORES :</h1>
<div class="reveal_score">Votre score&nbsp;:</div>
<div class="results_game_multiplayer">
<div class="players_list">
<h3 class="player_names">nom1 : </h3>
<h3 class="player_scores"> score1</h3></br>
<h3 class="player_names">nom2 : </h3>
<h3 class="player_scores"> score2</h3></br>
<h3 class="player_names">nom3 : </h3>
<h3 class="player_scores"> score3</h3></br>
<h3 class="player_names">nom4 : </h3>
<h3 class="player_scores"> score4</h3>
</div>
</div>
</div>
<div class="reveal">
<h2 class="reveal_culprit_title">Le coupable était</h2>
</div>
</div>
<div class="summary">
<div class="summary_emotions">
<h1 class="summary_title">Débrief</h1>
<div class="suspects_list">
<h2 class="suspect_title">Le suspect 1 était</h2>
<h2 class="suspect_title">Le suspect 2 était</h2>
<h2 class="suspect_title">Le suspect 3 était</h2>
<h2 class="suspect_title">Le suspect 4 était</h2>
</div>
</div>
</div>
<button id="return_lobby_button" aria-label="Retourner au lobby">
<svg class="rtrn_lob_btn" xmlns="http://www.w3.org/2000/svg" height="48" width="48">
<path d="m23.15 36.95-17.3-11.1Q4.7 25.25 4.7 24t1.15-1.9L23.15 11q1.15-.7 2.35-.075 1.2.625 1.2 2.025v8.75h15.8q.95 0 1.625.675T44.8 24q0 .95-.675 1.6-.675.65-1.625.65H26.7V35q0 1.45-1.2 2.075-1.2.625-2.35-.125Z"/>
</svg>
</button>
</div>
<div class="alert_dialog_background"></div>
<div class="unsupported_browser">