theme.css 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. /* Theme */
  2. #chat-host {
  3. background-color: #e2e2e2;
  4. font-family: "Ubuntu", sans-serif;
  5. font-size: 13px;
  6. }
  7. #chat-host .main .messages {
  8. border: none;
  9. margin-right: 1em;
  10. background-color: #f8f8f8;
  11. }
  12. #chat-host .main .messages li.systemMsg {
  13. margin: 0.5em;
  14. }
  15. #chat-host .main .messages li.userMsg {
  16. background-color: #ededed;
  17. border-radius: 1em;
  18. padding: 0.5em 0.8em 0.5em 4em;
  19. margin: 0.5em 1em;
  20. position: relative;
  21. border-width: 1px;
  22. border-style: solid;
  23. border-left-width: 1em;
  24. box-shadow: 0.1em 0.1em 0.5em rgba(0, 0, 0, 0.1);
  25. }
  26. #chat-host .main .messages li.userMsg.self {
  27. padding: 0.5em 4em 0.5em 0.8em;
  28. border-left-width: 1px;
  29. border-right-width: 1em;
  30. }
  31. #chat-host .main .messages li.userMsg .avatar {
  32. position: absolute;
  33. border-radius: 50%;
  34. width: 2.75em;
  35. height: 2.75em;
  36. left: 0.75em;
  37. background-color: silver;
  38. object-fit: cover;
  39. }
  40. #chat-host .main .messages li.userMsg.self .avatar {
  41. left: unset;
  42. right: 0.75em;
  43. }
  44. #chat-host .main .messages li.userMsg .user,
  45. #chat-host .main .messages li.userMsg .message .mention,
  46. #chat-host .main .userlistWrapper .userlist li span {
  47. filter: brightness(0.7) saturate(1.2);
  48. }
  49. #chat-host .main .messages li.userMsg .message {
  50. margin-top: 0.2em;
  51. }
  52. #chat-host .main .userlistWrapper {
  53. border-left: 1px solid #e2e2e2;
  54. padding-left: 1em;
  55. }
  56. #chat-host button {
  57. background-color: #751b09;
  58. color: #ffffff;
  59. padding: 1em;
  60. }
  61. #chat-host h2 {
  62. font-size: inherit;
  63. text-transform: uppercase;
  64. color: #4d4d4d;
  65. }
  66. #chat-host a {
  67. color: #751b09;
  68. }
  69. #chat-host a:not(:hover) {
  70. text-decoration: none;
  71. }