app-chat-list.css 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. .chat-app-window .user-chats {
  2. background-color: #f2f0f7;
  3. padding: 1rem;
  4. position: relative;
  5. height: calc(100% - 65px - 65px); }
  6. .chat-app-window .user-chats .avatar img {
  7. border: 2px solid #fff; }
  8. .chat-app-window .active-chat {
  9. height: inherit; }
  10. .chat-app-window .active-chat .chat-header {
  11. display: flex;
  12. justify-content: space-between;
  13. height: 65px;
  14. background-color: #fff;
  15. padding: 0 1rem;
  16. border-bottom: 1px solid #ebe9f1; }
  17. .chat-app-window .chats .chat-avatar {
  18. float: right; }
  19. .chat-app-window .chats .chat-body {
  20. display: block;
  21. margin: 10px 30px 0 0;
  22. overflow: hidden; }
  23. .chat-app-window .chats .chat-body .chat-content {
  24. float: right;
  25. padding: 0.7rem 1rem;
  26. margin: 0 1rem 10px 0;
  27. clear: both;
  28. color: #fff;
  29. background-image: linear-gradient(80deg, #7367f0, #9e95f5);
  30. border-radius: 0.357rem;
  31. box-shadow: 0 4px 8px 0 rgba(34, 41, 47, 0.12);
  32. max-width: 75%; }
  33. .chat-app-window .chats .chat-body .chat-content p {
  34. margin: 0; }
  35. .chat-app-window .chats .chat-left .chat-avatar {
  36. float: left; }
  37. .chat-app-window .chats .chat-left .chat-body .chat-content {
  38. float: left;
  39. margin: 0 0 10px 1rem;
  40. color: #6e6b7b;
  41. background: none;
  42. background-color: white; }
  43. .chat-app-window .chat-app-form {
  44. height: 65px;
  45. padding: 0 1rem;
  46. background-color: #fff;
  47. display: flex;
  48. align-items: center;
  49. border-top: 1px solid #ebe9f1; }
  50. .chat-widget .card-header {
  51. padding-top: 0.8rem;
  52. padding-bottom: 0.8rem; }
  53. .chat-widget .chat-app-window .user-chats {
  54. background-color: #f8f8f8;
  55. height: 390px; }
  56. .chat-widget .chat-app-window .chat-app-form {
  57. border-top: 0;
  58. border-bottom-left-radius: 0.357rem;
  59. border-bottom-right-radius: 0.357rem;
  60. height: 56px; }
  61. .chat-widget .chat-app-window .chat-app-form .input-group-text,
  62. .chat-widget .chat-app-window .chat-app-form .message {
  63. border: 0;
  64. padding-left: 0; }
  65. .chat-widget .chat-app-window .chat-app-form .input-group:not(.bootstrap-touchspin):focus-within {
  66. box-shadow: none; }