110 lines
1.2 KiB
CSS
110 lines
1.2 KiB
CSS
template {
|
|
display: none;
|
|
}
|
|
|
|
h1 {
|
|
background: lightgrey;
|
|
}
|
|
|
|
body > section {
|
|
display: flex;
|
|
}
|
|
|
|
body > section > section {
|
|
margin: 1em;
|
|
}
|
|
|
|
section#messages {
|
|
flex-grow: 3;
|
|
}
|
|
|
|
section#active_users {
|
|
flex-grow: 1;
|
|
}
|
|
|
|
form#chat_form {
|
|
flex: 1 100%;
|
|
}
|
|
|
|
span.timestamp {
|
|
color: #d0d0d0;
|
|
}
|
|
|
|
span.timestamp:after {
|
|
content: " ";
|
|
}
|
|
|
|
.utterance span.nym:after {
|
|
content: ": ";
|
|
}
|
|
|
|
span.arrived:after {
|
|
content: " arrived";
|
|
}
|
|
|
|
span.departed:after {
|
|
content: " departed";
|
|
}
|
|
|
|
div.notification {
|
|
background-color: #eeeeff;
|
|
}
|
|
|
|
span.state.connected, span.arrived {
|
|
color: #00c000;
|
|
}
|
|
|
|
span.state.disconnected, span.departed {
|
|
color: #c00000;
|
|
}
|
|
|
|
span.state.crashed {
|
|
color: white;
|
|
background: red;
|
|
}
|
|
|
|
span.state.crashed:after {
|
|
content: "; please reload the page";
|
|
}
|
|
|
|
div.state_disconnected {
|
|
background-color: #ffeeee;
|
|
}
|
|
|
|
div.state_connected {
|
|
background-color: #eeffee;
|
|
}
|
|
|
|
#chat_output {
|
|
height: 15em;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
#chat_input {
|
|
width: 80%;
|
|
}
|
|
|
|
.nym {
|
|
color: #00c000;
|
|
}
|
|
|
|
.nym_status:before {
|
|
content: " (";
|
|
}
|
|
|
|
.nym_status:after {
|
|
content: ")";
|
|
}
|
|
|
|
.nym_status {
|
|
font-size: smaller;
|
|
}
|
|
|
|
#route.invalid {
|
|
background: red;
|
|
}
|
|
|
|
#route {
|
|
min-width: 30em;
|
|
}
|