Spaces:
Sleeping
Sleeping
| body { | |
| font-family: Arial, sans-serif; | |
| background-color: #333; | |
| color: #eee; | |
| } | |
| .chat-container { | |
| border: 1px solid #555; | |
| width: 600px; | |
| margin: 20px auto; | |
| padding: 10px; | |
| background-color: #444; | |
| } | |
| .chat-messages { | |
| height: 700px; | |
| overflow-y: scroll; | |
| border-bottom: 1px solid #555; | |
| padding-bottom: 10px; | |
| } | |
| .msgc { | |
| margin-bottom: 10px; | |
| padding: 5px; | |
| border-radius: 5px; | |
| background-color: #555; | |
| } | |
| .nme { | |
| font-weight: bold; | |
| padding: 7px; | |
| margin-bottom: 5px; | |
| } | |
| .msg { | |
| margin-bottom: 2px; | |
| padding: 7px; | |
| border-radius: 5px; | |
| } | |
| .chat-input { | |
| display: flex; | |
| flex-direction: row; | |
| justify-content: space-between; | |
| align-items: center; | |
| margin-top: 10px; | |
| } | |
| input[type="text"] { | |
| flex: 1; | |
| padding: 10px; | |
| border: 1px solid #ccc; | |
| border-radius: 5px; | |
| margin-right: 10px; | |
| } | |
| input[type="text"]:last-child { | |
| margin-right: 0; | |
| } | |
| .chat-input button { | |
| padding: 10px; | |
| cursor: pointer; | |
| background-color: #3498db; | |
| color: #fff; | |
| border: none; | |
| border-radius: 5px; | |
| } | |
| .chat-input button:hover { | |
| background-color: #2980b9; | |
| } | |
| .msg:nth-child(even) { | |
| background-color: #555; | |
| } | |
| .msg:nth-child(odd) { | |
| background-color: #444; | |
| } |