70 lines
1 KiB
CSS
70 lines
1 KiB
CSS
|
body {
|
||
|
|
margin: 0;
|
||
|
|
padding: 1em;
|
||
|
|
|
||
|
|
font-family: "Inter", "sans-serif";
|
||
|
|
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
#game {
|
||
|
|
border: 2px solid #ddd;
|
||
|
|
}
|
||
|
|
|
||
|
|
#game:focus {
|
||
|
|
outline: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
#game.offline {
|
||
|
|
opacity: .5;
|
||
|
|
cursor: not-allowed;
|
||
|
|
}
|
||
|
|
|
||
|
|
#chatbox {
|
||
|
|
width: min(calc(100% - 4px), calc(796px - 1em));
|
||
|
|
height: 8em;
|
||
|
|
margin: 1em auto 0 auto;
|
||
|
|
padding: .5em;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
text-align: left;
|
||
|
|
background: #f8f8f8;
|
||
|
|
border: 2px solid #e0e0e0;
|
||
|
|
border-bottom: none;
|
||
|
|
overflow-y: scroll;
|
||
|
|
}
|
||
|
|
|
||
|
|
#chatbox .chat-message {
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.chat-message.error {
|
||
|
|
color: #e42020;
|
||
|
|
}
|
||
|
|
|
||
|
|
#compose {
|
||
|
|
width: min(100%, 800px);
|
||
|
|
margin: 0 auto;
|
||
|
|
display: flex;
|
||
|
|
}
|
||
|
|
|
||
|
|
#compose input[type="text"] {
|
||
|
|
padding: .2em .5em;
|
||
|
|
background: #fff;
|
||
|
|
border: 2px solid #e0e0e0;
|
||
|
|
overflow-y: scroll;
|
||
|
|
flex-grow: 1;
|
||
|
|
border-right: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
#compose button {
|
||
|
|
padding: .2em 1em;
|
||
|
|
border: 2px solid #2b8adf;
|
||
|
|
background: #51acfd;
|
||
|
|
}
|
||
|
|
|
||
|
|
footer {
|
||
|
|
color: #808080;
|
||
|
|
font-style: italic;
|
||
|
|
}
|