Layout done, probably need rework later on

This commit is contained in:
Frank
2026-01-06 13:24:40 +01:00
parent 59c1d97d84
commit 7230520551
3 changed files with 153 additions and 37 deletions

View File

@@ -1,17 +1,63 @@
/* Styles specific to Game1 */
/* page-level indicator to confirm CSS is loaded */
body.game1-page {
/* subtle background tint so you can visually confirm on /game */
background-color: #f9fbff;
/* Custom scrollbar for WebKit browsers */
html::-webkit-scrollbar,
body::-webkit-scrollbar {
width: 1px;
}
/* example component style */
.game1-banner {
padding: 1rem 1.25rem;
border: 1px solid #cfe2ff;
background: #e9f2ff;
color: #0b5ed7;
border-radius: 8px;
margin: 1rem 0;
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
background: #000;
}
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
background: #F00;
}
/* Standard properties for Firefox */
body {
background-color: #000;
min-height: 100vh;
font-family: monospace;
margin: 0;
scrollbar-width: thin;
scrollbar-color: #F00 #000;
}
div#game-timer {
position: fixed;
top: 20px;
left: 20px;
color: #F00;
font-size: 28px;
z-index: 100;
}
div#message-container {
padding: 20px;
padding-top: 60px; /* Space for fixed timer */
display: flex;
flex-direction: column;
justify-content: flex-end;
min-height: calc(100vh - 100px); /* Fill most of the viewport initially */
box-sizing: border-box;
font-size: 20px;
}
div#input {
padding: 20px;
}
input#input-message {
width: 100%;
padding: 10px;
background: #000;
border: 1px solid #F00;
color: #F00;
font-size: 18px;
box-sizing: border-box;
font-family: monospace;
}