SAE-A2-TruthInquiry/truthseeker/static/css/game_ui.css
AudricV e07a6881ba
[Client] Add Roboto Mono font
This font will be used on the legal pages and could be used as the font of some
text blocks of the game.

Version 22 of the font has been added.

Roboto Mono is made by Christian Robertson, licensed under the Apache 2.0
License.
2023-01-03 09:07:49 +01:00

152 lines
3.4 KiB
CSS

/* Custom fonts */
@font-face {
font-family: "Spicy Rice";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../fonts/spicy_rice_v21/spicy_rice_v21.woff2") format("woff2"), url("../fonts/spicy_rice_v21/spicy_rice_v21.woff") format("woff"), url("../fonts/spicy_rice_v21/spicy_rice_v21.ttf") format("truetype");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Titan One";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../fonts/titan_one_v13/titan_one_v13.woff2") format('woff2'), url("../fonts/titan_one_v13/titan_one_v13.woff") format('woff'), url("../fonts/titan_one_v13/titan_one_v13.ttf") format('truetype');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Roboto Mono";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../fonts/roboto_mono_v22/roboto_mono_v22.woff2") format('woff2'), url("../fonts/roboto_mono_v22/roboto_mono_v22.woff") format('woff'), url("../fonts/roboto_mono_v22/roboto_mono_v22.ttf") format('truetype');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Base elements */
:root {
color-scheme: dark;
--footer-links-height: 2em;
--button-and-dialog-border-radius: 1em;
}
html {
margin: 0;
}
body {
--body-margin: 0.375em;
margin: var(--body-margin);
}
/* Themes */
.dark {
background-color: #213C40;
}
.light {
background-color: #B1EDE8;
}
/* Utility classes */
.hidden {
display: none;
}
/* Links */
.link {
text-decoration: none;
}
.link:visited {
color: unset;
}
/* Footer */
.footer_link {
color: white;
font-family: sans-serif;
font-size: 1em;
font-weight: bold;
margin: 0.5em;
transition: color 0.25s;
}
.footer_link:hover {
color: #939393;
}
.footer_links {
align-content: center;
align-items: center;
display: flex;
flex-direction: row;
flex-wrap: wrap;
height: var(--footer-links-height);
justify-content: flex-end;
}
/* JavaScript browser message */
.unsupported_browser_msg {
display: none;
}
.unsupported_show {
display: block;
}
/* Alert dialogs */
.alert_dialog {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: none;
align-content: center;
align-items: center;
font-family: "Spicy Rice", serif;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
border-radius: var(--button-and-dialog-border-radius);
padding: 2em;
z-index: 2;
}
.alert_dialog_show {
display: flex;
}
.alert_dialog_title {
font-size: 2em;
font-weight: normal;
text-align: center;
}
.alert_dialog_msg {
font-size: 1.5em;
text-align: justify;
}
.alert_dialog_background {
background-color: rgba(0, 0, 0, 0.875);
position: absolute;
display: none;
top: 0;
left: 0;
height: 100vh;
width: 100vw;
z-index: 1;
}
.theme_switcher_btn {
transition: fill 0.5s;
}
.theme_switcher_btn:hover {
fill: #939393;
}