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

[Client] Add game introduction style

Browse Source
This commit is contained in:
AudricV 2023-01-12 10:58:53 +01:00
parent 3db8505e18
commit e62022c43c
No known key found for this signature in database
GPG Key ID: DA92EC7905614198
1 changed files with 91 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -21,28 +21,6 @@ html {
z-index: -9999; z-index: -9999;
} }
/* Introduction */
.introduction {
padding: 1em;
max-width: 50vw;
}
.introduction_title {
color: var(--button-color);
font-family: "Spicy Rice", serif;
font-size: 5em;
font-weight: bold;
margin: 0;
text-align: left;
}
.introduction_text {
font-family: "Spicy Rice", serif;
font-size: 2em;
margin-bottom: 1em;
margin-top: 1em;
}
/* Buttons */ /* Buttons */
.action_button { .action_button {
border-color: black; border-color: black;
@ -69,12 +47,99 @@ html {
} }
.next_btn { .next_btn {
background-color: transparent;
border: none;
cursor: pointer; cursor: pointer;
fill: var(--button-color); fill: var(--button-color);
transform: rotate(180deg);
}
#introduction_next_btn {
height: 5em; height: 5em;
padding: 0;
transform: rotate(180deg);
width: 5em; width: 5em;
} }
/* Introduction */
.introduction {
padding: 1em;
max-width: 50vw;
}
.introduction_title {
color: var(--button-color);
font-family: "Spicy Rice", serif;
font-size: 5em;
font-weight: bold;
margin: 0;
text-align: left;
}
.introduction_text {
font-family: "Spicy Rice", serif;
font-size: 2em;
margin-bottom: 1em;
margin-top: 1em;
}
/* Interrogation */
.interrogation {
align-items: center;
display: flex;
flex-direction: column;
flex-wrap: wrap;
justify-content: center;
}
.interrogation_title {
color: var(--button-color);
font-family: "Spicy Rice", sans-serif;
font-size: 3em;
margin: 1em;
text-transform: uppercase;
}
#interrogation_next_btn {
position: fixed;
left: calc(100% - 6em);
top: 1em;
}
.suspects {
align-content: center;
align-items: center;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
}
.suspect {
align-items: center;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
margin: 1em;
}
.suspect_picture {
margin-bottom: 1em;
height: 15em;
width: 15em;
}
.suspect_picture[alt] {
align-content: center;
align-items: center;
display: flex;
font-family: "Roboto Mono", sans-serif;
font-size: 1em;
flex-direction: column;
flex-wrap: wrap;
justify-content: center;
text-align: center;
}
.ask_button {
background-color: white;
color: black;
text-transform: none;
}