mail.css 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. body {
  2. margin: 0px;
  3. }
  4. pre, code {
  5. word-break: break-word;
  6. white-space: pre-wrap;
  7. }
  8. #page {
  9. font-family: 'Open Sans', Helvetica, Arial, Sans-Serif;
  10. font-color: #454545;
  11. font-size: 12pt;
  12. width: 100%;
  13. padding: 20px;
  14. }
  15. #inner {
  16. width: 640px;
  17. }
  18. .header {
  19. width: 100%;
  20. height: 87px;
  21. color: #454545;
  22. border-bottom: 4px solid #e5e5e5;
  23. }
  24. .logo {
  25. text-align: right;
  26. margin-left: 20px;
  27. }
  28. .salutation {
  29. padding-top: 10px;
  30. font-weight: bold;
  31. }
  32. .summarytext {
  33. }
  34. .room {
  35. width: 100%;
  36. color: #454545;
  37. border-bottom: 1px solid #e5e5e5;
  38. }
  39. .room_header td {
  40. padding-top: 38px;
  41. padding-bottom: 10px;
  42. border-bottom: 1px solid #e5e5e5;
  43. }
  44. .room_name {
  45. vertical-align: middle;
  46. font-size: 18px;
  47. font-weight: bold;
  48. }
  49. .room_header h2 {
  50. margin-top: 0px;
  51. margin-left: 75px;
  52. font-size: 20px;
  53. }
  54. .room_avatar {
  55. width: 56px;
  56. line-height: 0px;
  57. text-align: center;
  58. vertical-align: middle;
  59. }
  60. .room_avatar img {
  61. width: 48px;
  62. height: 48px;
  63. object-fit: cover;
  64. border-radius: 24px;
  65. }
  66. .notif {
  67. border-bottom: 1px solid #e5e5e5;
  68. margin-top: 16px;
  69. padding-bottom: 16px;
  70. }
  71. .historical_message .sender_avatar {
  72. opacity: 0.3;
  73. }
  74. /* spell out opacity and historical_message class names for Outlook aka Word */
  75. .historical_message .sender_name {
  76. color: #e3e3e3;
  77. }
  78. .historical_message .message_time {
  79. color: #e3e3e3;
  80. }
  81. .historical_message .message_body {
  82. color: #c7c7c7;
  83. }
  84. .historical_message td,
  85. .message td {
  86. padding-top: 10px;
  87. }
  88. .sender_avatar {
  89. width: 56px;
  90. text-align: center;
  91. vertical-align: top;
  92. }
  93. .sender_avatar img {
  94. margin-top: -2px;
  95. width: 32px;
  96. height: 32px;
  97. border-radius: 16px;
  98. }
  99. .sender_name {
  100. display: inline;
  101. font-size: 13px;
  102. color: #a2a2a2;
  103. }
  104. .message_time {
  105. text-align: right;
  106. width: 100px;
  107. font-size: 11px;
  108. color: #a2a2a2;
  109. }
  110. .message_body {
  111. }
  112. .notif_link td {
  113. padding-top: 10px;
  114. padding-bottom: 10px;
  115. font-weight: bold;
  116. }
  117. .notif_link a, .footer a {
  118. color: #454545;
  119. text-decoration: none;
  120. }
  121. .debug {
  122. font-size: 10px;
  123. color: #888;
  124. }
  125. .footer {
  126. margin-top: 20px;
  127. text-align: center;
  128. }