109 lines
1.3 KiB
Text
109 lines
1.3 KiB
Text
// full CSS reset
|
|
@import 'fullreset.less';
|
|
|
|
// load the font
|
|
@import url('https://fonts.googleapis.com/css?family=Fira+Code:400,700&display=swap');
|
|
html {
|
|
font-family: 'Fira Code', monospace;
|
|
}
|
|
|
|
// setup REM units
|
|
html {
|
|
font-size: 62.5% !important;
|
|
}
|
|
|
|
// setup the colors and styles
|
|
@accentbg: #fba49b;
|
|
@bg: #ffefdf;
|
|
@accentfg: #930a16;
|
|
@fg: #23090d;
|
|
|
|
body {
|
|
color: @fg;
|
|
}
|
|
|
|
h1, h2, h3, h4, h5, h6, strong, a {
|
|
color: @accentfg;
|
|
font-weight: bold;
|
|
}
|
|
|
|
h1, h2, h3, h4, h5, h6 {
|
|
margin-bottom: .1em;
|
|
}
|
|
|
|
a {
|
|
text-decoration: inherit;
|
|
}
|
|
|
|
em {
|
|
font-style: italic;
|
|
}
|
|
|
|
header, footer {
|
|
background: @accentbg;
|
|
|
|
img {
|
|
border: 4px solid @accentfg;
|
|
border-radius: 2px;
|
|
}
|
|
}
|
|
|
|
// setup the layout
|
|
html, body {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
}
|
|
|
|
header img, footer img {
|
|
float: left;
|
|
margin-right: 1rem;
|
|
}
|
|
header img {
|
|
height: 8rem;
|
|
}
|
|
footer img {
|
|
height: 4rem;
|
|
}
|
|
|
|
header, footer, main {
|
|
padding: 2rem;
|
|
}
|
|
main {
|
|
flex: 1;
|
|
display: flex;
|
|
position: relative;
|
|
background: @bg;
|
|
|
|
canvas {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
}
|
|
|
|
h1 {
|
|
font-size: 4rem;
|
|
}
|
|
h2 {
|
|
font-size: 2rem;
|
|
}
|
|
p {
|
|
font-size: 1.6rem;
|
|
}
|
|
|
|
.hidden {
|
|
display: none !important;
|
|
}
|
|
|
|
// setup the progress bar
|
|
@import 'progressBar';
|
|
|
|
// setup the main menu
|
|
@import 'mainMenu';
|
|
|
|
// setup the popups
|
|
@import 'popup';
|
|
|
|
// setup the hud
|
|
@import 'hud';
|