@sendbird/uikit-react 3.0.0-beta.3 → 3.0.0-beta.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (612) hide show
  1. package/CHANGELOG.md +65 -0
  2. package/README.md +129 -0
  3. package/dist/index.css +0 -2
  4. package/dist/index.css.map +1 -1
  5. package/package.json +29 -7
  6. package/App.js +0 -313
  7. package/App.js.map +0 -1
  8. package/Channel/components/ChannelHeader.js +0 -117
  9. package/Channel/components/ChannelHeader.js.map +0 -1
  10. package/Channel/components/ChannelUI.js +0 -179
  11. package/Channel/components/ChannelUI.js.map +0 -1
  12. package/Channel/components/FileViewer.js +0 -151
  13. package/Channel/components/FileViewer.js.map +0 -1
  14. package/Channel/components/FrozenNotification.js +0 -20
  15. package/Channel/components/FrozenNotification.js.map +0 -1
  16. package/Channel/components/Message.js +0 -355
  17. package/Channel/components/Message.js.map +0 -1
  18. package/Channel/components/MessageInput.js +0 -202
  19. package/Channel/components/MessageInput.js.map +0 -1
  20. package/Channel/components/MessageList.js +0 -239
  21. package/Channel/components/MessageList.js.map +0 -1
  22. package/Channel/components/RemoveMessageModal.js +0 -53
  23. package/Channel/components/RemoveMessageModal.js.map +0 -1
  24. package/Channel/components/SuggestedMentionList.js +0 -250
  25. package/Channel/components/SuggestedMentionList.js.map +0 -1
  26. package/Channel/components/TypingIndicator.js +0 -98
  27. package/Channel/components/TypingIndicator.js.map +0 -1
  28. package/Channel/components/UnreadCount.js +0 -41
  29. package/Channel/components/UnreadCount.js.map +0 -1
  30. package/Channel/context.js +0 -24
  31. package/Channel/context.js.map +0 -1
  32. package/Channel.js +0 -106
  33. package/Channel.js.map +0 -1
  34. package/ChannelList/components/AddChannel.js +0 -70
  35. package/ChannelList/components/AddChannel.js.map +0 -1
  36. package/ChannelList/components/ChannelListHeader.js +0 -62
  37. package/ChannelList/components/ChannelListHeader.js.map +0 -1
  38. package/ChannelList/components/ChannelListUI.js +0 -236
  39. package/ChannelList/components/ChannelListUI.js.map +0 -1
  40. package/ChannelList/components/ChannelPreview.js +0 -211
  41. package/ChannelList/components/ChannelPreview.js.map +0 -1
  42. package/ChannelList/components/ChannelPreviewAction.js +0 -131
  43. package/ChannelList/components/ChannelPreviewAction.js.map +0 -1
  44. package/ChannelList/context.js +0 -13
  45. package/ChannelList/context.js.map +0 -1
  46. package/ChannelList.js +0 -89
  47. package/ChannelList.js.map +0 -1
  48. package/ChannelListProvider-d602a166.js +0 -926
  49. package/ChannelListProvider-d602a166.js.map +0 -1
  50. package/ChannelProvider-cf8fc05a.js +0 -2114
  51. package/ChannelProvider-cf8fc05a.js.map +0 -1
  52. package/ChannelSettings/components/AdminPanel.js +0 -905
  53. package/ChannelSettings/components/AdminPanel.js.map +0 -1
  54. package/ChannelSettings/components/ChannelProfile.js +0 -102
  55. package/ChannelSettings/components/ChannelProfile.js.map +0 -1
  56. package/ChannelSettings/components/ChannelSettingsUI.js +0 -152
  57. package/ChannelSettings/components/ChannelSettingsUI.js.map +0 -1
  58. package/ChannelSettings/components/EditDetailsModal.js +0 -154
  59. package/ChannelSettings/components/EditDetailsModal.js.map +0 -1
  60. package/ChannelSettings/components/LeaveChannel.js +0 -53
  61. package/ChannelSettings/components/LeaveChannel.js.map +0 -1
  62. package/ChannelSettings/components/UserListItem.js +0 -105
  63. package/ChannelSettings/components/UserListItem.js.map +0 -1
  64. package/ChannelSettings/components/UserPanel.js +0 -79
  65. package/ChannelSettings/components/UserPanel.js.map +0 -1
  66. package/ChannelSettings/context.js +0 -93
  67. package/ChannelSettings/context.js.map +0 -1
  68. package/ChannelSettings.js +0 -71
  69. package/ChannelSettings.js.map +0 -1
  70. package/CreateChannel/components/CreateChannelUI.js +0 -53
  71. package/CreateChannel/components/CreateChannelUI.js.map +0 -1
  72. package/CreateChannel/components/InviteMembers.js +0 -184
  73. package/CreateChannel/components/InviteMembers.js.map +0 -1
  74. package/CreateChannel/components/SelectChannelType.js +0 -131
  75. package/CreateChannel/components/SelectChannelType.js.map +0 -1
  76. package/CreateChannel/context.js +0 -8
  77. package/CreateChannel/context.js.map +0 -1
  78. package/CreateChannel.js +0 -53
  79. package/CreateChannel.js.map +0 -1
  80. package/CreateChannelProvider-3f3dafed.js +0 -53
  81. package/CreateChannelProvider-3f3dafed.js.map +0 -1
  82. package/EditUserProfile/components/EditUserProfileUI.js +0 -26
  83. package/EditUserProfile/components/EditUserProfileUI.js.map +0 -1
  84. package/EditUserProfile/context.js +0 -27
  85. package/EditUserProfile/context.js.map +0 -1
  86. package/EditUserProfile.js +0 -39
  87. package/EditUserProfile.js.map +0 -1
  88. package/LocalizationContext-b970a73c.js +0 -22
  89. package/LocalizationContext-b970a73c.js.map +0 -1
  90. package/MemberList-9d29bee4.js +0 -425
  91. package/MemberList-9d29bee4.js.map +0 -1
  92. package/MessageSearch/components/MessageSearchUI.js +0 -151
  93. package/MessageSearch/components/MessageSearchUI.js.map +0 -1
  94. package/MessageSearch/context.js +0 -392
  95. package/MessageSearch/context.js.map +0 -1
  96. package/MessageSearch.js +0 -146
  97. package/MessageSearch.js.map +0 -1
  98. package/OpenChannel/components/FrozenChannelNotification.js +0 -20
  99. package/OpenChannel/components/FrozenChannelNotification.js.map +0 -1
  100. package/OpenChannel/components/OpenChannelHeader.js +0 -78
  101. package/OpenChannel/components/OpenChannelHeader.js.map +0 -1
  102. package/OpenChannel/components/OpenChannelInput.js +0 -56
  103. package/OpenChannel/components/OpenChannelInput.js.map +0 -1
  104. package/OpenChannel/components/OpenChannelMessage.js +0 -282
  105. package/OpenChannel/components/OpenChannelMessage.js.map +0 -1
  106. package/OpenChannel/components/OpenChannelMessageList.js +0 -157
  107. package/OpenChannel/components/OpenChannelMessageList.js.map +0 -1
  108. package/OpenChannel/components/OpenChannelUI.js +0 -109
  109. package/OpenChannel/components/OpenChannelUI.js.map +0 -1
  110. package/OpenChannel/context.js +0 -14
  111. package/OpenChannel/context.js.map +0 -1
  112. package/OpenChannel.js +0 -80
  113. package/OpenChannel.js.map +0 -1
  114. package/OpenChannelProvider-821fb008.js +0 -2011
  115. package/OpenChannelProvider-821fb008.js.map +0 -1
  116. package/OpenChannelSettings/components/EditDetailsModal.js +0 -149
  117. package/OpenChannelSettings/components/EditDetailsModal.js.map +0 -1
  118. package/OpenChannelSettings/components/OpenChannelProfile.js +0 -81
  119. package/OpenChannelSettings/components/OpenChannelProfile.js.map +0 -1
  120. package/OpenChannelSettings/components/OpenChannelSettingsUI.js +0 -104
  121. package/OpenChannelSettings/components/OpenChannelSettingsUI.js.map +0 -1
  122. package/OpenChannelSettings/components/OperatorUI.js +0 -184
  123. package/OpenChannelSettings/components/OperatorUI.js.map +0 -1
  124. package/OpenChannelSettings/components/ParticipantUI.js +0 -172
  125. package/OpenChannelSettings/components/ParticipantUI.js.map +0 -1
  126. package/OpenChannelSettings/context.js +0 -64
  127. package/OpenChannelSettings/context.js.map +0 -1
  128. package/OpenChannelSettings.js +0 -64
  129. package/OpenChannelSettings.js.map +0 -1
  130. package/SendbirdProvider.js +0 -762
  131. package/SendbirdProvider.js.map +0 -1
  132. package/UserProfileContext-f4ff4291.js +0 -38
  133. package/UserProfileContext-f4ff4291.js.map +0 -1
  134. package/_rollupPluginBabelHelpers-6bf18550.js +0 -233
  135. package/_rollupPluginBabelHelpers-6bf18550.js.map +0 -1
  136. package/actionTypes-8e320ded.js +0 -6
  137. package/actionTypes-8e320ded.js.map +0 -1
  138. package/cjs/App.js +0 -320
  139. package/cjs/App.js.map +0 -1
  140. package/cjs/Channel/components/ChannelHeader.js +0 -123
  141. package/cjs/Channel/components/ChannelHeader.js.map +0 -1
  142. package/cjs/Channel/components/ChannelUI.js +0 -185
  143. package/cjs/Channel/components/ChannelUI.js.map +0 -1
  144. package/cjs/Channel/components/FileViewer.js +0 -160
  145. package/cjs/Channel/components/FileViewer.js.map +0 -1
  146. package/cjs/Channel/components/FrozenNotification.js +0 -26
  147. package/cjs/Channel/components/FrozenNotification.js.map +0 -1
  148. package/cjs/Channel/components/Message.js +0 -361
  149. package/cjs/Channel/components/Message.js.map +0 -1
  150. package/cjs/Channel/components/MessageInput.js +0 -208
  151. package/cjs/Channel/components/MessageInput.js.map +0 -1
  152. package/cjs/Channel/components/MessageList.js +0 -245
  153. package/cjs/Channel/components/MessageList.js.map +0 -1
  154. package/cjs/Channel/components/RemoveMessageModal.js +0 -59
  155. package/cjs/Channel/components/RemoveMessageModal.js.map +0 -1
  156. package/cjs/Channel/components/SuggestedMentionList.js +0 -256
  157. package/cjs/Channel/components/SuggestedMentionList.js.map +0 -1
  158. package/cjs/Channel/components/TypingIndicator.js +0 -107
  159. package/cjs/Channel/components/TypingIndicator.js.map +0 -1
  160. package/cjs/Channel/components/UnreadCount.js +0 -47
  161. package/cjs/Channel/components/UnreadCount.js.map +0 -1
  162. package/cjs/Channel/context.js +0 -33
  163. package/cjs/Channel/context.js.map +0 -1
  164. package/cjs/Channel.js +0 -112
  165. package/cjs/Channel.js.map +0 -1
  166. package/cjs/ChannelList/components/AddChannel.js +0 -79
  167. package/cjs/ChannelList/components/AddChannel.js.map +0 -1
  168. package/cjs/ChannelList/components/ChannelListHeader.js +0 -68
  169. package/cjs/ChannelList/components/ChannelListHeader.js.map +0 -1
  170. package/cjs/ChannelList/components/ChannelListUI.js +0 -242
  171. package/cjs/ChannelList/components/ChannelListUI.js.map +0 -1
  172. package/cjs/ChannelList/components/ChannelPreview.js +0 -217
  173. package/cjs/ChannelList/components/ChannelPreview.js.map +0 -1
  174. package/cjs/ChannelList/components/ChannelPreviewAction.js +0 -138
  175. package/cjs/ChannelList/components/ChannelPreviewAction.js.map +0 -1
  176. package/cjs/ChannelList/context.js +0 -22
  177. package/cjs/ChannelList/context.js.map +0 -1
  178. package/cjs/ChannelList.js +0 -95
  179. package/cjs/ChannelList.js.map +0 -1
  180. package/cjs/ChannelListProvider-64db9f70.js +0 -938
  181. package/cjs/ChannelListProvider-64db9f70.js.map +0 -1
  182. package/cjs/ChannelProvider-5e8e33b1.js +0 -2127
  183. package/cjs/ChannelProvider-5e8e33b1.js.map +0 -1
  184. package/cjs/ChannelSettings/components/AdminPanel.js +0 -911
  185. package/cjs/ChannelSettings/components/AdminPanel.js.map +0 -1
  186. package/cjs/ChannelSettings/components/ChannelProfile.js +0 -108
  187. package/cjs/ChannelSettings/components/ChannelProfile.js.map +0 -1
  188. package/cjs/ChannelSettings/components/ChannelSettingsUI.js +0 -158
  189. package/cjs/ChannelSettings/components/ChannelSettingsUI.js.map +0 -1
  190. package/cjs/ChannelSettings/components/EditDetailsModal.js +0 -160
  191. package/cjs/ChannelSettings/components/EditDetailsModal.js.map +0 -1
  192. package/cjs/ChannelSettings/components/LeaveChannel.js +0 -59
  193. package/cjs/ChannelSettings/components/LeaveChannel.js.map +0 -1
  194. package/cjs/ChannelSettings/components/UserListItem.js +0 -111
  195. package/cjs/ChannelSettings/components/UserListItem.js.map +0 -1
  196. package/cjs/ChannelSettings/components/UserPanel.js +0 -85
  197. package/cjs/ChannelSettings/components/UserPanel.js.map +0 -1
  198. package/cjs/ChannelSettings/context.js +0 -102
  199. package/cjs/ChannelSettings/context.js.map +0 -1
  200. package/cjs/ChannelSettings.js +0 -77
  201. package/cjs/ChannelSettings.js.map +0 -1
  202. package/cjs/CreateChannel/components/CreateChannelUI.js +0 -59
  203. package/cjs/CreateChannel/components/CreateChannelUI.js.map +0 -1
  204. package/cjs/CreateChannel/components/InviteMembers.js +0 -190
  205. package/cjs/CreateChannel/components/InviteMembers.js.map +0 -1
  206. package/cjs/CreateChannel/components/SelectChannelType.js +0 -137
  207. package/cjs/CreateChannel/components/SelectChannelType.js.map +0 -1
  208. package/cjs/CreateChannel/context.js +0 -17
  209. package/cjs/CreateChannel/context.js.map +0 -1
  210. package/cjs/CreateChannel.js +0 -59
  211. package/cjs/CreateChannel.js.map +0 -1
  212. package/cjs/CreateChannelProvider-dcf7f906.js +0 -60
  213. package/cjs/CreateChannelProvider-dcf7f906.js.map +0 -1
  214. package/cjs/EditUserProfile/components/EditUserProfileUI.js +0 -32
  215. package/cjs/EditUserProfile/components/EditUserProfileUI.js.map +0 -1
  216. package/cjs/EditUserProfile/context.js +0 -36
  217. package/cjs/EditUserProfile/context.js.map +0 -1
  218. package/cjs/EditUserProfile.js +0 -45
  219. package/cjs/EditUserProfile.js.map +0 -1
  220. package/cjs/LocalizationContext-382a9ef1.js +0 -30
  221. package/cjs/LocalizationContext-382a9ef1.js.map +0 -1
  222. package/cjs/MemberList-03a241cd.js +0 -431
  223. package/cjs/MemberList-03a241cd.js.map +0 -1
  224. package/cjs/MessageSearch/components/MessageSearchUI.js +0 -160
  225. package/cjs/MessageSearch/components/MessageSearchUI.js.map +0 -1
  226. package/cjs/MessageSearch/context.js +0 -401
  227. package/cjs/MessageSearch/context.js.map +0 -1
  228. package/cjs/MessageSearch.js +0 -152
  229. package/cjs/MessageSearch.js.map +0 -1
  230. package/cjs/OpenChannel/components/FrozenChannelNotification.js +0 -26
  231. package/cjs/OpenChannel/components/FrozenChannelNotification.js.map +0 -1
  232. package/cjs/OpenChannel/components/OpenChannelHeader.js +0 -84
  233. package/cjs/OpenChannel/components/OpenChannelHeader.js.map +0 -1
  234. package/cjs/OpenChannel/components/OpenChannelInput.js +0 -62
  235. package/cjs/OpenChannel/components/OpenChannelInput.js.map +0 -1
  236. package/cjs/OpenChannel/components/OpenChannelMessage.js +0 -288
  237. package/cjs/OpenChannel/components/OpenChannelMessage.js.map +0 -1
  238. package/cjs/OpenChannel/components/OpenChannelMessageList.js +0 -163
  239. package/cjs/OpenChannel/components/OpenChannelMessageList.js.map +0 -1
  240. package/cjs/OpenChannel/components/OpenChannelUI.js +0 -115
  241. package/cjs/OpenChannel/components/OpenChannelUI.js.map +0 -1
  242. package/cjs/OpenChannel/context.js +0 -23
  243. package/cjs/OpenChannel/context.js.map +0 -1
  244. package/cjs/OpenChannel.js +0 -86
  245. package/cjs/OpenChannel.js.map +0 -1
  246. package/cjs/OpenChannelProvider-9000ccb9.js +0 -2020
  247. package/cjs/OpenChannelProvider-9000ccb9.js.map +0 -1
  248. package/cjs/OpenChannelSettings/components/EditDetailsModal.js +0 -155
  249. package/cjs/OpenChannelSettings/components/EditDetailsModal.js.map +0 -1
  250. package/cjs/OpenChannelSettings/components/OpenChannelProfile.js +0 -87
  251. package/cjs/OpenChannelSettings/components/OpenChannelProfile.js.map +0 -1
  252. package/cjs/OpenChannelSettings/components/OpenChannelSettingsUI.js +0 -110
  253. package/cjs/OpenChannelSettings/components/OpenChannelSettingsUI.js.map +0 -1
  254. package/cjs/OpenChannelSettings/components/OperatorUI.js +0 -194
  255. package/cjs/OpenChannelSettings/components/OperatorUI.js.map +0 -1
  256. package/cjs/OpenChannelSettings/components/ParticipantUI.js +0 -178
  257. package/cjs/OpenChannelSettings/components/ParticipantUI.js.map +0 -1
  258. package/cjs/OpenChannelSettings/context.js +0 -73
  259. package/cjs/OpenChannelSettings/context.js.map +0 -1
  260. package/cjs/OpenChannelSettings.js +0 -70
  261. package/cjs/OpenChannelSettings.js.map +0 -1
  262. package/cjs/SendbirdProvider.js +0 -771
  263. package/cjs/SendbirdProvider.js.map +0 -1
  264. package/cjs/UserProfileContext-0b7ef11a.js +0 -46
  265. package/cjs/UserProfileContext-0b7ef11a.js.map +0 -1
  266. package/cjs/_rollupPluginBabelHelpers-6193d45d.js +0 -243
  267. package/cjs/_rollupPluginBabelHelpers-6193d45d.js.map +0 -1
  268. package/cjs/actionTypes-092bc172.js +0 -10
  269. package/cjs/actionTypes-092bc172.js.map +0 -1
  270. package/cjs/color-1816dacf.js +0 -42
  271. package/cjs/color-1816dacf.js.map +0 -1
  272. package/cjs/compareIds-e9bca8c4.js +0 -20
  273. package/cjs/compareIds-e9bca8c4.js.map +0 -1
  274. package/cjs/const-c65837c1.js +0 -22
  275. package/cjs/const-c65837c1.js.map +0 -1
  276. package/cjs/const-d9f4d880.js +0 -14
  277. package/cjs/const-d9f4d880.js.map +0 -1
  278. package/cjs/context-6ebf3379.js +0 -19
  279. package/cjs/context-6ebf3379.js.map +0 -1
  280. package/cjs/index-01072ac9.js +0 -97
  281. package/cjs/index-01072ac9.js.map +0 -1
  282. package/cjs/index-20a06ed6.js +0 -514
  283. package/cjs/index-20a06ed6.js.map +0 -1
  284. package/cjs/index-212a11f2.js +0 -722
  285. package/cjs/index-212a11f2.js.map +0 -1
  286. package/cjs/index-2faa2f93.js +0 -9
  287. package/cjs/index-2faa2f93.js.map +0 -1
  288. package/cjs/index-4f40f311.js +0 -67
  289. package/cjs/index-4f40f311.js.map +0 -1
  290. package/cjs/index-75453415.js +0 -54
  291. package/cjs/index-75453415.js.map +0 -1
  292. package/cjs/index-948426a8.js +0 -284
  293. package/cjs/index-948426a8.js.map +0 -1
  294. package/cjs/index-a2ce047a.js +0 -1880
  295. package/cjs/index-a2ce047a.js.map +0 -1
  296. package/cjs/index-d57081d1.js +0 -175
  297. package/cjs/index-d57081d1.js.map +0 -1
  298. package/cjs/index-e63da805.js +0 -130
  299. package/cjs/index-e63da805.js.map +0 -1
  300. package/cjs/index-f1971e28.js +0 -142
  301. package/cjs/index-f1971e28.js.map +0 -1
  302. package/cjs/index.css +0 -4465
  303. package/cjs/index.css.map +0 -1
  304. package/cjs/index.js +0 -162
  305. package/cjs/index.js.map +0 -1
  306. package/cjs/openChannelUtils-16f29ba2.js +0 -92
  307. package/cjs/openChannelUtils-16f29ba2.js.map +0 -1
  308. package/cjs/sendBirdSelectors.js +0 -741
  309. package/cjs/sendBirdSelectors.js.map +0 -1
  310. package/cjs/stringSet-b9ea6eef.js +0 -118
  311. package/cjs/stringSet-b9ea6eef.js.map +0 -1
  312. package/cjs/topics-11048db8.js +0 -18
  313. package/cjs/topics-11048db8.js.map +0 -1
  314. package/cjs/tslib.es6-07dd6257.js +0 -40
  315. package/cjs/tslib.es6-07dd6257.js.map +0 -1
  316. package/cjs/ui/Accordion.js +0 -74
  317. package/cjs/ui/Accordion.js.map +0 -1
  318. package/cjs/ui/AccordionGroup.js +0 -32
  319. package/cjs/ui/AccordionGroup.js.map +0 -1
  320. package/cjs/ui/AdminMessage.js +0 -44
  321. package/cjs/ui/AdminMessage.js.map +0 -1
  322. package/cjs/ui/Avatar.js +0 -226
  323. package/cjs/ui/Avatar.js.map +0 -1
  324. package/cjs/ui/Badge.js +0 -45
  325. package/cjs/ui/Badge.js.map +0 -1
  326. package/cjs/ui/Button.js +0 -17
  327. package/cjs/ui/Button.js.map +0 -1
  328. package/cjs/ui/ChannelAvatar.js +0 -59
  329. package/cjs/ui/ChannelAvatar.js.map +0 -1
  330. package/cjs/ui/ChannelPreview.js +0 -201
  331. package/cjs/ui/ChannelPreview.js.map +0 -1
  332. package/cjs/ui/ChatHeader.js +0 -145
  333. package/cjs/ui/ChatHeader.js.map +0 -1
  334. package/cjs/ui/Checkbox.js +0 -49
  335. package/cjs/ui/Checkbox.js.map +0 -1
  336. package/cjs/ui/ConnectionStatus.js +0 -34
  337. package/cjs/ui/ConnectionStatus.js.map +0 -1
  338. package/cjs/ui/ContextMenu.js +0 -431
  339. package/cjs/ui/ContextMenu.js.map +0 -1
  340. package/cjs/ui/DateSeparator.js +0 -44
  341. package/cjs/ui/DateSeparator.js.map +0 -1
  342. package/cjs/ui/Dropdown.js +0 -107
  343. package/cjs/ui/Dropdown.js.map +0 -1
  344. package/cjs/ui/EmojiReactions.js +0 -127
  345. package/cjs/ui/EmojiReactions.js.map +0 -1
  346. package/cjs/ui/FileMessageItemBody.js +0 -57
  347. package/cjs/ui/FileMessageItemBody.js.map +0 -1
  348. package/cjs/ui/FileViewer.js +0 -174
  349. package/cjs/ui/FileViewer.js.map +0 -1
  350. package/cjs/ui/Icon.js +0 -1462
  351. package/cjs/ui/Icon.js.map +0 -1
  352. package/cjs/ui/IconButton.js +0 -83
  353. package/cjs/ui/IconButton.js.map +0 -1
  354. package/cjs/ui/ImageRenderer.js +0 -138
  355. package/cjs/ui/ImageRenderer.js.map +0 -1
  356. package/cjs/ui/Input.js +0 -74
  357. package/cjs/ui/Input.js.map +0 -1
  358. package/cjs/ui/Label.js +0 -17
  359. package/cjs/ui/Label.js.map +0 -1
  360. package/cjs/ui/LinkLabel.js +0 -51
  361. package/cjs/ui/LinkLabel.js.map +0 -1
  362. package/cjs/ui/Loader.js +0 -44
  363. package/cjs/ui/Loader.js.map +0 -1
  364. package/cjs/ui/MentionUserLabel.js +0 -25
  365. package/cjs/ui/MentionUserLabel.js.map +0 -1
  366. package/cjs/ui/MessageContent.js +0 -291
  367. package/cjs/ui/MessageContent.js.map +0 -1
  368. package/cjs/ui/MessageInput.js +0 -5048
  369. package/cjs/ui/MessageInput.js.map +0 -1
  370. package/cjs/ui/MessageItemMenu.js +0 -141
  371. package/cjs/ui/MessageItemMenu.js.map +0 -1
  372. package/cjs/ui/MessageItemReactionMenu.js +0 -112
  373. package/cjs/ui/MessageItemReactionMenu.js.map +0 -1
  374. package/cjs/ui/MessageSearchFileItem.js +0 -130
  375. package/cjs/ui/MessageSearchFileItem.js.map +0 -1
  376. package/cjs/ui/MessageSearchItem.js +0 -93
  377. package/cjs/ui/MessageSearchItem.js.map +0 -1
  378. package/cjs/ui/MessageStatus.js +0 -66
  379. package/cjs/ui/MessageStatus.js.map +0 -1
  380. package/cjs/ui/Modal.js +0 -140
  381. package/cjs/ui/Modal.js.map +0 -1
  382. package/cjs/ui/MutedAvatarOverlay.js +0 -40
  383. package/cjs/ui/MutedAvatarOverlay.js.map +0 -1
  384. package/cjs/ui/OGMessageItemBody.js +0 -107
  385. package/cjs/ui/OGMessageItemBody.js.map +0 -1
  386. package/cjs/ui/OpenChannelAdminMessage.js +0 -27
  387. package/cjs/ui/OpenChannelAdminMessage.js.map +0 -1
  388. package/cjs/ui/OpenChannelAvatar.js +0 -41
  389. package/cjs/ui/OpenChannelAvatar.js.map +0 -1
  390. package/cjs/ui/OpenChannelMessageContent.js +0 -14
  391. package/cjs/ui/OpenChannelMessageContent.js.map +0 -1
  392. package/cjs/ui/OpenchannelConversationHeader.js +0 -73
  393. package/cjs/ui/OpenchannelConversationHeader.js.map +0 -1
  394. package/cjs/ui/OpenchannelFileMessage.js +0 -230
  395. package/cjs/ui/OpenchannelFileMessage.js.map +0 -1
  396. package/cjs/ui/OpenchannelOGMessage.js +0 -345
  397. package/cjs/ui/OpenchannelOGMessage.js.map +0 -1
  398. package/cjs/ui/OpenchannelThumbnailMessage.js +0 -305
  399. package/cjs/ui/OpenchannelThumbnailMessage.js.map +0 -1
  400. package/cjs/ui/OpenchannelUserMessage.js +0 -264
  401. package/cjs/ui/OpenchannelUserMessage.js.map +0 -1
  402. package/cjs/ui/PlaceHolder.js +0 -20
  403. package/cjs/ui/PlaceHolder.js.map +0 -1
  404. package/cjs/ui/QuoteMessage.js +0 -131
  405. package/cjs/ui/QuoteMessage.js.map +0 -1
  406. package/cjs/ui/QuoteMessageInput.js +0 -99
  407. package/cjs/ui/QuoteMessageInput.js.map +0 -1
  408. package/cjs/ui/ReactionBadge.js +0 -68
  409. package/cjs/ui/ReactionBadge.js.map +0 -1
  410. package/cjs/ui/ReactionButton.js +0 -55
  411. package/cjs/ui/ReactionButton.js.map +0 -1
  412. package/cjs/ui/SortByRow.js +0 -57
  413. package/cjs/ui/SortByRow.js.map +0 -1
  414. package/cjs/ui/TextButton.js +0 -45
  415. package/cjs/ui/TextButton.js.map +0 -1
  416. package/cjs/ui/TextMessageItemBody.js +0 -62
  417. package/cjs/ui/TextMessageItemBody.js.map +0 -1
  418. package/cjs/ui/ThumbnailMessageItemBody.js +0 -82
  419. package/cjs/ui/ThumbnailMessageItemBody.js.map +0 -1
  420. package/cjs/ui/Tooltip.js +0 -35
  421. package/cjs/ui/Tooltip.js.map +0 -1
  422. package/cjs/ui/TooltipWrapper.js +0 -65
  423. package/cjs/ui/TooltipWrapper.js.map +0 -1
  424. package/cjs/ui/UnknownMessageItemBody.js +0 -41
  425. package/cjs/ui/UnknownMessageItemBody.js.map +0 -1
  426. package/cjs/ui/UserListItem.js +0 -158
  427. package/cjs/ui/UserListItem.js.map +0 -1
  428. package/cjs/ui/UserProfile.js +0 -87
  429. package/cjs/ui/UserProfile.js.map +0 -1
  430. package/cjs/useSendbirdStateContext.js +0 -22
  431. package/cjs/useSendbirdStateContext.js.map +0 -1
  432. package/cjs/utils-3240365f.js +0 -32
  433. package/cjs/utils-3240365f.js.map +0 -1
  434. package/cjs/utils-53d332a6.js +0 -38
  435. package/cjs/utils-53d332a6.js.map +0 -1
  436. package/cjs/utils-94ae6cec.js +0 -6
  437. package/cjs/utils-94ae6cec.js.map +0 -1
  438. package/cjs/uuid-172844fb.js +0 -19
  439. package/cjs/uuid-172844fb.js.map +0 -1
  440. package/cjs/withSendBird.js +0 -35
  441. package/cjs/withSendBird.js.map +0 -1
  442. package/color-38dc84d3.js +0 -39
  443. package/color-38dc84d3.js.map +0 -1
  444. package/compareIds-f01e0c3c.js +0 -18
  445. package/compareIds-f01e0c3c.js.map +0 -1
  446. package/const-b6685801.js +0 -8
  447. package/const-b6685801.js.map +0 -1
  448. package/const-d46f09a1.js +0 -18
  449. package/const-d46f09a1.js.map +0 -1
  450. package/context-b5168bd0.js +0 -12
  451. package/context-b5168bd0.js.map +0 -1
  452. package/index-1c2588aa.js +0 -1873
  453. package/index-1c2588aa.js.map +0 -1
  454. package/index-2dce3a04.js +0 -87
  455. package/index-2dce3a04.js.map +0 -1
  456. package/index-3bd4a058.js +0 -168
  457. package/index-3bd4a058.js.map +0 -1
  458. package/index-62fd2db7.js +0 -48
  459. package/index-62fd2db7.js.map +0 -1
  460. package/index-6381b534.js +0 -512
  461. package/index-6381b534.js.map +0 -1
  462. package/index-9afb4d01.js +0 -64
  463. package/index-9afb4d01.js.map +0 -1
  464. package/index-a6675155.js +0 -280
  465. package/index-a6675155.js.map +0 -1
  466. package/index-b12b270e.js +0 -121
  467. package/index-b12b270e.js.map +0 -1
  468. package/index-d0b30cd5.js +0 -131
  469. package/index-d0b30cd5.js.map +0 -1
  470. package/index-d0fe8fe1.js +0 -7
  471. package/index-d0fe8fe1.js.map +0 -1
  472. package/index-e6d0889d.js +0 -682
  473. package/index-e6d0889d.js.map +0 -1
  474. package/index.d.ts +0 -1829
  475. package/index.js +0 -143
  476. package/index.js.map +0 -1
  477. package/openChannelUtils-22ed0258.js +0 -81
  478. package/openChannelUtils-22ed0258.js.map +0 -1
  479. package/sendBirdSelectors.js +0 -713
  480. package/sendBirdSelectors.js.map +0 -1
  481. package/stringSet-2e6c1d2c.js +0 -116
  482. package/stringSet-2e6c1d2c.js.map +0 -1
  483. package/topics-67738aac.js +0 -10
  484. package/topics-67738aac.js.map +0 -1
  485. package/tslib.es6-b6e567bd.js +0 -38
  486. package/tslib.es6-b6e567bd.js.map +0 -1
  487. package/ui/Accordion.js +0 -65
  488. package/ui/Accordion.js.map +0 -1
  489. package/ui/AccordionGroup.js +0 -26
  490. package/ui/AccordionGroup.js.map +0 -1
  491. package/ui/AdminMessage.js +0 -37
  492. package/ui/AdminMessage.js.map +0 -1
  493. package/ui/Avatar.js +0 -217
  494. package/ui/Avatar.js.map +0 -1
  495. package/ui/Badge.js +0 -38
  496. package/ui/Badge.js.map +0 -1
  497. package/ui/Button.js +0 -7
  498. package/ui/Button.js.map +0 -1
  499. package/ui/ChannelAvatar.js +0 -53
  500. package/ui/ChannelAvatar.js.map +0 -1
  501. package/ui/ChannelPreview.js +0 -194
  502. package/ui/ChannelPreview.js.map +0 -1
  503. package/ui/ChatHeader.js +0 -138
  504. package/ui/ChatHeader.js.map +0 -1
  505. package/ui/Checkbox.js +0 -42
  506. package/ui/Checkbox.js.map +0 -1
  507. package/ui/ConnectionStatus.js +0 -28
  508. package/ui/ConnectionStatus.js.map +0 -1
  509. package/ui/ContextMenu.js +0 -417
  510. package/ui/ContextMenu.js.map +0 -1
  511. package/ui/DateSeparator.js +0 -37
  512. package/ui/DateSeparator.js.map +0 -1
  513. package/ui/Dropdown.js +0 -97
  514. package/ui/Dropdown.js.map +0 -1
  515. package/ui/EmojiReactions.js +0 -121
  516. package/ui/EmojiReactions.js.map +0 -1
  517. package/ui/FileMessageItemBody.js +0 -51
  518. package/ui/FileMessageItemBody.js.map +0 -1
  519. package/ui/FileViewer.js +0 -164
  520. package/ui/FileViewer.js.map +0 -1
  521. package/ui/Icon.js +0 -1432
  522. package/ui/Icon.js.map +0 -1
  523. package/ui/IconButton.js +0 -76
  524. package/ui/IconButton.js.map +0 -1
  525. package/ui/ImageRenderer.js +0 -131
  526. package/ui/ImageRenderer.js.map +0 -1
  527. package/ui/Input.js +0 -64
  528. package/ui/Input.js.map +0 -1
  529. package/ui/Label.js +0 -6
  530. package/ui/Label.js.map +0 -1
  531. package/ui/LinkLabel.js +0 -40
  532. package/ui/LinkLabel.js.map +0 -1
  533. package/ui/Loader.js +0 -37
  534. package/ui/Loader.js.map +0 -1
  535. package/ui/MentionUserLabel.js +0 -19
  536. package/ui/MentionUserLabel.js.map +0 -1
  537. package/ui/MessageContent.js +0 -285
  538. package/ui/MessageContent.js.map +0 -1
  539. package/ui/MessageInput.js +0 -5040
  540. package/ui/MessageInput.js.map +0 -1
  541. package/ui/MessageItemMenu.js +0 -135
  542. package/ui/MessageItemMenu.js.map +0 -1
  543. package/ui/MessageItemReactionMenu.js +0 -106
  544. package/ui/MessageItemReactionMenu.js.map +0 -1
  545. package/ui/MessageSearchFileItem.js +0 -124
  546. package/ui/MessageSearchFileItem.js.map +0 -1
  547. package/ui/MessageSearchItem.js +0 -87
  548. package/ui/MessageSearchItem.js.map +0 -1
  549. package/ui/MessageStatus.js +0 -57
  550. package/ui/MessageStatus.js.map +0 -1
  551. package/ui/Modal.js +0 -128
  552. package/ui/Modal.js.map +0 -1
  553. package/ui/MutedAvatarOverlay.js +0 -34
  554. package/ui/MutedAvatarOverlay.js.map +0 -1
  555. package/ui/OGMessageItemBody.js +0 -101
  556. package/ui/OGMessageItemBody.js.map +0 -1
  557. package/ui/OpenChannelAdminMessage.js +0 -21
  558. package/ui/OpenChannelAdminMessage.js.map +0 -1
  559. package/ui/OpenChannelAvatar.js +0 -35
  560. package/ui/OpenChannelAvatar.js.map +0 -1
  561. package/ui/OpenChannelMessageContent.js +0 -8
  562. package/ui/OpenChannelMessageContent.js.map +0 -1
  563. package/ui/OpenchannelConversationHeader.js +0 -67
  564. package/ui/OpenchannelConversationHeader.js.map +0 -1
  565. package/ui/OpenchannelFileMessage.js +0 -224
  566. package/ui/OpenchannelFileMessage.js.map +0 -1
  567. package/ui/OpenchannelOGMessage.js +0 -339
  568. package/ui/OpenchannelOGMessage.js.map +0 -1
  569. package/ui/OpenchannelThumbnailMessage.js +0 -299
  570. package/ui/OpenchannelThumbnailMessage.js.map +0 -1
  571. package/ui/OpenchannelUserMessage.js +0 -258
  572. package/ui/OpenchannelUserMessage.js.map +0 -1
  573. package/ui/PlaceHolder.js +0 -11
  574. package/ui/PlaceHolder.js.map +0 -1
  575. package/ui/QuoteMessage.js +0 -125
  576. package/ui/QuoteMessage.js.map +0 -1
  577. package/ui/QuoteMessageInput.js +0 -93
  578. package/ui/QuoteMessageInput.js.map +0 -1
  579. package/ui/ReactionBadge.js +0 -61
  580. package/ui/ReactionBadge.js.map +0 -1
  581. package/ui/ReactionButton.js +0 -48
  582. package/ui/ReactionButton.js.map +0 -1
  583. package/ui/SortByRow.js +0 -50
  584. package/ui/SortByRow.js.map +0 -1
  585. package/ui/TextButton.js +0 -38
  586. package/ui/TextButton.js.map +0 -1
  587. package/ui/TextMessageItemBody.js +0 -56
  588. package/ui/TextMessageItemBody.js.map +0 -1
  589. package/ui/ThumbnailMessageItemBody.js +0 -76
  590. package/ui/ThumbnailMessageItemBody.js.map +0 -1
  591. package/ui/Tooltip.js +0 -28
  592. package/ui/Tooltip.js.map +0 -1
  593. package/ui/TooltipWrapper.js +0 -58
  594. package/ui/TooltipWrapper.js.map +0 -1
  595. package/ui/UnknownMessageItemBody.js +0 -35
  596. package/ui/UnknownMessageItemBody.js.map +0 -1
  597. package/ui/UserListItem.js +0 -151
  598. package/ui/UserListItem.js.map +0 -1
  599. package/ui/UserProfile.js +0 -81
  600. package/ui/UserProfile.js.map +0 -1
  601. package/useSendbirdStateContext.js +0 -20
  602. package/useSendbirdStateContext.js.map +0 -1
  603. package/utils-04c291d8.js +0 -34
  604. package/utils-04c291d8.js.map +0 -1
  605. package/utils-28de36e9.js +0 -30
  606. package/utils-28de36e9.js.map +0 -1
  607. package/utils-f5c9ef64.js +0 -4
  608. package/utils-f5c9ef64.js.map +0 -1
  609. package/uuid-0139dc21.js +0 -17
  610. package/uuid-0139dc21.js.map +0 -1
  611. package/withSendBird.js +0 -26
  612. package/withSendBird.js.map +0 -1
package/cjs/index.css DELETED
@@ -1,4465 +0,0 @@
1
- .sendbird-text {
2
- color: var(--primary-1); }
3
-
4
- .sendbird-openchannel-conversation-header {
5
- position: relative;
6
- min-height: 64px;
7
- box-sizing: border-box; }
8
- .sendbird-theme--light .sendbird-openchannel-conversation-header {
9
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
10
- .sendbird-theme--dark .sendbird-openchannel-conversation-header {
11
- border-bottom: 1px solid var(--sendbird-dark-ondark-04); }
12
- .sendbird-openchannel-conversation-header .sendbird-openchannel-conversation-header__left__title {
13
- white-space: nowrap;
14
- overflow-x: hidden;
15
- text-overflow: ellipsis;
16
- max-width: calc(100% - 120px); }
17
- .sendbird-openchannel-conversation-header__left [class*=sendbird-openchannel-conversation-header__left__cover-image] {
18
- position: absolute;
19
- left: 20px;
20
- top: 16px; }
21
- .sendbird-openchannel-conversation-header__left__title {
22
- position: absolute;
23
- left: 60px;
24
- top: 12px; }
25
- .sendbird-openchannel-conversation-header__left__sub-title {
26
- position: absolute;
27
- left: 60px;
28
- top: 36px; }
29
- .sendbird-openchannel-conversation-header__right {
30
- position: absolute;
31
- top: 0px;
32
- right: 0px;
33
- width: 64px;
34
- height: 64px; }
35
- .sendbird-openchannel-conversation-header__right__trigger {
36
- position: absolute;
37
- top: 16px;
38
- right: 16px;
39
- display: flex;
40
- align-items: center;
41
- justify-content: center; }
42
-
43
- .sendbird-openchannel-conversation-header__left__cover-image--icon {
44
- display: flex;
45
- justify-content: center;
46
- align-items: center;
47
- border-radius: 50%; }
48
- .sendbird-theme--light .sendbird-openchannel-conversation-header__left__cover-image--icon {
49
- background-color: var(--sendbird-light-background-300); }
50
- .sendbird-theme--dark .sendbird-openchannel-conversation-header__left__cover-image--icon {
51
- background-color: var(--sendbird-dark-background-300); }
52
-
53
- .sendbird-chat-header {
54
- position: relative;
55
- display: flex;
56
- flex-direction: row;
57
- justify-content: space-between;
58
- align-items: center;
59
- height: 64px;
60
- min-height: 64px;
61
- padding-left: 20px;
62
- padding-right: 16px;
63
- overflow: hidden;
64
- text-overflow: ellipsis;
65
- box-sizing: border-box; }
66
- .sendbird-theme--light .sendbird-chat-header {
67
- border-bottom: 1px solid var(--sendbird-light-onlight-04);
68
- background-color: var(--sendbird-light-background-50); }
69
- .sendbird-theme--dark .sendbird-chat-header {
70
- border-bottom: 1px solid var(--sendbird-dark-ondark-04);
71
- background-color: var(--sendbird-dark-background-600); }
72
- .sendbird-chat-header__left {
73
- margin-right: 24px; }
74
- .sendbird-chat-header__left, .sendbird-chat-header__right {
75
- overflow: hidden;
76
- display: flex;
77
- flex-direction: row;
78
- align-items: center; }
79
- .sendbird-chat-header .sendbird-chat-header__left__title {
80
- margin-left: 8px;
81
- margin-right: 16px;
82
- overflow: hidden;
83
- text-overflow: ellipsis;
84
- white-space: nowrap;
85
- max-width: 780px; }
86
- .sendbird-chat-header .sendbird-chat-header__left__subtitle {
87
- max-width: 240px;
88
- overflow: hidden;
89
- text-overflow: ellipsis; }
90
- .sendbird-chat-header .sendbird-chat-header__right__mute {
91
- margin-right: 26px; }
92
- .sendbird-chat-header .sendbird-iconbutton--pressed {
93
- background-color: inherit; }
94
- .sendbird-chat-header .sendbird-chat-header__right__info {
95
- margin-left: 16px; }
96
-
97
- .sendbird__offline .sendbird-channel-preview {
98
- cursor: not-allowed; }
99
-
100
- .sendbird-channel-preview {
101
- position: relative;
102
- cursor: pointer;
103
- box-sizing: border-box;
104
- width: 320px;
105
- height: 80px;
106
- display: flex;
107
- flex-direction: row;
108
- align-items: center;
109
- justify-content: center;
110
- padding: 12px 16px 12px 16px; }
111
- .sendbird-theme--light .sendbird-channel-preview {
112
- border-bottom: solid 1px var(--sendbird-light-onlight-04); }
113
- .sendbird-theme--dark .sendbird-channel-preview {
114
- border-bottom: solid 1px var(--sendbird-dark-ondark-04); }
115
- .sendbird-channel-preview:focus {
116
- outline: none; }
117
- .sendbird-channel-preview .sendbird-channel-preview__avatar {
118
- width: 56px;
119
- height: 56px; }
120
- .sendbird-channel-preview .sendbird-channel-preview__content {
121
- width: 100%;
122
- height: 100%;
123
- margin-left: 16px; }
124
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper {
125
- display: flex;
126
- justify-content: space-between;
127
- width: 216px;
128
- height: 16px; }
129
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__header {
130
- display: flex;
131
- justify-content: flex-start;
132
- overflow: hidden;
133
- text-overflow: ellipsis; }
134
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__header .sendbird-channel-preview__content__upper__header__broadcast-icon {
135
- padding-right: 4px; }
136
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__header .sendbird-channel-preview__content__upper__header__channel-name {
137
- overflow: hidden;
138
- text-overflow: ellipsis;
139
- max-width: 128px;
140
- word-break: break-all;
141
- white-space: nowrap; }
142
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__header .sendbird-channel-preview__content__upper__header__total-members {
143
- margin-top: 2px;
144
- margin-left: 4px; }
145
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__header .sendbird-channel-preview__content__upper__header__frozen-icon {
146
- padding-left: 4px; }
147
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__last-message-at {
148
- margin-left: 4px;
149
- margin-bottom: 4px;
150
- white-space: nowrap; }
151
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__lower {
152
- margin-top: 8px;
153
- width: 216px;
154
- height: 32px;
155
- display: flex;
156
- justify-content: space-between; }
157
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__lower .sendbird-channel-preview__content__lower__last-message {
158
- overflow: hidden;
159
- text-overflow: ellipsis; }
160
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__lower .sendbird-channel-preview__content__lower__unread-message-count {
161
- margin-left: 8px;
162
- margin-bottom: 12px; }
163
- .sendbird-channel-preview .sendbird-channel-preview__action {
164
- position: absolute;
165
- top: 12px;
166
- right: 12px;
167
- display: inline-block; }
168
- .sendbird-channel-preview .sendbird-channel-preview__action .sendbird-iconbutton {
169
- display: none; }
170
- .sendbird-theme--light .sendbird-channel-preview:hover {
171
- background-color: var(--sendbird-light-background-100); }
172
- .sendbird-theme--dark .sendbird-channel-preview:hover {
173
- background-color: var(--sendbird-dark-background-500); }
174
- .sendbird-channel-preview:hover .sendbird-channel-preview__action .sendbird-iconbutton {
175
- display: inline-block; }
176
- .sendbird-channel-preview:hover .sendbird-channel-preview__content__upper__last-message-at {
177
- display: none; }
178
- .sendbird-channel-preview:hover .sendbird-channel-preview__content__lower__unread-message-count {
179
- display: none; }
180
-
181
- .sendbird-channel-preview--active {
182
- padding: 12px 16px 12px 12px; }
183
- .sendbird-theme--light .sendbird-channel-preview--active {
184
- border-left: solid 4px var(--sendbird-light-primary-300);
185
- border-bottom: solid 1px var(--sendbird-light-onlight-04);
186
- background-color: var(--sendbird-light-primary-100); }
187
- .sendbird-theme--dark .sendbird-channel-preview--active {
188
- border-left: solid 4px var(--sendbird-dark-primary-200);
189
- border-bottom: solid 1px var(--sendbird-dark-ondark-04);
190
- background-color: var(--sendbird-dark-background-700); }
191
- .sendbird-theme--light .sendbird-channel-preview--active .sendbird-channel-preview__content__upper__header__channel-name {
192
- color: var(--sendbird-light-primary-300); }
193
- .sendbird-theme--dark .sendbird-channel-preview--active .sendbird-channel-preview__content__upper__header__channel-name {
194
- color: var(--sendbird-dark-primary-200); }
195
-
196
- .sendbird-dropdown {
197
- position: relative;
198
- display: inline-block; }
199
- .sendbird-dropdown .sendbird-dropdown__menu {
200
- position: absolute;
201
- top: 100%;
202
- left: 0;
203
- min-width: 140px;
204
- margin: 0px;
205
- padding: 8px 0px;
206
- border-radius: 4px;
207
- list-style: none; }
208
- .sendbird-theme--light .sendbird-dropdown .sendbird-dropdown__menu {
209
- box-shadow: var(--sendbird-light-shadow-02);
210
- background-color: var(--sendbird-light-background-50); }
211
- .sendbird-theme--dark .sendbird-dropdown .sendbird-dropdown__menu {
212
- box-shadow: var(--sendbird-dark-shadow-02);
213
- background-color: var(--sendbird-dark-background-500); }
214
- .sendbird-dropdown .sendbird-dropdown__menu .sendbird-dropdown__menu-item {
215
- cursor: pointer;
216
- white-space: nowrap;
217
- padding: 8px 16px; }
218
- .sendbird-theme--light .sendbird-dropdown .sendbird-dropdown__menu .sendbird-dropdown__menu-item:hover {
219
- background-color: var(--sendbird-light-background-100); }
220
- .sendbird-theme--dark .sendbird-dropdown .sendbird-dropdown__menu .sendbird-dropdown__menu-item:hover {
221
- background-color: var(--sendbird-dark-background-400); }
222
-
223
- @import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&display=swap");
224
- :root {
225
- --sendbird-light-primary-500: #491389;
226
- --sendbird-light-primary-400: #6211c8;
227
- --sendbird-light-primary-300: #742ddd;
228
- --sendbird-light-primary-200: #c2a9fa;
229
- --sendbird-light-primary-100: #dbd1ff;
230
- --sendbird-light-secondary-500: #066858;
231
- --sendbird-light-secondary-400: #027d69;
232
- --sendbird-light-secondary-300: #259c72;
233
- --sendbird-light-secondary-200: #69c085;
234
- --sendbird-light-secondary-100: #a8e2ab;
235
- --sendbird-light-information-100: #adc9ff;
236
- --sendbird-light-error-500: #9d091e;
237
- --sendbird-light-error-400: #bf0711;
238
- --sendbird-light-error-300: #de360b;
239
- --sendbird-light-error-200: #f66161;
240
- --sendbird-light-error-100: #fdaaaa;
241
- --sendbird-light-background-700: #000000;
242
- --sendbird-light-background-600: #161616;
243
- --sendbird-light-background-500: #2C2C2C;
244
- --sendbird-light-background-400: #393939;
245
- --sendbird-light-background-300: #bdbdbd;
246
- --sendbird-light-background-200: #e0e0e0;
247
- --sendbird-light-background-100: #eeeeee;
248
- --sendbird-light-background-50: #FFFFFF;
249
- --sendbird-light-overlay-01: rgba(0, 0, 0, 0.55);
250
- --sendbird-light-overlay-02: rgba(0, 0, 0, 0.32);
251
- --sendbird-light-onlight-01: rgba(0, 0, 0, 0.88);
252
- --sendbird-light-onlight-02: rgba(0, 0, 0, 0.50);
253
- --sendbird-light-onlight-03: rgba(0, 0, 0, 0.38);
254
- --sendbird-light-onlight-04: rgba(0, 0, 0, 0.12);
255
- --sendbird-light-ondark-01: rgba(255, 255, 255, 0.88);
256
- --sendbird-light-ondark-02: rgba(255, 255, 255, 0.50);
257
- --sendbird-light-ondark-03: rgba(255, 255, 255, 0.38);
258
- --sendbird-light-ondark-04: rgba(255, 255, 255, 0.12);
259
- --sendbird-light-shadow-01: 0 1px 5px 0 rgba(33, 34, 66, 0.04), 0 0 3px 0 rgba(0, 0, 0, 0.08), 0 2px 1px 0 rgba(0, 0, 0, 0.12);
260
- --sendbird-light-shadow-02: 0 3px 5px -3px rgba(33, 34, 66, 0.04), 0 3px 14px 2px rgba(0, 0, 0, 0.08), 0 8px 10px 1px rgba(0, 0, 0, 0.12);
261
- --sendbird-light-shadow-03: 0 6px 10px -5px rgba(0, 0, 0, 0.04), 0 6px 30px 5px rgba(0, 0, 0, 0.08), 0 16px 24px 2px rgba(0, 0, 0, 0.12);
262
- --sendbird-light-shadow-04: 0 9px 15px -7px rgba(0, 0, 0, 0.04), 0 9px 46px 8px rgba(0, 0, 0, 0.08), 0 24px 38px 3px rgba(0, 0, 0, 0.12);
263
- --sendbird-light-shadow-05: 0 2px 8px 0 rgba(0, 0, 0, 0.08), 0 4px 6px 0 rgba(0, 0, 0, 0.12);
264
- --sendbird-light-shadow-message-input: 0 1px 5px 0 rgba(33, 34, 66, 0.12), 0 0 1px 0 rgba(33, 34, 66, 0.16), 0 2px 1px 0 rgba(33, 34, 66, 0.08), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
265
-
266
- :root {
267
- --sendbird-dark-primary-500: #491389;
268
- --sendbird-dark-primary-400: #6211c8;
269
- --sendbird-dark-primary-300: #742ddd;
270
- --sendbird-dark-primary-200: #c2a9fa;
271
- --sendbird-dark-primary-100: #dbd1ff;
272
- --sendbird-dark-secondary-500: #066858;
273
- --sendbird-dark-secondary-400: #027d69;
274
- --sendbird-dark-secondary-300: #259c72;
275
- --sendbird-dark-secondary-200: #69c085;
276
- --sendbird-dark-secondary-100: #a8e2ab;
277
- --sendbird-dark-information-100: #adc9ff;
278
- --sendbird-dark-error-500: #9d091e;
279
- --sendbird-dark-error-400: #bf0711;
280
- --sendbird-dark-error-300: #de360b;
281
- --sendbird-dark-error-200: #f66161;
282
- --sendbird-dark-error-100: #fdaaaa;
283
- --sendbird-dark-background-700: #000000;
284
- --sendbird-dark-background-600: #161616;
285
- --sendbird-dark-background-500: #2C2C2C;
286
- --sendbird-dark-background-400: #393939;
287
- --sendbird-dark-background-300: #bdbdbd;
288
- --sendbird-dark-background-200: #e0e0e0;
289
- --sendbird-dark-background-100: #eeeeee;
290
- --sendbird-dark-background-50: #FFFFFF;
291
- --sendbird-dark-overlay-01: rgba(0, 0, 0, 0.55);
292
- --sendbird-dark-overlay-02: rgba(0, 0, 0, 0.32);
293
- --sendbird-dark-onlight-01: rgba(0, 0, 0, 0.88);
294
- --sendbird-dark-onlight-02: rgba(0, 0, 0, 0.50);
295
- --sendbird-dark-onlight-03: rgba(0, 0, 0, 0.38);
296
- --sendbird-dark-onlight-04: rgba(0, 0, 0, 0.12);
297
- --sendbird-dark-ondark-01: rgba(255, 255, 255, 0.88);
298
- --sendbird-dark-ondark-02: rgba(255, 255, 255, 0.50);
299
- --sendbird-dark-ondark-03: rgba(255, 255, 255, 0.38);
300
- --sendbird-dark-ondark-04: rgba(255, 255, 255, 0.12);
301
- --sendbird-dark-shadow-01: 0 1px 5px 0 rgba(33, 34, 66, 0.04), 0 0 3px 0 rgba(0, 0, 0, 0.08), 0 2px 1px 0 rgba(0, 0, 0, 0.12);
302
- --sendbird-dark-shadow-02: 0 3px 5px -3px rgba(33, 34, 66, 0.04), 0 3px 14px 2px rgba(0, 0, 0, 0.08), 0 8px 10px 1px rgba(0, 0, 0, 0.12);
303
- --sendbird-dark-shadow-03: 0 6px 10px -5px rgba(0, 0, 0, 0.04), 0 6px 30px 5px rgba(0, 0, 0, 0.08), 0 16px 24px 2px rgba(0, 0, 0, 0.12);
304
- --sendbird-dark-shadow-04: 0 9px 15px -7px rgba(0, 0, 0, 0.04), 0 9px 46px 8px rgba(0, 0, 0, 0.08), 0 24px 38px 3px rgba(0, 0, 0, 0.12);
305
- --sendbird-light-shadow-05: 0 2px 8px 0 rgba(0, 0, 0, 0.08), 0 4px 6px 0 rgba(0, 0, 0, 0.12);
306
- --sendbird-dark-shadow-message-input: 0 1px 5px 0 rgba(33, 34, 66, 0.12), 0 0 1px 0 rgba(33, 34, 66, 0.16), 0 2px 1px 0 rgba(33, 34, 66, 0.08), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
307
-
308
- :root {
309
- --sendbird-iconbutton-color: #825eeb;
310
- --sendbird-message-input-border-active: #7B53EF;
311
- --sendbird-selected-reaction-button-border-hover: #9E8CF5;
312
- --sendbird-add-reaction-button-border-hover: #9E8CF5;
313
- --sendbird-tooltip-background: #000000;
314
- --sendbird-tooltip-text-color: rgba(255, 255, 255, 0.88);
315
- --sendbird-button-border-focus: #FFFFFF;
316
- --sendbird-file-message-icon-background: #FFFFFF;
317
- --sendbird-font-family-default: 'Roboto', sans-serif;
318
- --sendbird-message-balloon-width: 404px; }
319
-
320
- .sendbird-channel-list {
321
- width: 320px;
322
- height: 100%;
323
- display: flex;
324
- flex-direction: column;
325
- box-sizing: border-box; }
326
- .sendbird-theme--light .sendbird-channel-list {
327
- background-color: var(--sendbird-light-background-50); }
328
- .sendbird-theme--dark .sendbird-channel-list {
329
- background-color: var(--sendbird-dark-background-600); }
330
-
331
- .sendbird-channel-list__header {
332
- height: 64px;
333
- min-height: 64px; }
334
-
335
- .sendbird-channel-list__body {
336
- flex: 1 1 0;
337
- -ms-flex: 1;
338
- overflow-y: auto;
339
- overflow-x: hidden; }
340
-
341
- [class*=sendbird-label] {
342
- font-family: var(--sendbird-font-family-default); }
343
-
344
- .sendbird-label--h-1 {
345
- font-size: 20px;
346
- font-weight: 600;
347
- font-stretch: normal;
348
- font-style: normal;
349
- line-height: 1.4;
350
- letter-spacing: -0.2px; }
351
-
352
- .sendbird-label--h-2 {
353
- font-size: 18px;
354
- font-weight: 600;
355
- font-stretch: normal;
356
- font-style: normal;
357
- line-height: normal;
358
- letter-spacing: -0.2px; }
359
-
360
- .sendbird-label--subtitle-1 {
361
- font-size: 16px;
362
- font-weight: normal;
363
- font-stretch: normal;
364
- font-style: normal;
365
- line-height: 1.38;
366
- letter-spacing: -0.2px; }
367
-
368
- .sendbird-label--subtitle-2 {
369
- font-size: 14px;
370
- font-weight: 600;
371
- font-stretch: normal;
372
- font-style: normal;
373
- line-height: 1.14;
374
- letter-spacing: -0.2px; }
375
-
376
- .sendbird-label--body-1 {
377
- font-size: 14px;
378
- font-weight: normal;
379
- font-stretch: normal;
380
- font-style: normal;
381
- line-height: 1.43;
382
- letter-spacing: normal; }
383
-
384
- .sendbird-label--body-2 {
385
- font-size: 12px;
386
- font-weight: normal;
387
- font-stretch: normal;
388
- font-style: normal;
389
- line-height: 1.33;
390
- letter-spacing: normal; }
391
-
392
- .sendbird-label--button-1 {
393
- font-size: 14px;
394
- font-weight: 600;
395
- font-stretch: normal;
396
- font-style: normal;
397
- line-height: 1.43;
398
- letter-spacing: normal; }
399
-
400
- .sendbird-label--button-2 {
401
- font-size: 14px;
402
- font-weight: normal;
403
- font-stretch: normal;
404
- font-style: normal;
405
- line-height: 1.43;
406
- letter-spacing: normal; }
407
-
408
- .sendbird-label--caption-1 {
409
- font-size: 14px;
410
- font-weight: 600;
411
- font-stretch: normal;
412
- font-style: normal;
413
- line-height: 1.43;
414
- letter-spacing: normal; }
415
-
416
- .sendbird-label--caption-2 {
417
- font-size: 12px;
418
- font-weight: bold;
419
- font-style: normal;
420
- line-height: 1;
421
- letter-spacing: normal; }
422
-
423
- .sendbird-label--caption-3 {
424
- font-size: 12px;
425
- font-weight: normal;
426
- font-stretch: normal;
427
- font-style: normal;
428
- line-height: 1;
429
- letter-spacing: normal; }
430
-
431
- .sendbird-theme--light .sendbird-label--color-onbackground-1 {
432
- color: var(--sendbird-light-onlight-01); }
433
-
434
- .sendbird-theme--dark .sendbird-label--color-onbackground-1 {
435
- color: var(--sendbird-dark-ondark-01); }
436
-
437
- .sendbird-theme--light .sendbird-label--color-onbackground-2 {
438
- color: var(--sendbird-light-onlight-02); }
439
-
440
- .sendbird-theme--dark .sendbird-label--color-onbackground-2 {
441
- color: var(--sendbird-dark-ondark-02); }
442
-
443
- .sendbird-theme--light .sendbird-label--color-onbackground-3 {
444
- color: var(--sendbird-light-onlight-03); }
445
-
446
- .sendbird-theme--dark .sendbird-label--color-onbackground-3 {
447
- color: var(--sendbird-dark-ondark-03); }
448
-
449
- .sendbird-theme--light .sendbird-label--color-onbackground-4 {
450
- color: var(--sendbird-light-onlight-04); }
451
-
452
- .sendbird-theme--dark .sendbird-label--color-onbackground-4 {
453
- color: var(--sendbird-dark-ondark-04); }
454
-
455
- .sendbird-theme--light .sendbird-label--color-oncontent-1 {
456
- color: var(--sendbird-light-ondark-01); }
457
-
458
- .sendbird-theme--dark .sendbird-label--color-oncontent-1 {
459
- color: var(--sendbird-dark-onlight-01); }
460
-
461
- .sendbird-theme--light .sendbird-label--color-oncontent-2 {
462
- color: var(--sendbird-light-ondark-02); }
463
-
464
- .sendbird-theme--dark .sendbird-label--color-oncontent-2 {
465
- color: var(--sendbird-dark-onlight-02); }
466
-
467
- .sendbird-theme--light .sendbird-label--color-primary {
468
- color: var(--sendbird-light-primary-300); }
469
-
470
- .sendbird-theme--dark .sendbird-label--color-primary {
471
- color: var(--sendbird-dark-primary-200); }
472
-
473
- .sendbird-theme--light .sendbird-label--color-error {
474
- color: var(--sendbird-light-error-300); }
475
-
476
- .sendbird-theme--dark .sendbird-label--color-error {
477
- color: var(--sendbird-dark-error-200); }
478
-
479
- .sendbird-theme--light .sendbird-label--color-secondary-3 {
480
- color: var(--sendbird-light-secondary-300); }
481
-
482
- .sendbird-theme--dark .sendbird-label--color-secondary-3 {
483
- color: var(--sendbird-dark-secondary-200); }
484
-
485
- .sendbird-iconbutton {
486
- color: var(--sendbird-iconbutton-color);
487
- display: inline-flex;
488
- justify-content: center;
489
- align-items: center;
490
- padding: 3px;
491
- background-color: transparent;
492
- cursor: pointer;
493
- -webkit-user-select: none;
494
- -moz-user-select: none;
495
- -ms-user-select: none;
496
- user-select: none;
497
- border: 1px solid transparent;
498
- border-radius: 4px;
499
- outline: 0px; }
500
- .sendbird-iconbutton .sendbird-iconbutton__inner {
501
- height: 100%; }
502
- .sendbird-theme--light .sendbird-iconbutton .sendbird-iconbutton__inner svg {
503
- fill: var(--sendbird-light-onlight-01); }
504
- .sendbird-theme--dark .sendbird-iconbutton .sendbird-iconbutton__inner svg {
505
- fill: var(--sendbird-dark-ondark-01); }
506
- .sendbird-theme--light .sendbird-iconbutton:hover {
507
- background-color: var(--sendbird-light-background-100); }
508
- .sendbird-theme--dark .sendbird-iconbutton:hover {
509
- background-color: var(--sendbird-dark-background-500); }
510
- .sendbird-theme--light .sendbird-iconbutton:active {
511
- background-color: var(--sendbird-light-background-200); }
512
- .sendbird-theme--dark .sendbird-iconbutton:active {
513
- background-color: var(--sendbird-dark-background-400); }
514
- .sendbird-iconbutton:disabled {
515
- cursor: not-allowed !important; }
516
- .sendbird-theme--light .sendbird-iconbutton:disabled .sendbird-iconbutton__inner svg, .sendbird-theme--light .sendbird-iconbutton:disabled .sendbird-iconbutton__inner path {
517
- fill: var(--sendbird-light-onlight-02); }
518
- .sendbird-theme--dark .sendbird-iconbutton:disabled .sendbird-iconbutton__inner svg, .sendbird-theme--dark .sendbird-iconbutton:disabled .sendbird-iconbutton__inner path {
519
- fill: var(--sendbird-dark-ondark-02); }
520
-
521
- .sendbird-theme--light .sendbird-iconbutton--pressed {
522
- background-color: var(--sendbird-light-primary-100); }
523
-
524
- .sendbird-theme--dark .sendbird-iconbutton--pressed {
525
- background-color: var(--sendbird-dark-background-700); }
526
-
527
- .sendbird-channel-header {
528
- position: relative;
529
- height: 64px;
530
- min-height: 64px;
531
- width: 320px;
532
- padding: 8px 64px 8px 8px;
533
- box-sizing: border-box; }
534
- .sendbird-theme--light .sendbird-channel-header {
535
- border-bottom: 1px solid var(--sendbird-light-onlight-04);
536
- background-color: var(--sendbird-light-background-50); }
537
- .sendbird-theme--dark .sendbird-channel-header {
538
- border-bottom: 1px solid var(--sendbird-dark-ondark-04);
539
- background-color: var(--sendbird-dark-background-600); }
540
- .sendbird-channel-header.sendbird-channel-header--allow-edit .sendbird-channel-header__title {
541
- cursor: pointer; }
542
- .sendbird-channel-header .sendbird-channel-header__title {
543
- display: flex;
544
- flex-direction: row;
545
- width: 260px;
546
- height: 48px;
547
- border-radius: 4px; }
548
- .sendbird-theme--light .sendbird-channel-header .sendbird-channel-header__title:hover {
549
- background: var(--sendbird-light-background-100); }
550
- .sendbird-theme--dark .sendbird-channel-header .sendbird-channel-header__title:hover {
551
- background: var(--sendbird-dark-background-500); }
552
- .sendbird-channel-header .sendbird-channel-header__title:focus {
553
- outline: none; }
554
- .sendbird-theme--light .sendbird-channel-header .sendbird-channel-header__title:focus {
555
- background: var(--sendbird-light-background-200); }
556
- .sendbird-theme--dark .sendbird-channel-header .sendbird-channel-header__title:focus {
557
- background: var(--sendbird-dark-background-400); }
558
- .sendbird-theme--light .sendbird-channel-header .sendbird-channel-header__title:active {
559
- border: solid 2px var(--sendbird-light-primary-300); }
560
- .sendbird-theme--dark .sendbird-channel-header .sendbird-channel-header__title:active {
561
- border: solid 2px var(--sendbird-dark-primary-200); }
562
- .sendbird-channel-header .sendbird-channel-header__title .sendbird-channel-header__title__left {
563
- width: 48px;
564
- padding: 8px;
565
- box-sizing: border-box; }
566
- .sendbird-channel-header .sendbird-channel-header__title .sendbird-channel-header__title__right {
567
- margin-left: 4px;
568
- padding-top: 8px; }
569
- .sendbird-channel-header .sendbird-channel-header__title .sendbird-channel-header__title__right__name,
570
- .sendbird-channel-header .sendbird-channel-header__title .sendbird-channel-header__title__right__user-id {
571
- display: block;
572
- max-width: 200px;
573
- white-space: nowrap;
574
- overflow: hidden;
575
- text-overflow: ellipsis; }
576
- .sendbird-channel-header .sendbird-channel-header__right-icon {
577
- position: absolute;
578
- right: 16px;
579
- top: 16px; }
580
-
581
- .sendbird-image-renderer {
582
- overflow: hidden;
583
- position: relative; }
584
-
585
- .sendbird-image-renderer__hidden-image-loader {
586
- display: none; }
587
-
588
- .sendbird-icon {
589
- display: inline-block; }
590
- .sendbird-icon:focus {
591
- outline: none; }
592
-
593
- .sendbird-theme--light .sendbird-icon-color--primary [class*='fill'] {
594
- fill: var(--sendbird-light-primary-300); }
595
-
596
- .sendbird-theme--dark .sendbird-icon-color--primary [class*='fill'] {
597
- fill: var(--sendbird-dark-primary-200); }
598
-
599
- .sendbird-theme--light .sendbird-icon-color--primary [class*='stroke'] {
600
- stroke: var(--sendbird-light-primary-300);
601
- stroke-width: 2px;
602
- stroke-linejoin: round; }
603
-
604
- .sendbird-theme--dark .sendbird-icon-color--primary [class*='stroke'] {
605
- stroke: var(--sendbird-dark-primary-200);
606
- stroke-width: 2px;
607
- stroke-linejoin: round; }
608
-
609
- .sendbird-theme--light .sendbird-icon-color--secondary [class*='fill'] {
610
- fill: var(--sendbird-light-secondary-300); }
611
-
612
- .sendbird-theme--dark .sendbird-icon-color--secondary [class*='fill'] {
613
- fill: var(--sendbird-dark-secondary-200); }
614
-
615
- .sendbird-theme--light .sendbird-icon-color--content [class*='fill'] {
616
- fill: var(--sendbird-light-ondark-01); }
617
-
618
- .sendbird-theme--dark .sendbird-icon-color--content [class*='fill'] {
619
- fill: var(--sendbird-dark-onlight-01); }
620
-
621
- .sendbird-theme--light .sendbird-icon-color--content-inverse [class*='fill'] {
622
- fill: var(--sendbird-light-onlight-01); }
623
-
624
- .sendbird-theme--dark .sendbird-icon-color--content-inverse [class*='fill'] {
625
- fill: var(--sendbird-dark-ondark-01); }
626
-
627
- .sendbird-icon-color--white [class*='fill'] {
628
- fill: #ffffff; }
629
-
630
- .sendbird-icon-color--gray [class*='fill'] {
631
- fill: var(--sendbird-light-onlight-04); }
632
-
633
- .sendbird-theme--light .sendbird-icon-color--sent [class*='fill'] {
634
- fill: var(--sendbird-light-onlight-03); }
635
-
636
- .sendbird-theme--dark .sendbird-icon-color--sent [class*='fill'] {
637
- fill: var(--sendbird-dark-ondark-03); }
638
-
639
- .sendbird-theme--light .sendbird-icon-color--read [class*='fill'] {
640
- fill: var(--sendbird-light-secondary-300); }
641
-
642
- .sendbird-theme--dark .sendbird-icon-color--read [class*='fill'] {
643
- fill: var(--sendbird-dark-secondary-200); }
644
-
645
- .sendbird-theme--light .sendbird-icon-color--on-background-1 [class*='fill'] {
646
- fill: var(--sendbird-light-onlight-01); }
647
-
648
- .sendbird-theme--dark .sendbird-icon-color--on-background-1 [class*='fill'] {
649
- fill: var(--sendbird-dark-ondark-01); }
650
-
651
- .sendbird-theme--light .sendbird-icon-color--on-background-2 [class*='fill'] {
652
- fill: var(--sendbird-light-onlight-02); }
653
-
654
- .sendbird-theme--dark .sendbird-icon-color--on-background-2 [class*='fill'] {
655
- fill: var(--sendbird-dark-ondark-02); }
656
-
657
- .sendbird-theme--light .sendbird-icon-color--on-background-3 [class*='fill'] {
658
- fill: var(--sendbird-light-onlight-03); }
659
-
660
- .sendbird-theme--dark .sendbird-icon-color--on-background-3 [class*='fill'] {
661
- fill: var(--sendbird-dark-ondark-03); }
662
-
663
- .sendbird-theme--light .sendbird-icon-color--background-3 [class*='fill'] {
664
- fill: var(--sendbird-light-background-300); }
665
-
666
- .sendbird-theme--dark .sendbird-icon-color--background-3 [class*='fill'] {
667
- fill: var(--sendbird-dark-background-400); }
668
-
669
- .sendbird-theme--light .sendbird-icon-color--error [class*='fill'] {
670
- fill: var(--sendbird-light-error-300); }
671
-
672
- .sendbird-theme--dark .sendbird-icon-color--error [class*='fill'] {
673
- fill: var(--sendbird-dark-error-200); }
674
-
675
- .sendbird-avatar {
676
- display: inline-block;
677
- overflow: hidden;
678
- border-radius: 50%;
679
- position: relative; }
680
- .sendbird-avatar:focus {
681
- outline: none; }
682
- .sendbird-avatar .sendbird-avatar-img {
683
- position: absolute;
684
- top: 50%;
685
- left: 50%;
686
- transform: translate(-50%, -50%);
687
- display: flex;
688
- justify-content: center;
689
- align-items: center; }
690
- .sendbird-theme--light .sendbird-avatar .sendbird-avatar-img {
691
- background-color: var(--sendbird-light-background-300); }
692
- .sendbird-theme--dark .sendbird-avatar .sendbird-avatar-img {
693
- background-color: var(--sendbird-dark-background-300); }
694
- .sendbird-avatar .sendbird-avatar--inner__two-child .sendbird-avatar-img:first-child {
695
- transform: translate(2%, -50%); }
696
- .sendbird-avatar .sendbird-avatar--inner__two-child .sendbird-avatar-img:last-child {
697
- transform: translate(-102%, -50%); }
698
- .sendbird-avatar .sendbird-avatar--inner__three-child--upper .sendbird-avatar-img:first-child {
699
- transform: translate(-50%, -102%); }
700
- .sendbird-avatar .sendbird-avatar--inner__three-child--lower .sendbird-avatar-img:first-child {
701
- transform: translate(-77%, -23%) scale(0.5); }
702
- .sendbird-avatar .sendbird-avatar--inner__three-child--lower .sendbird-avatar-img:last-child {
703
- transform: translate(-23%, -23%) scale(0.5); }
704
- .sendbird-avatar .sendbird-avatar--inner__four-child .sendbird-avatar-img:first-child {
705
- transform: translate(-77%, -77%) scale(0.5); }
706
- .sendbird-avatar .sendbird-avatar--inner__four-child .sendbird-avatar-img:nth-child(2) {
707
- transform: translate(-23%, -77%) scale(0.5); }
708
- .sendbird-avatar .sendbird-avatar--inner__four-child .sendbird-avatar-img:nth-child(3) {
709
- transform: translate(-77%, -23%) scale(0.5); }
710
- .sendbird-avatar .sendbird-avatar--inner__four-child .sendbird-avatar-img:last-child {
711
- transform: translate(-23%, -23%) scale(0.5); }
712
- .sendbird-avatar .sendbird-avatar-img--default {
713
- display: flex;
714
- justify-content: center;
715
- align-items: center; }
716
- .sendbird-theme--light .sendbird-avatar .sendbird-avatar-img--default {
717
- background-color: var(--sendbird-light-background-300); }
718
- .sendbird-theme--dark .sendbird-avatar .sendbird-avatar-img--default {
719
- background-color: var(--sendbird-dark-background-300); }
720
-
721
- .sendbird-add-channel__rectangle-wrap {
722
- margin-top: 26px; }
723
-
724
- .sendbird-add-channel__rectangle-footer {
725
- text-align: right;
726
- margin-top: 32px; }
727
-
728
- .sendbird-add-channel__rectangle {
729
- width: 432px;
730
- height: 72px;
731
- border-radius: 4px;
732
- margin-bottom: 8px;
733
- padding: 25px 72px;
734
- position: relative;
735
- box-sizing: border-box;
736
- cursor: pointer; }
737
- .sendbird-theme--light .sendbird-add-channel__rectangle {
738
- border: 1px solid var(--sendbird-light-onlight-04); }
739
- .sendbird-theme--dark .sendbird-add-channel__rectangle {
740
- border: 1px solid var(--sendbird-dark-ondark-04); }
741
- .sendbird-add-channel__rectangle .sendbird-icon {
742
- position: absolute;
743
- left: 22px;
744
- top: 24px; }
745
-
746
-
747
- .sendbird-create-channel--content {
748
- width: 480px;
749
- max-height: 552px; }
750
-
751
- .sendbird-create-channel--scroll {
752
- height: 360px;
753
- overflow-y: auto; }
754
-
755
- .sendbird-modal {
756
- position: fixed;
757
- top: 0;
758
- left: 0;
759
- width: 100%;
760
- height: 100%;
761
- display: flex;
762
- align-items: center;
763
- justify-content: center; }
764
-
765
- .sendbird-modal__content {
766
- width: 480px;
767
- border-radius: 4px;
768
- z-index: 10001;
769
- padding: 18px 24px 24px 24px;
770
- position: relative;
771
- box-sizing: border-box; }
772
- .sendbird-theme--light .sendbird-modal__content {
773
- background-color: var(--sendbird-light-background-50);
774
- box-shadow: var(--sendbird-light-shadow-04); }
775
- .sendbird-theme--dark .sendbird-modal__content {
776
- background-color: var(--sendbird-dark-background-500);
777
- box-shadow: var(--sendbird-dark-shadow-04); }
778
- .sendbird-modal__content .sendbird-modal__close {
779
- position: absolute;
780
- top: 16px;
781
- right: 16px;
782
- cursor: pointer; }
783
- .sendbird-theme--light .sendbird-modal__content .sendbird-modal__close path {
784
- fill: var(--sendbird-light-onlight-01); }
785
- .sendbird-theme--dark .sendbird-modal__content .sendbird-modal__close path {
786
- fill: var(--sendbird-dark-ondark-01); }
787
- .sendbird-modal__content .sendbird-modal__header {
788
- margin-bottom: 16px; }
789
- .sendbird-modal__content .sendbird-modal__body {
790
- height: calc(100% - 116px); }
791
- .sendbird-modal__content .sendbird-modal__footer {
792
- margin-top: 32px;
793
- text-align: right; }
794
- .sendbird-modal__content .sendbird-modal__footer .sendbird-button:last-child {
795
- margin-left: 8px;
796
- width: 80px;
797
- height: 40px; }
798
-
799
- .sendbird-modal__backdrop {
800
- position: fixed;
801
- z-index: 10000;
802
- height: 100%;
803
- width: 100%;
804
- top: 0;
805
- left: 0; }
806
- .sendbird-theme--light .sendbird-modal__backdrop {
807
- background-color: var(--sendbird-light-overlay-02); }
808
- .sendbird-theme--dark .sendbird-modal__backdrop {
809
- background-color: var(--sendbird-dark-overlay-02); }
810
-
811
- .sendbird-button {
812
- display: inline-block;
813
- box-shadow: none;
814
- border-radius: 4px;
815
- padding: 0px;
816
- font-family: var(--sendbird-font-family-default);
817
- cursor: pointer; }
818
- .sendbird-button:hover {
819
- box-shadow: none; }
820
- .sendbird-button:focus {
821
- outline: none; }
822
- .sendbird-button:active {
823
- box-shadow: none; }
824
- .sendbird-button.sendbird-button__disabled {
825
- cursor: not-allowed; }
826
- .sendbird-theme--light .sendbird-button.sendbird-button__disabled {
827
- border: none;
828
- background-color: var(--sendbird-light-background-200); }
829
- .sendbird-theme--dark .sendbird-button.sendbird-button__disabled {
830
- border: none;
831
- background-color: var(--sendbird-dark-background-400); }
832
- .sendbird-theme--light .sendbird-button.sendbird-button__disabled:hover {
833
- background-color: var(--sendbird-light-background-200); }
834
- .sendbird-theme--dark .sendbird-button.sendbird-button__disabled:hover {
835
- background-color: var(--sendbird-dark-background-400); }
836
-
837
- .sendbird-button--big {
838
- height: 40px; }
839
- .sendbird-button--big .sendbird-button__text {
840
- margin: 10px 16px; }
841
-
842
- .sendbird-button--small {
843
- height: 32px; }
844
- .sendbird-button--small .sendbird-button__text {
845
- margin: 6px 16px; }
846
-
847
- .sendbird-theme--light .sendbird-button--primary {
848
- border: 1px solid var(--sendbird-light-primary-300);
849
- background-color: var(--sendbird-light-primary-300); }
850
-
851
- .sendbird-theme--dark .sendbird-button--primary {
852
- border: 1px solid var(--sendbird-dark-primary-200);
853
- background-color: var(--sendbird-dark-primary-200); }
854
-
855
- .sendbird-theme--light .sendbird-button--primary .sendbird-button__text {
856
- color: var(--sendbird-light-ondark-01); }
857
-
858
- .sendbird-theme--dark .sendbird-button--primary .sendbird-button__text {
859
- color: var(--sendbird-dark-onlight-01); }
860
-
861
- .sendbird-theme--light .sendbird-button--primary:hover {
862
- background-color: var(--sendbird-light-primary-400);
863
- border-color: var(--sendbird-light-primary-400); }
864
-
865
- .sendbird-theme--dark .sendbird-button--primary:hover {
866
- background-color: var(--sendbird-dark-primary-300);
867
- border-color: var(--sendbird-dark-primary-300); }
868
-
869
- .sendbird-theme--light .sendbird-button--primary:focus {
870
- box-shadow: 0px 0px 0px 2px var(--sendbird-light-primary-300);
871
- border: 1px solid var(--sendbird-button-border-focus); }
872
-
873
- .sendbird-theme--dark .sendbird-button--primary:focus {
874
- box-shadow: 0px 0px 0px 2px var(--sendbird-dark-primary-200);
875
- border: 1px solid var(--sendbird-button-border-focus); }
876
-
877
- .sendbird-theme--light .sendbird-button--primary:active {
878
- background-color: var(--sendbird-light-primary-500); }
879
-
880
- .sendbird-theme--dark .sendbird-button--primary:active {
881
- background-color: var(--sendbird-dark-primary-400); }
882
-
883
- .sendbird-theme--light .sendbird-button--primary:focus .sendbird-button--primary:hover {
884
- box-shadow: 0px 0px 0px 2px var(--sendbird-light-primary-400); }
885
-
886
- .sendbird-theme--dark .sendbird-button--primary:focus .sendbird-button--primary:hover {
887
- box-shadow: 0px 0px 0px 2px var(--sendbird-dark-primary-300); }
888
-
889
- .sendbird-theme--light .sendbird-button--primary:focus .sendbird-button--primary:active {
890
- box-shadow: 0px 0px 0px 2px var(--sendbird-light-primary-500); }
891
-
892
- .sendbird-theme--dark .sendbird-button--primary:focus .sendbird-button--primary:active {
893
- box-shadow: 0px 0px 0px 2px var(--sendbird-dark-primary-400); }
894
-
895
- .sendbird-button--secondary {
896
- background-color: transparent; }
897
- .sendbird-theme--light .sendbird-button--secondary {
898
- border: 1px solid var(--sendbird-light-onlight-03); }
899
- .sendbird-theme--dark .sendbird-button--secondary {
900
- border: 1px solid var(--sendbird-dark-ondark-03); }
901
- .sendbird-theme--light .sendbird-button--secondary .sendbird-button__text {
902
- color: var(--sendbird-light-onlight-01); }
903
- .sendbird-theme--dark .sendbird-button--secondary .sendbird-button__text {
904
- color: var(--sendbird-dark-ondark-01); }
905
- .sendbird-button--secondary:hover {
906
- background-color: transparent; }
907
- .sendbird-theme--light .sendbird-button--secondary:hover {
908
- border: 1px solid var(--sendbird-light-primary-300); }
909
- .sendbird-theme--dark .sendbird-button--secondary:hover {
910
- border: 1px solid var(--sendbird-dark-primary-200); }
911
- .sendbird-theme--light .sendbird-button--secondary:hover .sendbird-button__text {
912
- color: var(--sendbird-light-primary-300); }
913
- .sendbird-theme--dark .sendbird-button--secondary:hover .sendbird-button__text {
914
- color: var(--sendbird-dark-primary-200); }
915
- .sendbird-button--secondary.sendbird-button__disabled {
916
- cursor: not-allowed;
917
- border: none; }
918
- .sendbird-theme--light .sendbird-button--secondary.sendbird-button__disabled {
919
- background-color: var(--sendbird-light-background-200); }
920
- .sendbird-theme--dark .sendbird-button--secondary.sendbird-button__disabled {
921
- background-color: var(--sendbird-dark-background-400); }
922
- .sendbird-theme--light .sendbird-button--secondary.sendbird-button__disabled .sendbird-button__text {
923
- color: var(--sendbird-light-onlight-02); }
924
- .sendbird-theme--dark .sendbird-button--secondary.sendbird-button__disabled .sendbird-button__text {
925
- color: var(--sendbird-dark-ondark-02); }
926
- .sendbird-button--secondary.sendbird-button__disabled:hover {
927
- border: none; }
928
- .sendbird-theme--light .sendbird-button--secondary.sendbird-button__disabled:hover {
929
- background-color: var(--sendbird-light-background-200); }
930
- .sendbird-theme--dark .sendbird-button--secondary.sendbird-button__disabled:hover {
931
- background-color: var(--sendbird-dark-background-400); }
932
- .sendbird-theme--light .sendbird-button--secondary.sendbird-button__disabled:hover .sendbird-button__text {
933
- color: var(--sendbird-light-onlight-02); }
934
- .sendbird-theme--dark .sendbird-button--secondary.sendbird-button__disabled:hover .sendbird-button__text {
935
- color: var(--sendbird-dark-ondark-02); }
936
- .sendbird-theme--light .sendbird-button--secondary:hover .sendbird-button--secondary:focus .sendbird-button__text {
937
- color: var(--sendbird-light-primary-300); }
938
- .sendbird-theme--dark .sendbird-button--secondary:hover .sendbird-button--secondary:focus .sendbird-button__text {
939
- color: var(--sendbird-dark-primary-200); }
940
- .sendbird-button--secondary:focus {
941
- border: 1px solid transparent;
942
- background-color: transparent; }
943
- .sendbird-theme--light .sendbird-button--secondary:focus {
944
- box-shadow: var(--sendbird-light-primary-300) 0px 0px 0px 2px; }
945
- .sendbird-theme--dark .sendbird-button--secondary:focus {
946
- box-shadow: var(--sendbird-dark-primary-200) 0px 0px 0px 2px; }
947
- .sendbird-theme--light .sendbird-button--secondary:focus .sendbird-button__text {
948
- color: var(--sendbird-light-onlight-01); }
949
- .sendbird-theme--dark .sendbird-button--secondary:focus .sendbird-button__text {
950
- color: var(--sendbird-dark-ondark-01); }
951
- .sendbird-button--secondary:active {
952
- box-shadow: none; }
953
- .sendbird-theme--light .sendbird-button--secondary:active {
954
- border: 1px solid var(--sendbird-light-primary-300); }
955
- .sendbird-theme--dark .sendbird-button--secondary:active {
956
- border: 1px solid var(--sendbird-dark-primary-200); }
957
- .sendbird-theme--light .sendbird-button--secondary:active .sendbird-button__text {
958
- color: var(--sendbird-light-primary-300); }
959
- .sendbird-theme--dark .sendbird-button--secondary:active .sendbird-button__text {
960
- color: var(--sendbird-dark-primary-200); }
961
-
962
- .sendbird-theme--light .sendbird-button--danger {
963
- border: 1px solid var(--sendbird-light-error-300);
964
- background-color: var(--sendbird-light-error-300); }
965
-
966
- .sendbird-theme--dark .sendbird-button--danger {
967
- border: 1px solid var(--sendbird-dark-error-200);
968
- background-color: var(--sendbird-dark-error-200); }
969
-
970
- .sendbird-theme--light .sendbird-button--danger .sendbird-button__text {
971
- color: var(--sendbird-light-ondark-01); }
972
-
973
- .sendbird-theme--dark .sendbird-button--danger .sendbird-button__text {
974
- color: var(--sendbird-dark-onlight-01); }
975
-
976
- .sendbird-theme--light .sendbird-button--danger:hover {
977
- background-color: var(--sendbird-light-error-400);
978
- border-color: var(--sendbird-light-error-400); }
979
-
980
- .sendbird-theme--dark .sendbird-button--danger:hover {
981
- background-color: var(--sendbird-dark-error-400);
982
- border-color: var(--sendbird-dark-error-400); }
983
-
984
- .sendbird-theme--light .sendbird-button--danger:focus {
985
- box-shadow: 0px 0px 0px 2px var(--sendbird-light-error-300);
986
- border-color: var(--sendbird-button-border-focus); }
987
-
988
- .sendbird-theme--dark .sendbird-button--danger:focus {
989
- box-shadow: 0px 0px 0px 2px var(--sendbird-dark-error-300);
990
- border-color: var(--sendbird-button-border-focus); }
991
-
992
- .sendbird-button--danger:active {
993
- box-shadow: none; }
994
- .sendbird-theme--light .sendbird-button--danger:active {
995
- background-color: var(--sendbird-light-error-500); }
996
- .sendbird-theme--dark .sendbird-button--danger:active {
997
- background-color: var(--sendbird-dark-error-500); }
998
-
999
- .sendbird-theme--light .sendbird-button--danger:hover .sendbird-button--danger:focus {
1000
- box-shadow: 0px 0px 0px 2px var(--sendbird-light-error-400); }
1001
-
1002
- .sendbird-theme--dark .sendbird-button--danger:hover .sendbird-button--danger:focus {
1003
- box-shadow: 0px 0px 0px 2px var(--sendbird-dark-error-400); }
1004
-
1005
- .sendbird-theme--light .sendbird-button--danger:active .sendbird-button--danger:focus {
1006
- box-shadow: 0px 0px 0px 2px var(--sendbird-light-error-500); }
1007
-
1008
- .sendbird-theme--dark .sendbird-button--danger:active .sendbird-button--danger:focus {
1009
- box-shadow: 0px 0px 0px 2px var(--sendbird-dark-error-500); }
1010
-
1011
- .sendbird-button--disabled {
1012
- border: 1px solid transparent;
1013
- cursor: not-allowed; }
1014
- .sendbird-theme--light .sendbird-button--disabled {
1015
- background-color: var(--sendbird-light-background-200);
1016
- color: var(--sendbird-light-ondark-01); }
1017
- .sendbird-theme--dark .sendbird-button--disabled {
1018
- background-color: var(--sendbird-dark-background-400);
1019
- color: var(--sendbird-dark-onlight-01); }
1020
-
1021
- .sendbird-muted-avatar {
1022
- border-radius: 50%;
1023
- display: inline-block; }
1024
- .sendbird-muted-avatar .sendbird-muted-avatar__icon {
1025
- position: relative; }
1026
- .sendbird-muted-avatar .sendbird-muted-avatar__icon .sendbird-icon {
1027
- position: absolute;
1028
- top: 4px;
1029
- left: 4px; }
1030
- .sendbird-muted-avatar .sendbird-muted-avatar__bg {
1031
- opacity: .5;
1032
- position: absolute;
1033
- border-radius: 50%;
1034
- top: 0;
1035
- left: 0; }
1036
- .sendbird-theme--light .sendbird-muted-avatar .sendbird-muted-avatar__bg {
1037
- background-color: var(--sendbird-light-primary-400); }
1038
- .sendbird-theme--dark .sendbird-muted-avatar .sendbird-muted-avatar__bg {
1039
- background-color: var(--sendbird-dark-primary-300); }
1040
-
1041
- .sendbird-checkbox {
1042
- display: block;
1043
- position: relative;
1044
- padding-left: 35px;
1045
- margin-bottom: 12px;
1046
- cursor: pointer;
1047
- font-size: 22px;
1048
- -webkit-user-select: none;
1049
- -moz-user-select: none;
1050
- -ms-user-select: none;
1051
- user-select: none; }
1052
-
1053
- .sendbird-checkbox input {
1054
- position: absolute;
1055
- opacity: 0;
1056
- cursor: pointer;
1057
- height: 0;
1058
- width: 0; }
1059
-
1060
- .sendbird-checkbox--checkmark {
1061
- position: absolute;
1062
- top: 0;
1063
- left: 0;
1064
- height: 18px;
1065
- width: 18px;
1066
- border-radius: 2px;
1067
- background-color: inherit; }
1068
- .sendbird-theme--light .sendbird-checkbox--checkmark {
1069
- border: 2px solid var(--sendbird-light-background-400); }
1070
- .sendbird-theme--dark .sendbird-checkbox--checkmark {
1071
- border: 2px solid var(--sendbird-dark-background-300); }
1072
-
1073
- .sendbird-theme--light .sendbird-checkbox input:focus ~ .sendbird-checkbox--checkmark {
1074
- box-shadow: 0px 0px 0px 2px var(--sendbird-light-primary-300); }
1075
-
1076
- .sendbird-theme--dark .sendbird-checkbox input:focus ~ .sendbird-checkbox--checkmark {
1077
- box-shadow: 0px 0px 0px 2px var(--sendbird-dark-primary-200); }
1078
-
1079
- .sendbird-theme--light .sendbird-checkbox input:checked ~ .sendbird-checkbox--checkmark {
1080
- background-color: var(--sendbird-light-primary-300);
1081
- border: 2px solid var(--sendbird-light-primary-300); }
1082
-
1083
- .sendbird-theme--dark .sendbird-checkbox input:checked ~ .sendbird-checkbox--checkmark {
1084
- background-color: var(--sendbird-dark-primary-200);
1085
- border: 2px solid var(--sendbird-dark-primary-200); }
1086
-
1087
- .sendbird-checkbox--checkmark:after {
1088
- content: "";
1089
- position: absolute;
1090
- display: none; }
1091
-
1092
- .sendbird-checkbox input:checked ~ .sendbird-checkbox--checkmark:after {
1093
- display: block; }
1094
-
1095
- .sendbird-theme--light .sendbird-checkbox .sendbird-checkbox--checkmark:after {
1096
- left: 5px;
1097
- top: -0.5px;
1098
- width: 7px;
1099
- height: 12px;
1100
- border: solid var(--sendbird-light-background-50);
1101
- border-width: 0 2px 2px 0;
1102
- transform: rotate(45deg); }
1103
-
1104
- .sendbird-theme--dark .sendbird-checkbox .sendbird-checkbox--checkmark:after {
1105
- left: 5px;
1106
- top: -0.5px;
1107
- width: 7px;
1108
- height: 12px;
1109
- border: solid var(--sendbird-dark-background-600);
1110
- border-width: 0 2px 2px 0;
1111
- transform: rotate(45deg); }
1112
-
1113
- .sendbird__user-profile {
1114
- width: 320px;
1115
- border-radius: 4px;
1116
- padding: 24px;
1117
- box-sizing: border-box;
1118
- text-align: center; }
1119
- .sendbird-theme--light .sendbird__user-profile {
1120
- box-shadow: var(--sendbird-light-shadow-02);
1121
- background-color: var(--sendbird-light-background-50); }
1122
- .sendbird-theme--dark .sendbird__user-profile {
1123
- box-shadow: var(--sendbird-dark-shadow-02);
1124
- background-color: var(--sendbird-dark-background-500); }
1125
- .sendbird__user-profile .sendbird__user-profile-avatar {
1126
- margin: 8px 0px; }
1127
- .sendbird__user-profile .sendbird__user-profile-name {
1128
- max-width: 270px;
1129
- white-space: nowrap;
1130
- overflow-x: hidden;
1131
- text-overflow: ellipsis; }
1132
- .sendbird__user-profile .sendbird__user-profile-message {
1133
- margin-top: 20px; }
1134
- .sendbird__user-profile .sendbird__user-profile-message button {
1135
- width: 272px; }
1136
- .sendbird__user-profile .sendbird__user-profile-separator {
1137
- margin: 24px 0px;
1138
- height: 1px; }
1139
- .sendbird-theme--light .sendbird__user-profile .sendbird__user-profile-separator {
1140
- background-color: var(--sendbird-light-onlight-04); }
1141
- .sendbird-theme--dark .sendbird__user-profile .sendbird__user-profile-separator {
1142
- background-color: var(--sendbird-dark-ondark-04); }
1143
- .sendbird__user-profile .sendbird__user-profile-userId--label,
1144
- .sendbird__user-profile .sendbird__user-profile-userId--value {
1145
- display: block;
1146
- text-align: left; }
1147
- .sendbird__user-profile .sendbird__user-profile-userId--label {
1148
- margin-bottom: 8px; }
1149
-
1150
- .sendbird__offline .sendbird-dropdown__menu .sendbird-dropdown__menu-item {
1151
- cursor: not-allowed; }
1152
-
1153
- .sendbird-dropdown__menu {
1154
- z-index: 99999;
1155
- position: absolute;
1156
- top: 100%;
1157
- left: 0;
1158
- min-width: 140px;
1159
- margin: 0px;
1160
- padding: 8px 0px;
1161
- border-radius: 4px;
1162
- list-style: none; }
1163
- .sendbird-theme--light .sendbird-dropdown__menu {
1164
- box-shadow: var(--sendbird-light-shadow-02);
1165
- background-color: var(--sendbird-light-background-50); }
1166
- .sendbird-theme--dark .sendbird-dropdown__menu {
1167
- box-shadow: var(--sendbird-dark-shadow-02);
1168
- background-color: var(--sendbird-dark-background-500); }
1169
- .sendbird-dropdown__menu .sendbird-dropdown__menu-item {
1170
- cursor: pointer;
1171
- white-space: nowrap;
1172
- padding: 8px 16px; }
1173
- .sendbird-dropdown__menu .sendbird-dropdown__menu-item.disable {
1174
- cursor: not-allowed; }
1175
- .sendbird-theme--light .sendbird-dropdown__menu .sendbird-dropdown__menu-item.disable:hover {
1176
- background-color: var(--sendbird-light-background-50); }
1177
- .sendbird-theme--dark .sendbird-dropdown__menu .sendbird-dropdown__menu-item.disable:hover {
1178
- background-color: var(--sendbird-dark-background-500); }
1179
- .sendbird-theme--light .sendbird-dropdown__menu .sendbird-dropdown__menu-item:hover {
1180
- background-color: var(--sendbird-light-background-100); }
1181
- .sendbird-theme--dark .sendbird-dropdown__menu .sendbird-dropdown__menu-item:hover {
1182
- background-color: var(--sendbird-dark-background-400); }
1183
-
1184
- .sendbird-dropdown__reaction-bar {
1185
- position: absolute;
1186
- top: 100%;
1187
- left: 0;
1188
- min-width: 44px;
1189
- max-width: 352px;
1190
- max-height: 208px;
1191
- overflow-y: scroll;
1192
- margin: 0px;
1193
- padding: 8px;
1194
- border-radius: 8px;
1195
- list-style: none; }
1196
- .sendbird-theme--light .sendbird-dropdown__reaction-bar {
1197
- box-shadow: var(--sendbird-light-shadow-02);
1198
- background-color: var(--sendbird-light-background-50); }
1199
- .sendbird-theme--dark .sendbird-dropdown__reaction-bar {
1200
- box-shadow: var(--sendbird-dark-shadow-02);
1201
- background-color: var(--sendbird-dark-background-500); }
1202
- .sendbird-dropdown__reaction-bar .sendbird-dropdown__reaction-bar__row .sendbird-reaction-button, .sendbird-dropdown__reaction-bar .sendbird-dropdown__reaction-bar__row .sendbird-reaction-button--selected {
1203
- margin: 4px; }
1204
-
1205
- .sendbird-dropdown__menu-backdrop {
1206
- background-color: transparent;
1207
- position: fixed;
1208
- top: 0;
1209
- left: 0;
1210
- width: 100%;
1211
- height: 100%; }
1212
-
1213
- .sendbird-reactions--pressed {
1214
- display: block !important; }
1215
-
1216
- .sendbird-icon--pressed {
1217
- display: block !important; }
1218
-
1219
- .sendbird-sort-by-row {
1220
- display: flex;
1221
- justify-content: flex-start;
1222
- align-items: center; }
1223
-
1224
- .sendbird-user-list-item {
1225
- display: block;
1226
- position: relative;
1227
- box-sizing: border-box;
1228
- width: 432px;
1229
- height: 56px; }
1230
- .sendbird-theme--light .sendbird-user-list-item {
1231
- border-bottom: 1px solid var(--sendbird-light-onlight-04);
1232
- background-color: var(--sendbird-light-background-50); }
1233
- .sendbird-theme--dark .sendbird-user-list-item {
1234
- border-bottom: 1px solid var(--sendbird-dark-ondark-04);
1235
- background-color: var(--sendbird-dark-background-500); }
1236
- .sendbird-user-list-item__avatar {
1237
- position: absolute;
1238
- top: 8px;
1239
- left: 0px;
1240
- z-index: 1;
1241
- cursor: pointer; }
1242
- .sendbird-user-list-item .sendbird-muted-avatar {
1243
- position: absolute;
1244
- top: 8px;
1245
- left: 0px;
1246
- z-index: 2;
1247
- pointer-events: none; }
1248
- .sendbird-user-list-item__title {
1249
- position: absolute;
1250
- top: 17px;
1251
- left: 56px;
1252
- max-width: 280px;
1253
- white-space: nowrap;
1254
- overflow: hidden;
1255
- text-overflow: ellipsis; }
1256
- .sendbird-user-list-item__subtitle {
1257
- position: absolute;
1258
- top: 23px;
1259
- left: 140px;
1260
- max-width: 237px;
1261
- white-space: nowrap;
1262
- overflow: hidden;
1263
- text-overflow: ellipsis; }
1264
- .sendbird-user-list-item__checkbox {
1265
- position: absolute;
1266
- top: 16px;
1267
- right: 16px; }
1268
- .sendbird-user-list-item__action {
1269
- position: absolute;
1270
- right: 0;
1271
- top: 10px; }
1272
- .sendbird-user-list-item__operator {
1273
- position: absolute;
1274
- right: 40px;
1275
- top: 22px; }
1276
-
1277
- .sendbird__offline .sendbird-channel-preview {
1278
- cursor: not-allowed; }
1279
-
1280
- .sendbird-channel-preview {
1281
- position: relative;
1282
- cursor: pointer;
1283
- box-sizing: border-box;
1284
- width: 320px;
1285
- height: 80px;
1286
- display: flex;
1287
- flex-direction: row;
1288
- align-items: center;
1289
- justify-content: center;
1290
- padding: 12px 16px 12px 16px; }
1291
- .sendbird-theme--light .sendbird-channel-preview {
1292
- border-bottom: solid 1px var(--sendbird-light-onlight-04); }
1293
- .sendbird-theme--dark .sendbird-channel-preview {
1294
- border-bottom: solid 1px var(--sendbird-dark-ondark-04); }
1295
- .sendbird-channel-preview:focus {
1296
- outline: none; }
1297
- .sendbird-channel-preview .sendbird-channel-preview__avatar {
1298
- width: 56px;
1299
- height: 56px; }
1300
- .sendbird-channel-preview .sendbird-channel-preview__content {
1301
- width: 100%;
1302
- height: 100%;
1303
- margin-left: 16px; }
1304
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper {
1305
- display: flex;
1306
- justify-content: space-between;
1307
- width: 216px;
1308
- height: 16px; }
1309
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__header {
1310
- display: flex;
1311
- justify-content: flex-start;
1312
- overflow: hidden;
1313
- text-overflow: ellipsis; }
1314
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__header .sendbird-channel-preview__content__upper__header__broadcast-icon {
1315
- padding-right: 4px; }
1316
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__header .sendbird-channel-preview__content__upper__header__channel-name {
1317
- overflow: hidden;
1318
- text-overflow: ellipsis;
1319
- max-width: 128px;
1320
- word-break: break-all;
1321
- white-space: nowrap; }
1322
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__header .sendbird-channel-preview__content__upper__header__total-members {
1323
- margin-top: 2px;
1324
- margin-left: 4px; }
1325
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__header .sendbird-channel-preview__content__upper__header__frozen-icon {
1326
- padding-left: 4px; }
1327
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__last-message-at {
1328
- margin-left: 4px;
1329
- margin-bottom: 4px;
1330
- white-space: nowrap; }
1331
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__upper .sendbird-channel-preview__content__upper__last-message-at.sendbird-message-status {
1332
- max-width: 74px;
1333
- justify-content: flex-end; }
1334
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__lower {
1335
- margin-top: 8px;
1336
- width: 216px;
1337
- height: 32px;
1338
- display: flex;
1339
- justify-content: space-between; }
1340
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__lower .sendbird-channel-preview__content__lower__last-message {
1341
- overflow: hidden;
1342
- text-overflow: ellipsis; }
1343
- .sendbird-channel-preview .sendbird-channel-preview__content .sendbird-channel-preview__content__lower .sendbird-channel-preview__content__lower__unread-message-count {
1344
- display: flex;
1345
- align-items: center;
1346
- margin-left: 8px;
1347
- margin-bottom: 12px; }
1348
- .sendbird-channel-preview .sendbird-channel-preview__action {
1349
- position: absolute;
1350
- top: 12px;
1351
- right: 12px;
1352
- display: inline-block; }
1353
- .sendbird-channel-preview .sendbird-channel-preview__action .sendbird-iconbutton {
1354
- display: none; }
1355
- .sendbird-theme--light .sendbird-channel-preview:hover {
1356
- background-color: var(--sendbird-light-background-100); }
1357
- .sendbird-theme--dark .sendbird-channel-preview:hover {
1358
- background-color: var(--sendbird-dark-background-500); }
1359
- .sendbird-channel-preview:hover .sendbird-channel-preview__action .sendbird-iconbutton {
1360
- display: inline-block; }
1361
- .sendbird-channel-preview:hover .sendbird-channel-preview__content__upper__last-message-at {
1362
- display: none; }
1363
- .sendbird-channel-preview:hover .sendbird-channel-preview__content__lower__unread-message-count {
1364
- display: none; }
1365
-
1366
- .sendbird-channel-preview--active {
1367
- padding: 12px 16px 12px 12px; }
1368
- .sendbird-theme--light .sendbird-channel-preview--active {
1369
- border-left: solid 4px var(--sendbird-light-primary-300);
1370
- border-bottom: solid 1px var(--sendbird-light-onlight-04);
1371
- background-color: var(--sendbird-light-primary-100); }
1372
- .sendbird-theme--dark .sendbird-channel-preview--active {
1373
- border-left: solid 4px var(--sendbird-dark-primary-200);
1374
- border-bottom: solid 1px var(--sendbird-dark-ondark-04);
1375
- background-color: var(--sendbird-dark-background-700); }
1376
- .sendbird-theme--light .sendbird-channel-preview--active .sendbird-channel-preview__content__upper__header__channel-name {
1377
- color: var(--sendbird-light-primary-300); }
1378
- .sendbird-theme--dark .sendbird-channel-preview--active .sendbird-channel-preview__content__upper__header__channel-name {
1379
- color: var(--sendbird-dark-primary-200); }
1380
-
1381
- .sendbird-chat-header--default-avatar {
1382
- width: 56px;
1383
- height: 56px;
1384
- display: flex;
1385
- justify-content: center;
1386
- align-items: center;
1387
- border-radius: 50%; }
1388
- .sendbird-theme--light .sendbird-chat-header--default-avatar {
1389
- background-color: var(--sendbird-light-secondary-300); }
1390
- .sendbird-theme--dark .sendbird-chat-header--default-avatar {
1391
- background-color: var(--sendbird-dark-secondary-200); }
1392
-
1393
- .sendbird-badge {
1394
- height: 20px;
1395
- min-width: 20px;
1396
- border-radius: 10px;
1397
- display: inline-block; }
1398
- .sendbird-theme--light .sendbird-badge {
1399
- background-color: var(--sendbird-light-primary-300); }
1400
- .sendbird-theme--dark .sendbird-badge {
1401
- background-color: var(--sendbird-dark-primary-200); }
1402
- .sendbird-badge .sendbird-badge__text {
1403
- margin: 0px 6px; }
1404
-
1405
- .sendbird-mention-user-label {
1406
- display: inline-block;
1407
- font-family: var(--sendbird-font-family-default);
1408
- font-size: 14px;
1409
- font-weight: bold;
1410
- font-stretch: normal;
1411
- font-style: normal;
1412
- line-height: 1.43;
1413
- letter-spacing: normal; }
1414
- .sendbird-mention-user-label:hover {
1415
- cursor: pointer; }
1416
- .sendbird-theme--light .sendbird-mention-user-label {
1417
- color: var(--sendbird-light-onlight-01); }
1418
- .sendbird-theme--dark .sendbird-mention-user-label {
1419
- color: var(--sendbird-dark-ondark-01); }
1420
- .sendbird-theme--light .sendbird-mention-user-label.reverse {
1421
- color: var(--sendbird-light-ondark-01); }
1422
- .sendbird-theme--dark .sendbird-mention-user-label.reverse {
1423
- color: var(--sendbird-dark-onlight-01); }
1424
- .sendbird-mention-user-label.purple {
1425
- font-family: Roboto;
1426
- font-size: 18px;
1427
- font-weight: bold;
1428
- font-stretch: normal;
1429
- font-style: normal;
1430
- line-height: normal;
1431
- letter-spacing: normal; }
1432
- .sendbird-theme--light .sendbird-mention-user-label.purple {
1433
- color: var(--sendbird-light-primary-300); }
1434
- .sendbird-theme--dark .sendbird-mention-user-label.purple {
1435
- color: var(--sendbird-dark-primary-200); }
1436
-
1437
- .sendbird-reaction-button {
1438
- border-radius: 8px;
1439
- display: inline-block;
1440
- border: solid 1px transparent;
1441
- cursor: pointer; }
1442
- .sendbird-theme--light .sendbird-reaction-button:hover {
1443
- border: solid 1px var(--sendbird-light-background-100);
1444
- background-color: var(--sendbird-light-background-100); }
1445
- .sendbird-theme--dark .sendbird-reaction-button:hover {
1446
- border: solid 1px var(--sendbird-dark-background-400);
1447
- background-color: var(--sendbird-dark-background-400); }
1448
- .sendbird-reaction-button__inner {
1449
- margin: 3px; }
1450
-
1451
- .sendbird-reaction-button--selected {
1452
- cursor: pointer;
1453
- border-radius: 8px;
1454
- display: inline-block; }
1455
- .sendbird-theme--light .sendbird-reaction-button--selected {
1456
- border: solid 1px var(--sendbird-light-primary-100);
1457
- background-color: var(--sendbird-light-primary-100); }
1458
- .sendbird-theme--dark .sendbird-reaction-button--selected {
1459
- border: solid 1px var(--sendbird-dark-primary-400);
1460
- background-color: var(--sendbird-dark-primary-400); }
1461
- .sendbird-reaction-button--selected:hover {
1462
- border: solid 1px var(--sendbird-selected-reaction-button-border-hover); }
1463
- .sendbird-reaction-button--selected__inner {
1464
- margin: 3px; }
1465
- .sendbird-reaction-button--selected.sendbird-reactions--pressed {
1466
- display: block !important; }
1467
-
1468
- .sendbird-message-status {
1469
- position: relative;
1470
- display: inline-flex;
1471
- align-items: flex-start;
1472
- width: 100%;
1473
- height: 100%; }
1474
- .sendbird-message-status .sendbird-message-status__icon {
1475
- position: relative;
1476
- display: inline-block;
1477
- top: -2px; }
1478
- .sendbird-message-status .sendbird-message-status__icon.hide-icon {
1479
- display: none; }
1480
- .sendbird-message-status .sendbird-message-status__text {
1481
- position: relative;
1482
- display: inline-block;
1483
- margin-left: 4px; }
1484
- .sendbird-message-status .sendbird-message-status__text .sendbird-message-status__text__try-again {
1485
- text-decoration: underline; }
1486
- .sendbird-message-status .sendbird-message-status__text .sendbird-message-status__text__try-again:hover {
1487
- cursor: pointer; }
1488
- .sendbird-message-status .sendbird-message-status__text .sendbird-message-status__text__delete {
1489
- text-decoration: underline; }
1490
- .sendbird-message-status .sendbird-message-status__text .sendbird-message-status__text__delete:hover {
1491
- cursor: pointer; }
1492
-
1493
- .sendbird-loader {
1494
- display: inline-block;
1495
- -webkit-animation: 1s infinite linear;
1496
- animation: 1s infinite linear;
1497
- -webkit-animation-name: rotate;
1498
- animation-name: rotate; }
1499
-
1500
- @-webkit-keyframes rotate {
1501
- from {
1502
- transform: rotate(0); }
1503
- to {
1504
- transform: rotate(360deg); } }
1505
-
1506
- @keyframes rotate {
1507
- from {
1508
- transform: rotate(0); }
1509
- to {
1510
- transform: rotate(360deg); } }
1511
-
1512
- .sendbird-edit-user-profile section {
1513
- margin-top: 16px; }
1514
- .sendbird-edit-user-profile section .sendbird-input-label {
1515
- display: block;
1516
- margin-bottom: 12px; }
1517
-
1518
- .sendbird-edit-user-profile .sendbird-edit-user-profile__img .sendbird-input-label {
1519
- margin-bottom: 12px; }
1520
-
1521
- .sendbird-edit-user-profile__img {
1522
- position: relative; }
1523
-
1524
- .sendbird-edit-user-profile__img__avatar-button {
1525
- position: absolute;
1526
- top: 50px;
1527
- left: 96px; }
1528
-
1529
- .sendbird-edit-user-profile__theme__theme-icon .sendbird-icon {
1530
- cursor: pointer; }
1531
-
1532
- .sendbird-input {
1533
- display: inline-block;
1534
- width: 100%;
1535
- height: 40px;
1536
- position: relative; }
1537
- .sendbird-input .sendbird-input__input {
1538
- width: 100%;
1539
- height: 100%;
1540
- border-radius: 4px;
1541
- font-family: var(--sendbird-font-family-default);
1542
- font-size: 14px;
1543
- font-weight: normal;
1544
- font-stretch: normal;
1545
- font-style: normal;
1546
- line-height: 1.43;
1547
- letter-spacing: normal;
1548
- padding: 10px 16px;
1549
- box-sizing: border-box;
1550
- background-color: inherit; }
1551
- .sendbird-theme--light .sendbird-input .sendbird-input__input {
1552
- color: var(--sendbird-light-onlight-01);
1553
- caret-color: var(--sendbird-light-primary-300);
1554
- border: solid 1px var(--sendbird-light-onlight-03); }
1555
- .sendbird-theme--dark .sendbird-input .sendbird-input__input {
1556
- color: var(--sendbird-dark-ondark-01);
1557
- caret-color: var(--sendbird-dark-primary-200);
1558
- border: solid 1px var(--sendbird-dark-ondark-03); }
1559
- .sendbird-input .sendbird-input__input:focus {
1560
- outline: none; }
1561
- .sendbird-theme--light .sendbird-input .sendbird-input__input:focus {
1562
- box-shadow: 0 1px 5px 0 var(--sendbird-light-onlight-04), 0 0 1px 0 rgba(0, 0, 0, 0.16), 0 2px 1px 0 rgba(0, 0, 0, 0.08);
1563
- color: var(--sendbird-light-onlight-01);
1564
- border: solid 2px var(--sendbird-light-primary-300); }
1565
- .sendbird-theme--dark .sendbird-input .sendbird-input__input:focus {
1566
- box-shadow: 0 1px 5px 0 var(--sendbird-dark-ondark-04), 0 0 1px 0 rgba(0, 0, 0, 0.16), 0 2px 1px 0 rgba(0, 0, 0, 0.08);
1567
- color: var(--sendbird-dark-ondark-01);
1568
- border: solid 2px var(--sendbird-dark-primary-200); }
1569
- .sendbird-theme--light .sendbird-input .sendbird-input__input:active {
1570
- box-shadow: 0 1px 5px 0 var(--sendbird-light-onlight-04), 0 0 1px 0 rgba(0, 0, 0, 0.16), 0 2px 1px 0 rgba(0, 0, 0, 0.08);
1571
- color: var(--sendbird-light-onlight-01);
1572
- border: solid 1px var(--sendbird-light-primary-300); }
1573
- .sendbird-theme--dark .sendbird-input .sendbird-input__input:active {
1574
- box-shadow: 0 1px 5px 0 var(--sendbird-dark-ondark-04), 0 0 1px 0 rgba(0, 0, 0, 0.16), 0 2px 1px 0 rgba(0, 0, 0, 0.08);
1575
- color: var(--sendbird-dark-ondark-01);
1576
- border: solid 1px var(--sendbird-dark-primary-200); }
1577
- .sendbird-input .sendbird-input__input:disabled {
1578
- cursor: not-allowed; }
1579
- .sendbird-theme--light .sendbird-input .sendbird-input__input:disabled {
1580
- background-color: var(--sendbird-light-background-100);
1581
- color: var(--sendbird-light-onlight-03); }
1582
- .sendbird-theme--dark .sendbird-input .sendbird-input__input:disabled {
1583
- background-color: var(--sendbird-dark-background-500);
1584
- color: var(--sendbird-dark-ondark-03); }
1585
- .sendbird-input .sendbird-input__placeholder {
1586
- position: absolute;
1587
- pointer-events: none;
1588
- top: 10px;
1589
- left: 16px;
1590
- font-family: var(--sendbird-font-family-default);
1591
- font-size: 14px;
1592
- line-height: 1.43; }
1593
- .sendbird-theme--light .sendbird-input .sendbird-input__placeholder {
1594
- color: var(--sendbird-light-onlight-03); }
1595
- .sendbird-theme--dark .sendbird-input .sendbird-input__placeholder {
1596
- color: var(--sendbird-dark-ondark-03); }
1597
-
1598
- .sendbird-input-label {
1599
- margin: 4px 0; }
1600
-
1601
- .sendbird-textbutton {
1602
- text-decoration: underline;
1603
- cursor: pointer;
1604
- display: inline-block; }
1605
-
1606
- .sendbird-textbutton--not-underline {
1607
- text-decoration: none;
1608
- cursor: pointer; }
1609
-
1610
- .sendbird-textbutton--disabled {
1611
- cursor: not-allowed; }
1612
- .sendbird-theme--light .sendbird-textbutton--disabled {
1613
- color: var(--sendbird-light-onlight-03); }
1614
- .sendbird-theme--dark .sendbird-textbutton--disabled {
1615
- color: var(--sendbird-dark-ondark-03); }
1616
-
1617
- .sendbird-theme--light .sendbird-color--onbackground-1 {
1618
- color: var(--sendbird-light-onlight-01); }
1619
-
1620
- .sendbird-theme--dark .sendbird-color--onbackground-1 {
1621
- color: var(--sendbird-dark-ondark-01); }
1622
-
1623
- .sendbird-theme--light .sendbird-color--onbackground-1--background-color {
1624
- background-color: var(--sendbird-light-onlight-01); }
1625
-
1626
- .sendbird-theme--dark .sendbird-color--onbackground-1--background-color {
1627
- background-color: var(--sendbird-dark-ondark-01); }
1628
-
1629
- .sendbird-theme--light .sendbird-color--onbackground-2 {
1630
- color: var(--sendbird-light-onlight-02); }
1631
-
1632
- .sendbird-theme--dark .sendbird-color--onbackground-2 {
1633
- color: var(--sendbird-dark-ondark-02); }
1634
-
1635
- .sendbird-theme--light .sendbird-color--onbackground-2--background-color {
1636
- background-color: var(--sendbird-light-onlight-02); }
1637
-
1638
- .sendbird-theme--dark .sendbird-color--onbackground-2--background-color {
1639
- background-color: var(--sendbird-dark-ondark-02); }
1640
-
1641
- .sendbird-theme--light .sendbird-color--onbackground-3 {
1642
- color: var(--sendbird-light-onlight-03); }
1643
-
1644
- .sendbird-theme--dark .sendbird-color--onbackground-3 {
1645
- color: var(--sendbird-dark-ondark-03); }
1646
-
1647
- .sendbird-theme--light .sendbird-color--onbackground-3--background-color {
1648
- background-color: var(--sendbird-light-onlight-03); }
1649
-
1650
- .sendbird-theme--dark .sendbird-color--onbackground-3--background-color {
1651
- background-color: var(--sendbird-dark-ondark-03); }
1652
-
1653
- .sendbird-theme--light .sendbird-color--onbackground-4 {
1654
- color: var(--sendbird-light-onlight-04); }
1655
-
1656
- .sendbird-theme--dark .sendbird-color--onbackground-4 {
1657
- color: var(--sendbird-dark-ondark-04); }
1658
-
1659
- .sendbird-theme--light .sendbird-color--onbackground-4--background-color {
1660
- background-color: var(--sendbird-light-onlight-04); }
1661
-
1662
- .sendbird-theme--dark .sendbird-color--onbackground-4--background-color {
1663
- background-color: var(--sendbird-dark-ondark-04); }
1664
-
1665
- .sendbird-theme--light .sendbird-color--oncontent-1 {
1666
- color: var(--sendbird-light-ondark-01); }
1667
-
1668
- .sendbird-theme--dark .sendbird-color--oncontent-1 {
1669
- color: var(--sendbird-dark-onlight-01); }
1670
-
1671
- .sendbird-theme--light .sendbird-color--oncontent-1--background-color {
1672
- background-color: var(--sendbird-light-ondark-01); }
1673
-
1674
- .sendbird-theme--dark .sendbird-color--oncontent-1--background-color {
1675
- background-color: var(--sendbird-dark-onlight-01); }
1676
-
1677
- .sendbird-theme--light .sendbird-color--primary {
1678
- color: var(--sendbird-light-primary-300); }
1679
-
1680
- .sendbird-theme--dark .sendbird-color--primary {
1681
- color: var(--sendbird-dark-primary-200); }
1682
-
1683
- .sendbird-theme--light .sendbird-color--primary--background-color {
1684
- background-color: var(--sendbird-light-primary-300); }
1685
-
1686
- .sendbird-theme--dark .sendbird-color--primary--background-color {
1687
- background-color: var(--sendbird-dark-primary-200); }
1688
-
1689
- .sendbird-theme--light .sendbird-color--error {
1690
- color: var(--sendbird-light-error-300); }
1691
-
1692
- .sendbird-theme--dark .sendbird-color--error {
1693
- color: var(--sendbird-dark-error-200); }
1694
-
1695
- .sendbird-theme--light .sendbird-color--error--background-color {
1696
- background-color: var(--sendbird-light-error-300); }
1697
-
1698
- .sendbird-theme--dark .sendbird-color--error--background-color {
1699
- background-color: var(--sendbird-dark-error-300); }
1700
-
1701
- .sendbird-place-holder {
1702
- position: relative;
1703
- display: flex;
1704
- justify-content: center;
1705
- align-items: center;
1706
- width: 100%;
1707
- height: 100%; }
1708
- .sendbird-place-holder .sendbird-place-holder__body {
1709
- display: flex;
1710
- flex-direction: column;
1711
- height: 104px;
1712
- align-items: center; }
1713
- .sendbird-place-holder .sendbird-place-holder__body .sendbird-place-holder__body__icon {
1714
- margin-bottom: 10px; }
1715
- .sendbird-place-holder .sendbird-place-holder__body .sendbird-place-holder__body__text {
1716
- margin-top: 10px; }
1717
- .sendbird-place-holder .sendbird-place-holder__body__reconnect {
1718
- margin-top: 18px;
1719
- display: flex;
1720
- flex-direction: row;
1721
- cursor: pointer; }
1722
- .sendbird-place-holder .sendbird-place-holder__body__reconnect .sendbird-place-holder__body__reconnect__icon {
1723
- margin-right: 4px; }
1724
- .sendbird-place-holder .sendbird-place-holder__body--align-top {
1725
- position: absolute;
1726
- top: 24px;
1727
- display: flex;
1728
- width: 100%;
1729
- flex-direction: column;
1730
- justify-content: center; }
1731
- .sendbird-place-holder .sendbird-place-holder__body--align-top .sendbird-place-holder__body--align-top__text {
1732
- display: flex;
1733
- flex-direction: row;
1734
- justify-content: center;
1735
- padding-left: 16px;
1736
- padding-right: 16px; }
1737
- .sendbird-place-holder .sendbird-place-holder__body--align-top .sendbird-place-holder__body--align-top__text .sendbird-place-holder__body--align-top__text__search-in {
1738
- display: flex;
1739
- min-width: 60px;
1740
- margin-right: 2px; }
1741
- .sendbird-place-holder .sendbird-place-holder__body--align-top .sendbird-place-holder__body--align-top__text .sendbird-place-holder__body--align-top__text__channel-name {
1742
- display: block;
1743
- max-width: calc(100% - 62px);
1744
- white-space: nowrap;
1745
- overflow: hidden;
1746
- text-overflow: ellipsis; }
1747
- .sendbird-place-holder .sendbird-place-holder__body--align-top .sendbird-place-hlder__body--align-top__searching,
1748
- .sendbird-place-holder .sendbird-place-holder__body--align-top .sendbird-place-hlder__body--align-top__no-result {
1749
- display: flex;
1750
- justify-content: center; }
1751
-
1752
- .sendbird-conversation {
1753
- display: flex;
1754
- flex-direction: column;
1755
- width: 100%;
1756
- height: 100%;
1757
- box-sizing: border-box; }
1758
- .sendbird-theme--light .sendbird-conversation {
1759
- background-color: var(--sendbird-light-background-50);
1760
- border: 1px solid var(--sendbird-light-onlight-04); }
1761
- .sendbird-theme--dark .sendbird-conversation {
1762
- background-color: var(--sendbird-dark-background-600);
1763
- border: 1px solid var(--sendbird-dark-ondark-04); }
1764
-
1765
- .sendbird-conversation__messages {
1766
- overflow-y: auto;
1767
- flex: 1 1 0;
1768
- order: 2; }
1769
-
1770
- .sendbird-conversation__messages-list {
1771
- display: flex;
1772
- flex-direction: column;
1773
- height: 100%;
1774
- justify-content: flex-end; }
1775
-
1776
- .sendbird-conversation__footer {
1777
- width: 100%;
1778
- order: 3;
1779
- padding: 0px 0px 24px 0px; }
1780
-
1781
- @-webkit-keyframes sbHighlight {
1782
- 0% {
1783
- background-color: #FFF2B6; }
1784
- 99% {
1785
- background-color: #FFF2B6; } }
1786
-
1787
- @keyframes sbHighlight {
1788
- 0% {
1789
- background-color: #FFF2B6; }
1790
- 99% {
1791
- background-color: #FFF2B6; } }
1792
-
1793
- @-webkit-keyframes sbTextHighlight {
1794
- 0% {
1795
- color: var(--sendbird-dark-onlight-01); }
1796
- 99% {
1797
- color: var(--sendbird-dark-onlight-01); } }
1798
-
1799
- @keyframes sbTextHighlight {
1800
- 0% {
1801
- color: var(--sendbird-dark-onlight-01); }
1802
- 99% {
1803
- color: var(--sendbird-dark-onlight-01); } }
1804
-
1805
- @-webkit-keyframes sbHighlightBlock {
1806
- 0% {
1807
- opacity: 0.5;
1808
- background-color: #FFF2B6; }
1809
- 99% {
1810
- opacity: 0.5;
1811
- background-color: #FFF2B6; } }
1812
-
1813
- @keyframes sbHighlightBlock {
1814
- 0% {
1815
- opacity: 0.5;
1816
- background-color: #FFF2B6; }
1817
- 99% {
1818
- opacity: 0.5;
1819
- background-color: #FFF2B6; } }
1820
-
1821
- .sendbird-msg-hoc__animated .sendbird-message-content {
1822
- -webkit-animation: bounce 1s ease;
1823
- animation: bounce 1s ease; }
1824
-
1825
- @-webkit-keyframes bounce {
1826
- 50% {
1827
- transform: translateY(-10px); }
1828
- 60% {
1829
- transform: translateY(0); }
1830
- 90% {
1831
- transform: translateY(-10px); }
1832
- 100% {
1833
- transform: translateY(0); } }
1834
-
1835
- @keyframes bounce {
1836
- 50% {
1837
- transform: translateY(-10px); }
1838
- 60% {
1839
- transform: translateY(0); }
1840
- 90% {
1841
- transform: translateY(-10px); }
1842
- 100% {
1843
- transform: translateY(0); } }
1844
-
1845
- .sendbird-msg-hoc__highlighted .sendbird-text-message-item-body,
1846
- .sendbird-msg-hoc__highlighted .sendbird-file-message-item-body {
1847
- -webkit-animation-name: sbHighlight;
1848
- animation-name: sbHighlight;
1849
- -webkit-animation-duration: 1.6s;
1850
- animation-duration: 1.6s;
1851
- -webkit-animation-fill-mode: forwards;
1852
- animation-fill-mode: forwards; }
1853
-
1854
- .sendbird-msg-hoc__highlighted .sendbird-text-message-item-body__message,
1855
- .sendbird-msg-hoc__highlighted .sendbird-file-message-item-body__file-name__text {
1856
- -webkit-animation-name: sbTextHighlight;
1857
- animation-name: sbTextHighlight;
1858
- -webkit-animation-duration: 1.6s;
1859
- animation-duration: 1.6s;
1860
- -webkit-animation-fill-mode: forwards;
1861
- animation-fill-mode: forwards; }
1862
-
1863
- .sendbird-msg-hoc__highlighted .sendbird-thumbnail-message-item-body
1864
- .sendbird-thumbnail-message-item-body__image-cover {
1865
- display: block;
1866
- -webkit-animation-name: sbHighlightBlock;
1867
- animation-name: sbHighlightBlock;
1868
- -webkit-animation-duration: 1.6s;
1869
- animation-duration: 1.6s;
1870
- -webkit-animation-fill-mode: forwards;
1871
- animation-fill-mode: forwards; }
1872
-
1873
- .sendbird-msg-hoc__highlighted .sendbird-og-message-item-body
1874
- .sendbird-og-message-item-body__cover {
1875
- display: block;
1876
- -webkit-animation-name: sbHighlightBlock;
1877
- animation-name: sbHighlightBlock;
1878
- -webkit-animation-duration: 1.6s;
1879
- animation-duration: 1.6s;
1880
- -webkit-animation-fill-mode: forwards;
1881
- animation-fill-mode: forwards; }
1882
-
1883
- .sendbird-msg-hoc__highlighted .sendbird-message-content-reactions {
1884
- -webkit-animation-name: sbHighlight;
1885
- animation-name: sbHighlight;
1886
- -webkit-animation-duration: 1.6s;
1887
- animation-duration: 1.6s;
1888
- -webkit-animation-fill-mode: forwards;
1889
- animation-fill-mode: forwards; }
1890
-
1891
- .sendbird-conversation__scroll-container {
1892
- display: flex;
1893
- height: 100%;
1894
- overflow-y: auto;
1895
- overflow-x: hidden;
1896
- flex-direction: column; }
1897
- .sendbird-conversation__scroll-container .sendbird-conversation__padding {
1898
- flex: 1 1 0; }
1899
-
1900
- .sendbird-conversation__footer {
1901
- position: relative;
1902
- box-sizing: border-box;
1903
- margin-top: 6px; }
1904
- .sendbird-conversation__footer .sendbird-conversation__footer__typing-indicator {
1905
- position: absolute;
1906
- display: inline-flex;
1907
- bottom: 8px; }
1908
- .sendbird-conversation__footer .sendbird-conversation__footer__typing-indicator .sendbird-conversation__footer__typing-indicator__text {
1909
- margin-left: 24px;
1910
- margin-right: 10px; }
1911
-
1912
- .sendbird-connection-status {
1913
- display: flex;
1914
- align-items: center;
1915
- padding-top: 5px; }
1916
-
1917
- .sendbird-chat-header {
1918
- position: relative;
1919
- display: flex;
1920
- flex-direction: row;
1921
- justify-content: space-between;
1922
- align-items: center;
1923
- height: 64px;
1924
- min-height: 64px;
1925
- padding-left: 20px;
1926
- padding-right: 16px;
1927
- overflow: hidden;
1928
- text-overflow: ellipsis;
1929
- box-sizing: border-box; }
1930
- .sendbird-theme--light .sendbird-chat-header {
1931
- border-bottom: 1px solid var(--sendbird-light-onlight-04);
1932
- background-color: var(--sendbird-light-background-50); }
1933
- .sendbird-theme--dark .sendbird-chat-header {
1934
- border-bottom: 1px solid var(--sendbird-dark-ondark-04);
1935
- background-color: var(--sendbird-dark-background-600); }
1936
- .sendbird-chat-header__left {
1937
- margin-right: 24px; }
1938
- .sendbird-chat-header__left, .sendbird-chat-header__right {
1939
- overflow: hidden;
1940
- display: flex;
1941
- flex-direction: row;
1942
- align-items: center; }
1943
- .sendbird-chat-header .sendbird-chat-header__left__title {
1944
- margin-left: 8px;
1945
- margin-right: 16px;
1946
- overflow: hidden;
1947
- text-overflow: ellipsis;
1948
- white-space: nowrap;
1949
- max-width: 780px; }
1950
- .sendbird-chat-header .sendbird-chat-header__left__subtitle {
1951
- max-width: 240px;
1952
- overflow: hidden;
1953
- text-overflow: ellipsis; }
1954
- .sendbird-chat-header .sendbird-chat-header__right__mute {
1955
- margin-right: 26px; }
1956
- .sendbird-chat-header .sendbird-iconbutton--pressed {
1957
- background-color: inherit; }
1958
- .sendbird-chat-header .sendbird-chat-header__right__info {
1959
- margin-left: 16px; }
1960
-
1961
- .sendbird-conversation__messages .sendbird-conversation__messages-padding {
1962
- padding-left: 24px;
1963
- padding-right: 24px;
1964
- height: 100%;
1965
- overflow: scroll; }
1966
-
1967
- .sendbird-conversation__messages .sendbird-separator,
1968
- .sendbird-conversation__messages .sendbird-admin-message {
1969
- padding-top: 8px;
1970
- padding-bottom: 8px; }
1971
-
1972
- .sendbird-conversation__scroll-bottom-button {
1973
- position: -webkit-sticky;
1974
- position: sticky;
1975
- display: flex;
1976
- align-items: center;
1977
- justify-content: center;
1978
- bottom: 30px;
1979
- left: calc(100% - 65px);
1980
- width: 40px;
1981
- height: 40px;
1982
- border-radius: 24px;
1983
- z-index: 1; }
1984
- .sendbird-theme--light .sendbird-conversation__scroll-bottom-button {
1985
- background-color: var(--sendbird-light-background-50);
1986
- box-shadow: var(--sendbird-light-shadow-05); }
1987
- .sendbird-theme--dark .sendbird-conversation__scroll-bottom-button {
1988
- background-color: var(--sendbird-dark-background-400);
1989
- box-shadow: var(--sendbird-dark-shadow-05); }
1990
- .sendbird-conversation__scroll-bottom-button:hover {
1991
- cursor: pointer; }
1992
- .sendbird-theme--light .sendbird-conversation__scroll-bottom-button:hover {
1993
- background-color: var(--sendbird-light-background-100); }
1994
- .sendbird-theme--dark .sendbird-conversation__scroll-bottom-button:hover {
1995
- background-color: var(--sendbird-dark-background-500); }
1996
- .sendbird-theme--light .sendbird-conversation__scroll-bottom-button:active {
1997
- background-color: var(--sendbird-light-background-200); }
1998
- .sendbird-theme--dark .sendbird-conversation__scroll-bottom-button:active {
1999
- background-color: var(--sendbird-dark-background-700); }
2000
- .sendbird-conversation__scroll-bottom-button:focus {
2001
- outline: none; }
2002
-
2003
- .sendbird-mention-suggest-list {
2004
- position: relative;
2005
- display: flex;
2006
- flex-direction: column;
2007
- width: calc(100% - 56px);
2008
- max-height: 260px;
2009
- overflow: scroll;
2010
- margin-left: 28px;
2011
- margin-right: 28px; }
2012
- .sendbird-theme--light .sendbird-mention-suggest-list {
2013
- border: 1px solid var(--sendbird-light-background-100); }
2014
- .sendbird-theme--dark .sendbird-mention-suggest-list {
2015
- border: 1px solid var(--sendbird-dark-background-500); }
2016
- .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item {
2017
- position: relative;
2018
- display: flex;
2019
- align-items: center;
2020
- padding: 16px 8px; }
2021
- .sendbird-theme--light .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item {
2022
- background-color: var(--sendbird-light-background-50); }
2023
- .sendbird-theme--dark .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item {
2024
- background-color: var(--sendbird-dark-background-600); }
2025
- .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item:hover {
2026
- cursor: pointer; }
2027
- .sendbird-theme--light .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item:hover {
2028
- background-color: var(--sendbird-light-background-100); }
2029
- .sendbird-theme--dark .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item:hover {
2030
- background-color: var(--sendbird-dark-background-500); }
2031
- .sendbird-theme--light .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item.focused {
2032
- background-color: var(--sendbird-light-background-100); }
2033
- .sendbird-theme--dark .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item.focused {
2034
- background-color: var(--sendbird-dark-background-500); }
2035
- .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item .sendbird-mention-suggest-list__user-item__avatar {
2036
- position: relative;
2037
- display: inline-block; }
2038
- .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item .sendbird-mention-suggest-list__user-item__nickname {
2039
- position: relative;
2040
- display: inline-block;
2041
- margin-left: 16px; }
2042
- .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item .sendbird-mention-suggest-list__user-item__user-id {
2043
- position: absolute;
2044
- display: inline-block;
2045
- right: 16px; }
2046
- .sendbird-mention-suggest-list .sendbird-mention-suggest-list__notice-item {
2047
- position: relative;
2048
- display: flex;
2049
- align-items: center;
2050
- padding: 16px 8px; }
2051
- .sendbird-theme--light .sendbird-mention-suggest-list .sendbird-mention-suggest-list__notice-item {
2052
- background-color: var(--sendbird-light-background-50); }
2053
- .sendbird-theme--dark .sendbird-mention-suggest-list .sendbird-mention-suggest-list__notice-item {
2054
- background-color: var(--sendbird-dark-background-600); }
2055
- .sendbird-mention-suggest-list .sendbird-mention-suggest-list__notice-item .sendbird-mention-suggest-list__notice-item__icon {
2056
- margin-right: 4px; }
2057
-
2058
- .sendbird-separator {
2059
- width: 100%;
2060
- display: flex;
2061
- align-items: center; }
2062
- .sendbird-separator .sendbird-separator__left {
2063
- border: none;
2064
- height: 1px;
2065
- display: inline-block;
2066
- width: 100%; }
2067
- .sendbird-separator .sendbird-separator__right {
2068
- border: none;
2069
- height: 1px;
2070
- display: inline-block;
2071
- width: 100%; }
2072
- .sendbird-separator .sendbird-separator__text {
2073
- margin: 0px 16px;
2074
- display: flex;
2075
- white-space: nowrap; }
2076
-
2077
- .sendbird-message-input {
2078
- display: inline-block;
2079
- width: 100%;
2080
- position: relative; }
2081
- .sendbird-message-input .sendbird-message-input--textarea {
2082
- width: 100%;
2083
- border-radius: 4px;
2084
- font-size: 14px;
2085
- font-weight: normal;
2086
- font-stretch: normal;
2087
- font-style: normal;
2088
- line-height: 1.43;
2089
- height: 56px;
2090
- overflow-y: hidden;
2091
- letter-spacing: normal;
2092
- padding: 18px 64px 18px 16px;
2093
- box-sizing: border-box;
2094
- resize: none;
2095
- font-family: var(--sendbird-font-family-default);
2096
- background-color: inherit;
2097
- white-space: pre-wrap; }
2098
- .sendbird-theme--light .sendbird-message-input .sendbird-message-input--textarea {
2099
- color: var(--sendbird-light-onlight-01);
2100
- caret-color: var(--sendbird-light-primary-300);
2101
- border: solid 1px var(--sendbird-light-onlight-03);
2102
- background-color: var(--sendbird-light-background-50); }
2103
- .sendbird-theme--dark .sendbird-message-input .sendbird-message-input--textarea {
2104
- color: var(--sendbird-dark-ondark-01);
2105
- caret-color: var(--sendbird-dark-primary-200);
2106
- border: solid 1px var(--sendbird-dark-ondark-03);
2107
- background-color: var(--sendbird-dark-background-500); }
2108
- .sendbird-message-input .sendbird-message-input--textarea:focus {
2109
- outline: none; }
2110
- .sendbird-theme--light .sendbird-message-input .sendbird-message-input--textarea:focus {
2111
- color: var(--sendbird-light-onlight-01);
2112
- border: solid 1px var(--sendbird-light-primary-300);
2113
- box-shadow: var(--sendbird-light-shadow-message-input); }
2114
- .sendbird-theme--dark .sendbird-message-input .sendbird-message-input--textarea:focus {
2115
- color: var(--sendbird-dark-ondark-01);
2116
- border: solid 1px var(--sendbird-dark-primary-200);
2117
- box-shadow: var(--sendbird-dark-shadow-message-input); }
2118
- .sendbird-theme--light .sendbird-message-input .sendbird-message-input--textarea:active {
2119
- border: solid 1px var(--sendbird-message-input-border-active);
2120
- color: var(--sendbird-light-onlight-01); }
2121
- .sendbird-theme--dark .sendbird-message-input .sendbird-message-input--textarea:active {
2122
- border: solid 1px var(--sendbird-message-input-border-active);
2123
- color: var(--sendbird-dark-ondark-01); }
2124
- .sendbird-message-input .sendbird-message-input--placeholder {
2125
- position: absolute;
2126
- pointer-events: none;
2127
- top: 18px;
2128
- left: 16px;
2129
- font-family: var(--sendbird-font-family-default);
2130
- font-size: 14px;
2131
- line-height: 1.43; }
2132
- .sendbird-theme--light .sendbird-message-input .sendbird-message-input--placeholder {
2133
- color: var(--sendbird-light-onlight-03); }
2134
- .sendbird-theme--dark .sendbird-message-input .sendbird-message-input--placeholder {
2135
- color: var(--sendbird-dark-ondark-03); }
2136
- .sendbird-message-input .sendbird-message-input--attach {
2137
- position: absolute;
2138
- right: 12px;
2139
- bottom: 18px;
2140
- padding: 6px; }
2141
- .sendbird-message-input .sendbird-message-input--send {
2142
- position: absolute;
2143
- padding: 6px;
2144
- right: 16px;
2145
- bottom: 16px; }
2146
- .sendbird-message-input .sendbird-message-input--attach-input {
2147
- display: none; }
2148
-
2149
- .sendbird-message-input__edit {
2150
- padding: 16px;
2151
- box-sizing: border-box; }
2152
- .sendbird-theme--light .sendbird-message-input__edit {
2153
- background-color: var(--sendbird-light-primary-100); }
2154
- .sendbird-theme--dark .sendbird-message-input__edit {
2155
- background-color: var(--sendbird-dark-background-700); }
2156
-
2157
- .sendbird-message-input--edit-action {
2158
- text-align: right;
2159
- margin-top: 4px; }
2160
- .sendbird-message-input--edit-action button:last-child {
2161
- margin-left: 8px; }
2162
- .sendbird-message-input--edit-action .sendbird-message-input--edit-action__cancel {
2163
- width: 80px; }
2164
- .sendbird-theme--light .sendbird-message-input--edit-action .sendbird-message-input--edit-action__cancel {
2165
- border: solid 1px var(--sendbird-light-onlight-03); }
2166
- .sendbird-theme--dark .sendbird-message-input--edit-action .sendbird-message-input--edit-action__cancel {
2167
- border: solid 1px var(--sendbird-dark-ondark-03); }
2168
- .sendbird-message-input--edit-action .sendbird-message-input--edit-action__save {
2169
- width: 80px; }
2170
-
2171
- .sendbird-message-input-form__disabled {
2172
- cursor: not-allowed; }
2173
-
2174
- .sendbird-message-input__disabled {
2175
- pointer-events: none;
2176
- cursor: disabled; }
2177
- .sendbird-theme--light .sendbird-message-input__disabled .sendbird-message-input--textarea {
2178
- background-color: var(--sendbird-light-background-100); }
2179
- .sendbird-theme--dark .sendbird-message-input__disabled .sendbird-message-input--textarea {
2180
- background-color: var(--sendbird-dark-background-500); }
2181
- .sendbird-theme--light .sendbird-message-input__disabled svg {
2182
- fill: var(--sendbird-light-onlight-03); }
2183
- .sendbird-theme--dark .sendbird-message-input__disabled svg {
2184
- fill: var(--sendbird-dark-ondark-03); }
2185
-
2186
- .sendbird-message-content {
2187
- position: relative;
2188
- display: inline-flex;
2189
- flex-direction: row;
2190
- width: 100%;
2191
- height: 100%; }
2192
- .sendbird-message-content.incoming {
2193
- justify-content: flex-start; }
2194
- .sendbird-message-content.outgoing {
2195
- justify-content: flex-end; }
2196
- .sendbird-message-content .sendbird-message-content__middle .sendbird-message-content__middle__quote-message.use-quote {
2197
- margin-top: -8px;
2198
- bottom: -8px; }
2199
-
2200
- .sendbird-message-content.incoming .sendbird-message-content__left {
2201
- position: relative;
2202
- display: inline-flex;
2203
- min-width: 40px; }
2204
- .sendbird-message-content.incoming .sendbird-message-content__left .sendbird-message-content__left__avatar {
2205
- position: absolute;
2206
- left: 0px;
2207
- bottom: 2px; }
2208
-
2209
- .sendbird-message-content.incoming .sendbird-message-content__middle {
2210
- position: relative;
2211
- display: inline-flex;
2212
- flex-direction: column;
2213
- max-width: 400px;
2214
- align-items: flex-start; }
2215
- .sendbird-message-content.incoming .sendbird-message-content__middle .sendbird-message-content__middle__body-container .sendbird-message-content__middle__body-container__created-at {
2216
- position: absolute;
2217
- bottom: 6px;
2218
- right: -84px;
2219
- white-space: nowrap;
2220
- display: flex;
2221
- flex-direction: row;
2222
- min-width: 80px; }
2223
- .sendbird-message-content.incoming .sendbird-message-content__middle .sendbird-message-content__middle__body-container .sendbird-message-content__middle__body-container__created-at.supposed-hover {
2224
- display: none; }
2225
- .sendbird-message-content.incoming .sendbird-message-content__middle .sendbird-message-content__middle__sender-name {
2226
- position: relative;
2227
- margin-left: 12px;
2228
- margin-bottom: 4px; }
2229
- .sendbird-message-content.incoming .sendbird-message-content__middle .sendbird-message-content__middle__quote-message {
2230
- position: relative;
2231
- width: 100%;
2232
- display: inline-flex; }
2233
- .sendbird-message-content.incoming .sendbird-message-content__middle .sendbird-message-content__middle__quote-message.outgoing {
2234
- justify-content: flex-end; }
2235
- .sendbird-message-content.incoming .sendbird-message-content__middle .sendbird-message-content__middle__quote-message.incoming {
2236
- justify-content: flex-start; }
2237
-
2238
- .sendbird-message-content.incoming .sendbird-message-content__right {
2239
- position: relative;
2240
- display: inline-flex;
2241
- width: 50px;
2242
- margin-left: 4px;
2243
- padding-top: 18px; }
2244
- .sendbird-message-content.incoming .sendbird-message-content__right.use-reactions {
2245
- width: 70px; }
2246
- .sendbird-message-content.incoming .sendbird-message-content__right.chain-top {
2247
- padding-top: 2px; }
2248
- .sendbird-message-content.incoming .sendbird-message-content__right.chain-top.use-quote {
2249
- padding-top: 18px; }
2250
- .sendbird-message-content.incoming .sendbird-message-content__right .sendbird-message-content-menu {
2251
- position: relative;
2252
- flex-direction: row;
2253
- height: 32px;
2254
- display: none; }
2255
- .sendbird-message-content.incoming .sendbird-message-content__right .sendbird-message-content-menu.supposed-hover {
2256
- display: inline-flex; }
2257
-
2258
- .sendbird-message-content.incoming:hover .sendbird-message-content__right .sendbird-message-content-menu {
2259
- display: inline-flex; }
2260
-
2261
- .sendbird-message-content.incoming:hover .sendbird-message-content__middle .sendbird-message-content__middle__body-container .sendbird-message-content__middle__body-container__created-at {
2262
- display: none; }
2263
-
2264
- .sendbird-message-content.outgoing .sendbird-message-content__left {
2265
- position: relative;
2266
- box-sizing: border-box;
2267
- display: inline-flex;
2268
- justify-content: flex-end;
2269
- width: 50px; }
2270
- .sendbird-message-content.outgoing .sendbird-message-content__left.use-reactions {
2271
- width: 70px; }
2272
- .sendbird-message-content.outgoing .sendbird-message-content__left.use-quote .sendbird-message-content-menu {
2273
- top: 18px; }
2274
- .sendbird-message-content.outgoing .sendbird-message-content__left .sendbird-message-content-menu {
2275
- position: absolute;
2276
- top: 2px;
2277
- right: 4px;
2278
- flex-direction: row;
2279
- display: none; }
2280
- .sendbird-message-content.outgoing .sendbird-message-content__left .sendbird-message-content-menu.supposed-hover {
2281
- display: inline-flex; }
2282
-
2283
- .sendbird-message-content.outgoing .sendbird-message-content__middle {
2284
- position: relative;
2285
- display: inline-flex;
2286
- flex-direction: column;
2287
- max-width: 400px;
2288
- align-items: flex-end; }
2289
- .sendbird-message-content.outgoing .sendbird-message-content__middle .sendbird-message-content__middle__quote-message {
2290
- position: relative;
2291
- width: 100%;
2292
- display: inline-flex; }
2293
- .sendbird-message-content.outgoing .sendbird-message-content__middle .sendbird-message-content__middle__quote-message.outgoing {
2294
- justify-content: flex-end; }
2295
- .sendbird-message-content.outgoing .sendbird-message-content__middle .sendbird-message-content__middle__quote-message.incoming {
2296
- justify-content: flex-start; }
2297
- .sendbird-message-content.outgoing .sendbird-message-content__middle .sendbird-message-content__middle__body-container {
2298
- position: relative;
2299
- width: -webkit-fit-content;
2300
- width: -moz-fit-content;
2301
- width: fit-content; }
2302
- .sendbird-message-content.outgoing .sendbird-message-content__middle .sendbird-message-content__middle__body-container .sendbird-message-content__middle__body-container__created-at {
2303
- position: absolute;
2304
- bottom: 2px;
2305
- left: -84px;
2306
- white-space: nowrap;
2307
- display: flex;
2308
- justify-content: flex-end;
2309
- box-sizing: content-box;
2310
- min-width: 80px;
2311
- min-height: 16px; }
2312
- .sendbird-message-content.outgoing .sendbird-message-content__middle .sendbird-message-content__middle__body-container .sendbird-message-content__middle__body-container__created-at.supposed-hover {
2313
- display: none; }
2314
- .sendbird-message-content.outgoing .sendbird-message-content__middle .sendbird-message-content__middle__body-container .sendbird-message-content__middle__body-container__created-at .sendbird-message-content__middle__body-container__created-at__component-container {
2315
- position: relative;
2316
- display: inline-flex; }
2317
-
2318
- .sendbird-message-content.outgoing .sendbird-message-content__right {
2319
- display: none; }
2320
-
2321
- .sendbird-message-content.outgoing:hover .sendbird-message-content__left .sendbird-message-content-menu {
2322
- display: inline-flex; }
2323
-
2324
- .sendbird-message-content.outgoing:hover .sendbird-message-content__middle .sendbird-message-content__middle__body-container .sendbird-message-content__middle__body-container__created-at {
2325
- display: none; }
2326
-
2327
- .sendbird-message-content__middle__body-container {
2328
- position: relative;
2329
- width: -webkit-fit-content;
2330
- width: -moz-fit-content;
2331
- width: fit-content;
2332
- display: flex;
2333
- flex-direction: column; }
2334
- .sendbird-message-content__middle__body-container .sendbird-message-content__middle__message-item-body {
2335
- width: 100%;
2336
- box-sizing: border-box; }
2337
- .sendbird-message-content__middle__body-container .sendbird-message-content-reactions {
2338
- width: 100%; }
2339
-
2340
- .sendbird-message-content-reactions {
2341
- position: relative;
2342
- width: 100%;
2343
- border-radius: 0px 0px 16px 16px; }
2344
- .sendbird-theme--light .sendbird-message-content-reactions {
2345
- background-color: var(--sendbird-light-background-100); }
2346
- .sendbird-theme--dark .sendbird-message-content-reactions {
2347
- background-color: var(--sendbird-dark-background-500); }
2348
- .sendbird-theme--light .sendbird-message-content-reactions.primary {
2349
- background-color: var(--sendbird-light-primary-300); }
2350
- .sendbird-theme--dark .sendbird-message-content-reactions.primary {
2351
- background-color: var(--sendbird-dark-primary-200); }
2352
- .sendbird-theme--light .sendbird-message-content-reactions.mouse-hover, .sendbird-theme--light .sendbird-message-content-reactions:hover {
2353
- background-color: var(--sendbird-light-background-200); }
2354
- .sendbird-theme--dark .sendbird-message-content-reactions.mouse-hover, .sendbird-theme--dark .sendbird-message-content-reactions:hover {
2355
- background-color: var(--sendbird-dark-background-400); }
2356
- .sendbird-theme--light .sendbird-message-content-reactions.mouse-hover.primary, .sendbird-theme--light .sendbird-message-content-reactions:hover.primary {
2357
- background-color: var(--sendbird-light-primary-400); }
2358
- .sendbird-theme--dark .sendbird-message-content-reactions.mouse-hover.primary, .sendbird-theme--dark .sendbird-message-content-reactions:hover.primary {
2359
- background-color: var(--sendbird-dark-primary-300); }
2360
-
2361
- .sendbird-message-item-menu__list__menu-item:focus-visible {
2362
- outline: none; }
2363
-
2364
- .sendbird-text {
2365
- color: var(--primary-1); }
2366
-
2367
- .sendbird-emoji-reactions {
2368
- display: inline-flex;
2369
- flex-direction: row;
2370
- justify-content: flex-start;
2371
- border-radius: 16px;
2372
- box-sizing: border-box;
2373
- width: 100%;
2374
- max-width: var(--sendbird-message-balloon-width);
2375
- min-height: 24px;
2376
- padding: 7px 5px 3px 5px; }
2377
- .sendbird-theme--light .sendbird-emoji-reactions {
2378
- background-color: var(--sendbird-light-background-50);
2379
- border: 1px solid var(--sendbird-light-background-100); }
2380
- .sendbird-theme--dark .sendbird-emoji-reactions {
2381
- background-color: var(--sendbird-dark-background-600);
2382
- border: 1px solid var(--sendbird-dark-background-500); }
2383
- .sendbird-emoji-reactions .sendbird-emoji-reactions__reaction-badge {
2384
- display: inline-flex;
2385
- margin-left: 2px;
2386
- margin-right: 2px;
2387
- margin-bottom: 4px; }
2388
- .sendbird-emoji-reactions:focus {
2389
- outline: none; }
2390
-
2391
- .sendbird-emoji-reactions__add-reaction-badge {
2392
- display: inline-flex;
2393
- width: 36px;
2394
- height: 24px; }
2395
-
2396
- .sendbird-tooltip {
2397
- position: relative;
2398
- display: inline-flex;
2399
- justify-content: center;
2400
- max-width: 200px;
2401
- border-radius: 8px;
2402
- padding: 8px 16px; }
2403
- .sendbird-theme--light .sendbird-tooltip {
2404
- background-color: var(--sendbird-light-background-700); }
2405
- .sendbird-theme--dark .sendbird-tooltip {
2406
- background-color: var(--sendbird-dark-background-300); }
2407
- .sendbird-tooltip::after {
2408
- content: '';
2409
- position: absolute;
2410
- bottom: -4px;
2411
- width: 8px;
2412
- height: 8px;
2413
- transform: rotate(45deg); }
2414
- .sendbird-theme--light .sendbird-tooltip::after {
2415
- background-color: var(--sendbird-light-background-700); }
2416
- .sendbird-theme--dark .sendbird-tooltip::after {
2417
- background-color: var(--sendbird-dark-background-300); }
2418
- .sendbird-tooltip__text {
2419
- font-family: var(--sendbird-font-family-default);
2420
- font-size: 12px;
2421
- font-weight: bold;
2422
- font-stretch: normal;
2423
- font-style: normal;
2424
- line-height: 1.33;
2425
- letter-spacing: normal; }
2426
-
2427
- .sendbird-tooltip-wrapper {
2428
- position: relative;
2429
- display: inline-flex; }
2430
- .sendbird-tooltip-wrapper__hover-tooltip {
2431
- position: absolute;
2432
- display: inline-flex;
2433
- width: 200px; }
2434
- .sendbird-tooltip-wrapper__hover-tooltip__inner__tooltip-container {
2435
- position: relative;
2436
- display: inline-flex; }
2437
-
2438
- .sendbird-reaction-badge {
2439
- display: inline-block;
2440
- border-radius: 15px;
2441
- width: 50px;
2442
- height: 24px; }
2443
- .sendbird-theme--light .sendbird-reaction-badge {
2444
- background-color: var(--sendbird-light-background-100);
2445
- border: solid 1px var(--sendbird-light-background-100); }
2446
- .sendbird-theme--dark .sendbird-reaction-badge {
2447
- background-color: var(--sendbird-dark-background-500);
2448
- border: solid 1px var(--sendbird-dark-background-500); }
2449
- .sendbird-reaction-badge:hover {
2450
- cursor: pointer; }
2451
- .sendbird-theme--light .sendbird-reaction-badge:hover {
2452
- border: solid 1px var(--sendbird-light-primary-300); }
2453
- .sendbird-theme--dark .sendbird-reaction-badge:hover {
2454
- border: solid 1px var(--sendbird-dark-primary-200); }
2455
-
2456
- .sendbird-reaction-badge--is-add {
2457
- display: inline-block;
2458
- border-radius: 15px;
2459
- width: 36px;
2460
- height: 24px; }
2461
- .sendbird-theme--light .sendbird-reaction-badge--is-add {
2462
- background-color: var(--sendbird-light-background-100);
2463
- border: solid 1px var(--sendbird-light-background-100); }
2464
- .sendbird-theme--dark .sendbird-reaction-badge--is-add {
2465
- background-color: var(--sendbird-dark-background-500);
2466
- border: solid 1px var(--sendbird-dark-background-500); }
2467
- .sendbird-reaction-badge--is-add:hover {
2468
- cursor: pointer; }
2469
- .sendbird-theme--light .sendbird-reaction-badge--is-add:hover {
2470
- border: solid 1px var(--sendbird-light-primary-300); }
2471
- .sendbird-theme--dark .sendbird-reaction-badge--is-add:hover {
2472
- border: solid 1px var(--sendbird-dark-primary-200); }
2473
- .sendbird-reaction-badge--is-add .sendbird-reaction-badge__inner .sendbird-reaction-badge__inner__icon {
2474
- left: 8px; }
2475
-
2476
- .sendbird-reaction-badge--selected {
2477
- display: inline-block;
2478
- border-radius: 15px;
2479
- width: 50px;
2480
- height: 24px; }
2481
- .sendbird-theme--light .sendbird-reaction-badge--selected {
2482
- background-color: var(--sendbird-light-primary-100);
2483
- border: solid 1px var(--sendbird-light-primary-100); }
2484
- .sendbird-theme--dark .sendbird-reaction-badge--selected {
2485
- background-color: var(--sendbird-dark-primary-400);
2486
- border: solid 1px var(--sendbird-dark-primary-400); }
2487
- .sendbird-reaction-badge--selected:hover {
2488
- cursor: pointer; }
2489
- .sendbird-theme--light .sendbird-reaction-badge--selected:hover {
2490
- border: solid 1px var(--sendbird-light-primary-300); }
2491
- .sendbird-theme--dark .sendbird-reaction-badge--selected:hover {
2492
- border: solid 1px var(--sendbird-dark-primary-200); }
2493
-
2494
- .sendbird-reaction-badge__inner {
2495
- position: relative;
2496
- display: flex;
2497
- height: 24px;
2498
- flex-direction: row;
2499
- align-items: center;
2500
- justify-content: center;
2501
- padding-left: 20px;
2502
- padding-right: 4px; }
2503
- .sendbird-reaction-badge__inner .sendbird-reaction-badge__inner__icon {
2504
- position: absolute;
2505
- top: 2px;
2506
- left: 4px; }
2507
- .sendbird-reaction-badge__inner .sendbird-reaction-badge__inner__count {
2508
- margin-left: 4px; }
2509
-
2510
- .sendbird-admin-message {
2511
- display: flex;
2512
- justify-content: center;
2513
- align-items: center; }
2514
- .sendbird-admin-message .sendbird-admin-message__text {
2515
- display: flex; }
2516
-
2517
- .sendbird-text-message-item-body {
2518
- position: relative;
2519
- display: inline-block;
2520
- box-sizing: content-box;
2521
- padding: 8px 12px;
2522
- border-radius: 16px;
2523
- white-space: pre-line;
2524
- word-break: break-word; }
2525
- .sendbird-text-message-item-body.reactions {
2526
- border-radius: 16px 16px 0px 0px; }
2527
- .sendbird-theme--light .sendbird-text-message-item-body.incoming {
2528
- background-color: var(--sendbird-light-background-100); }
2529
- .sendbird-theme--dark .sendbird-text-message-item-body.incoming {
2530
- background-color: var(--sendbird-dark-background-500); }
2531
- .sendbird-theme--light .sendbird-text-message-item-body.outgoing {
2532
- background-color: var(--sendbird-light-primary-300); }
2533
- .sendbird-theme--dark .sendbird-text-message-item-body.outgoing {
2534
- background-color: var(--sendbird-dark-primary-200); }
2535
- .sendbird-theme--light .sendbird-text-message-item-body.mouse-hover.incoming, .sendbird-theme--light .sendbird-text-message-item-body:hover.incoming {
2536
- background-color: var(--sendbird-light-background-200); }
2537
- .sendbird-theme--dark .sendbird-text-message-item-body.mouse-hover.incoming, .sendbird-theme--dark .sendbird-text-message-item-body:hover.incoming {
2538
- background-color: var(--sendbird-dark-background-400); }
2539
- .sendbird-theme--light .sendbird-text-message-item-body.mouse-hover.outgoing, .sendbird-theme--light .sendbird-text-message-item-body:hover.outgoing {
2540
- background-color: var(--sendbird-light-primary-400); }
2541
- .sendbird-theme--dark .sendbird-text-message-item-body.mouse-hover.outgoing, .sendbird-theme--dark .sendbird-text-message-item-body:hover.outgoing {
2542
- background-color: var(--sendbird-dark-primary-300); }
2543
- .sendbird-text-message-item-body .sendbird-text-message-item-body__text-bubble__message {
2544
- display: inline;
2545
- margin: 0px 2px; }
2546
-
2547
- p.sendbird-text-message-item-body {
2548
- margin: 0px; }
2549
-
2550
- .sendbird-word {
2551
- display: inline-block;
2552
- margin-right: 4px;
2553
- height: -webkit-fit-content;
2554
- height: -moz-fit-content;
2555
- height: fit-content; }
2556
- .sendbird-word .sendbird-word__mention:hover {
2557
- cursor: pointer; }
2558
- .sendbird-word .sendbird-word__mention,
2559
- .sendbird-word .sendbird-word__url,
2560
- .sendbird-word .sendbird-word__normal {
2561
- display: inline-block; }
2562
-
2563
- .sendbird-link-label {
2564
- text-decoration: unset; }
2565
- .sendbird-link-label:hover {
2566
- cursor: pointer;
2567
- text-decoration: underline; }
2568
- .sendbird-link-label:focus {
2569
- outline: none; }
2570
- .sendbird-link-label__label {
2571
- display: inline; }
2572
-
2573
- .sendbird-theme--light .sendbird-link-label .sendbird-label--color-onbackground-1 {
2574
- color: var(--sendbird-light-onlight-01); }
2575
-
2576
- .sendbird-theme--dark .sendbird-link-label .sendbird-label--color-onbackground-1 {
2577
- color: var(--sendbird-dark-ondark-01); }
2578
-
2579
- .sendbird-theme--light .sendbird-link-label .sendbird-label--color-onbackground-2 {
2580
- color: var(--sendbird-light-onlight-02); }
2581
-
2582
- .sendbird-theme--dark .sendbird-link-label .sendbird-label--color-onbackground-2 {
2583
- color: var(--sendbird-dark-ondark-02); }
2584
-
2585
- .sendbird-theme--light .sendbird-link-label .sendbird-label--color-onbackground-3 {
2586
- color: var(--sendbird-light-onlight-03); }
2587
-
2588
- .sendbird-theme--dark .sendbird-link-label .sendbird-label--color-onbackground-3 {
2589
- color: var(--sendbird-dark-ondark-03); }
2590
-
2591
- .sendbird-theme--light .sendbird-link-label .sendbird-label--color-oncontent-1 {
2592
- color: var(--sendbird-light-ondark-01); }
2593
-
2594
- .sendbird-theme--dark .sendbird-link-label .sendbird-label--color-oncontent-1 {
2595
- color: var(--sendbird-dark-onlight-01); }
2596
-
2597
- .sendbird-theme--light .sendbird-link-label .sendbird-label--color-oncontent-2 {
2598
- color: var(--sendbird-light-ondark-02); }
2599
-
2600
- .sendbird-theme--dark .sendbird-link-label .sendbird-label--color-oncontent-2 {
2601
- color: var(--sendbird-dark-onlight-02); }
2602
-
2603
- .sendbird-theme--light .sendbird-link-label .sendbird-label--color-primary {
2604
- color: var(--sendbird-light-primary-300); }
2605
-
2606
- .sendbird-theme--dark .sendbird-link-label .sendbird-label--color-primary {
2607
- color: var(--sendbird-dark-primary-200); }
2608
-
2609
- .sendbird-theme--light .sendbird-link-label .sendbird-label--color-error {
2610
- color: var(--sendbird-light-error-300); }
2611
-
2612
- .sendbird-theme--dark .sendbird-link-label .sendbird-label--color-error {
2613
- color: var(--sendbird-dark-error-200); }
2614
-
2615
- .sendbird-theme--light .sendbird-link-label .sendbird-label--color-secondary-3 {
2616
- color: var(--sendbird-light-secondary-300); }
2617
-
2618
- .sendbird-theme--dark .sendbird-link-label .sendbird-label--color-secondary-3 {
2619
- color: var(--sendbird-dark-secondary-200); }
2620
-
2621
- .sendbird-file-message-item-body {
2622
- position: relative;
2623
- display: inline-block;
2624
- box-sizing: border-box;
2625
- padding: 8px 12px;
2626
- align-items: center;
2627
- border-radius: 16px; }
2628
- .sendbird-file-message-item-body.reactions {
2629
- border-radius: 16px 16px 0px 0px; }
2630
- .sendbird-theme--light .sendbird-file-message-item-body.outgoing {
2631
- background-color: var(--sendbird-light-primary-300); }
2632
- .sendbird-theme--dark .sendbird-file-message-item-body.outgoing {
2633
- background-color: var(--sendbird-dark-primary-200); }
2634
- .sendbird-theme--light .sendbird-file-message-item-body.incoming {
2635
- background-color: var(--sendbird-light-background-100); }
2636
- .sendbird-theme--dark .sendbird-file-message-item-body.incoming {
2637
- background-color: var(--sendbird-dark-background-500); }
2638
- .sendbird-theme--light .sendbird-file-message-item-body.mouse-hover.outgoing, .sendbird-theme--light .sendbird-file-message-item-body:hover.outgoing {
2639
- background-color: var(--sendbird-light-primary-400); }
2640
- .sendbird-theme--dark .sendbird-file-message-item-body.mouse-hover.outgoing, .sendbird-theme--dark .sendbird-file-message-item-body:hover.outgoing {
2641
- background-color: var(--sendbird-dark-primary-300); }
2642
- .sendbird-theme--light .sendbird-file-message-item-body.mouse-hover.incoming, .sendbird-theme--light .sendbird-file-message-item-body:hover.incoming {
2643
- background-color: var(--sendbird-light-background-200); }
2644
- .sendbird-theme--dark .sendbird-file-message-item-body.mouse-hover.incoming, .sendbird-theme--dark .sendbird-file-message-item-body:hover.incoming {
2645
- background-color: var(--sendbird-dark-background-400); }
2646
- .sendbird-file-message-item-body .sendbird-file-message-item-body__file-icon {
2647
- width: 28px;
2648
- height: 28px;
2649
- min-width: 28px;
2650
- min-height: 28px;
2651
- display: inline-flex;
2652
- align-items: center;
2653
- justify-content: center;
2654
- border-radius: 8px;
2655
- margin-right: 8px; }
2656
- .sendbird-theme--light .sendbird-file-message-item-body .sendbird-file-message-item-body__file-icon {
2657
- background-color: var(--sendbird-light-background-50); }
2658
- .sendbird-theme--dark .sendbird-file-message-item-body .sendbird-file-message-item-body__file-icon {
2659
- background-color: var(--sendbird-dark-background-600); }
2660
- .sendbird-file-message-item-body .sendbird-file-message-item-body__file-name {
2661
- position: relative;
2662
- top: -6px; }
2663
-
2664
- .sendbird-thumbnail-message-item-body {
2665
- position: relative;
2666
- display: block;
2667
- box-sizing: border-box;
2668
- overflow: hidden;
2669
- width: 100%;
2670
- min-width: 360px;
2671
- max-width: 400px;
2672
- height: 270px;
2673
- border-radius: 16px; }
2674
- .sendbird-thumbnail-message-item-body.reactions {
2675
- border-radius: 16px 16px 0px 0px; }
2676
- .sendbird-theme--light .sendbird-thumbnail-message-item-body {
2677
- background-color: var(--sendbird-light-background-100); }
2678
- .sendbird-theme--dark .sendbird-thumbnail-message-item-body {
2679
- background-color: var(--sendbird-dark-background-500); }
2680
- .sendbird-theme--light .sendbird-thumbnail-message-item-body.mouse-hover, .sendbird-theme--light .sendbird-thumbnail-message-item-body:hover {
2681
- background-color: var(--sendbird-light-background-200); }
2682
- .sendbird-theme--dark .sendbird-thumbnail-message-item-body.mouse-hover, .sendbird-theme--dark .sendbird-thumbnail-message-item-body:hover {
2683
- background-color: var(--sendbird-dark-background-400); }
2684
- .sendbird-thumbnail-message-item-body .sendbird-thumbnail-message-item-body__thumbnail {
2685
- position: absolute;
2686
- border-radius: 16px; }
2687
- .sendbird-thumbnail-message-item-body .sendbird-thumbnail-message-item-body__placeholder {
2688
- position: absolute;
2689
- width: 100%;
2690
- height: 270px;
2691
- display: flex;
2692
- justify-content: center;
2693
- align-items: center; }
2694
- .sendbird-thumbnail-message-item-body .sendbird-thumbnail-message-item-body__placeholder .sendbird-thumbnail-message-item-body__placeholder__icon {
2695
- display: flex;
2696
- align-items: center;
2697
- justify-content: center;
2698
- width: 56px;
2699
- height: 56px;
2700
- border-radius: 50%;
2701
- background-color: var(--sendbird-light-background-50); }
2702
- .sendbird-thumbnail-message-item-body .sendbird-thumbnail-message-item-body__image-cover {
2703
- position: absolute;
2704
- top: 0px;
2705
- display: none;
2706
- width: 100%;
2707
- height: 270px;
2708
- border-radius: 16px;
2709
- background-color: var(--sendbird-light-overlay-01); }
2710
- .sendbird-thumbnail-message-item-body .sendbird-thumbnail-message-item-body__video {
2711
- position: absolute;
2712
- width: 100%;
2713
- height: 270px;
2714
- border-radius: 16px; }
2715
- .sendbird-thumbnail-message-item-body .sendbird-thumbnail-message-item-body__icon-wrapper {
2716
- position: absolute;
2717
- width: 100%;
2718
- height: 270px;
2719
- display: flex;
2720
- align-items: center;
2721
- justify-content: center; }
2722
- .sendbird-thumbnail-message-item-body .sendbird-thumbnail-message-item-body__icon-wrapper .sendbird-thumbnail-message-item-body__icon-wrapper__icon {
2723
- display: flex;
2724
- align-items: center;
2725
- justify-content: center;
2726
- width: 56px;
2727
- height: 56px;
2728
- border-radius: 50%;
2729
- background-color: var(--sendbird-light-background-50); }
2730
-
2731
- .sendbird-thumbnail-message-item-body:hover {
2732
- cursor: pointer; }
2733
- .sendbird-thumbnail-message-item-body:hover .sendbird-thumbnail-message-item-body__image-cover {
2734
- display: inline-flex; }
2735
-
2736
- .sendbird-og-message-item-body {
2737
- position: relative;
2738
- display: inline-block;
2739
- width: 100%;
2740
- min-width: 320px;
2741
- max-width: 400px; }
2742
- .sendbird-og-message-item-body .sendbird-og-message-item-body__text-bubble {
2743
- position: relative;
2744
- padding: 8px 12px;
2745
- box-sizing: border-box;
2746
- border-radius: 16px 16px 0px 0px;
2747
- word-break: break-word; }
2748
- .sendbird-og-message-item-body .sendbird-og-message-item-body__text-bubble .sendbird-og-message-item-body__text-bubble__message {
2749
- display: inline;
2750
- margin: 0px 2px; }
2751
- .sendbird-og-message-item-body .sendbird-og-message-item-body__og-thumbnail {
2752
- position: relative;
2753
- overflow: hidden; }
2754
- .sendbird-og-message-item-body .sendbird-og-message-item-body__og-thumbnail .sendbird-og-message-item-body__og-thumbnail__image {
2755
- width: 100%;
2756
- position: relative;
2757
- display: flex;
2758
- justify-content: center;
2759
- align-items: center; }
2760
- .sendbird-og-message-item-body.reactions .sendbird-og-message-item-body__description {
2761
- border-radius: 0px; }
2762
- .sendbird-og-message-item-body .sendbird-og-message-item-body__description {
2763
- white-space: nowrap;
2764
- text-overflow: ellipsis;
2765
- overflow: hidden;
2766
- padding: 8px 12px;
2767
- display: flex;
2768
- flex-direction: column;
2769
- border-radius: 0px 0px 16px 16px; }
2770
- .sendbird-theme--light .sendbird-og-message-item-body .sendbird-og-message-item-body__description {
2771
- background-color: var(--sendbird-light-background-100); }
2772
- .sendbird-theme--dark .sendbird-og-message-item-body .sendbird-og-message-item-body__description {
2773
- background-color: var(--sendbird-dark-background-500); }
2774
- .sendbird-og-message-item-body .sendbird-og-message-item-body__description .sendbird-og-message-item-body__description__title,
2775
- .sendbird-og-message-item-body .sendbird-og-message-item-body__description .sendbird-og-message-item-body__description__description {
2776
- margin-bottom: 4px;
2777
- width: 100%;
2778
- white-space: nowrap;
2779
- text-overflow: ellipsis;
2780
- overflow: hidden;
2781
- display: inline-block; }
2782
- .sendbird-og-message-item-body .sendbird-og-message-item-body__description .sendbird-og-message-item-body__description__url {
2783
- width: 100%;
2784
- white-space: nowrap;
2785
- text-overflow: ellipsis;
2786
- overflow: hidden;
2787
- display: inline-block;
2788
- margin: 4px 0px; }
2789
- .sendbird-og-message-item-body .sendbird-og-message-item-body__og-thumbnail:hover,
2790
- .sendbird-og-message-item-body .sendbird-og-message-item-body__description:hover {
2791
- cursor: pointer; }
2792
- .sendbird-theme--light .sendbird-og-message-item-body.outgoing .sendbird-og-message-item-body__text-bubble {
2793
- background-color: var(--sendbird-light-primary-300); }
2794
- .sendbird-theme--dark .sendbird-og-message-item-body.outgoing .sendbird-og-message-item-body__text-bubble {
2795
- background-color: var(--sendbird-dark-primary-200); }
2796
- .sendbird-theme--light .sendbird-og-message-item-body.incoming .sendbird-og-message-item-body__text-bubble {
2797
- background-color: var(--sendbird-light-background-100); }
2798
- .sendbird-theme--dark .sendbird-og-message-item-body.incoming .sendbird-og-message-item-body__text-bubble {
2799
- background-color: var(--sendbird-dark-background-500); }
2800
- .sendbird-theme--light .sendbird-og-message-item-body.mouse-hover .sendbird-og-message-item-body__description, .sendbird-theme--light .sendbird-og-message-item-body:hover .sendbird-og-message-item-body__description {
2801
- background-color: var(--sendbird-light-background-200); }
2802
- .sendbird-theme--dark .sendbird-og-message-item-body.mouse-hover .sendbird-og-message-item-body__description, .sendbird-theme--dark .sendbird-og-message-item-body:hover .sendbird-og-message-item-body__description {
2803
- background-color: var(--sendbird-dark-background-400); }
2804
- .sendbird-theme--light .sendbird-og-message-item-body.mouse-hover.outgoing .sendbird-og-message-item-body__text-bubble, .sendbird-theme--light .sendbird-og-message-item-body:hover.outgoing .sendbird-og-message-item-body__text-bubble {
2805
- background-color: var(--sendbird-light-primary-400); }
2806
- .sendbird-theme--dark .sendbird-og-message-item-body.mouse-hover.outgoing .sendbird-og-message-item-body__text-bubble, .sendbird-theme--dark .sendbird-og-message-item-body:hover.outgoing .sendbird-og-message-item-body__text-bubble {
2807
- background-color: var(--sendbird-dark-primary-300); }
2808
- .sendbird-theme--light .sendbird-og-message-item-body.mouse-hover.incoming .sendbird-og-message-item-body__text-bubble, .sendbird-theme--light .sendbird-og-message-item-body:hover.incoming .sendbird-og-message-item-body__text-bubble {
2809
- background-color: var(--sendbird-light-background-200); }
2810
- .sendbird-theme--dark .sendbird-og-message-item-body.mouse-hover.incoming .sendbird-og-message-item-body__text-bubble, .sendbird-theme--dark .sendbird-og-message-item-body:hover.incoming .sendbird-og-message-item-body__text-bubble {
2811
- background-color: var(--sendbird-dark-background-400); }
2812
- .sendbird-og-message-item-body .sendbird-og-message-item-body__cover {
2813
- display: none;
2814
- position: absolute;
2815
- top: 0%;
2816
- left: 0;
2817
- width: 100%;
2818
- height: 100%;
2819
- border-radius: 16px 16px 0px 0px; }
2820
-
2821
- p.sendbird-og-message-item-body__text-bubble {
2822
- margin: 0px; }
2823
-
2824
- .sendbird-unknown-message-item-body {
2825
- position: relative;
2826
- display: inline-block;
2827
- box-sizing: border-box;
2828
- padding: 8px 12px;
2829
- border-radius: 16px; }
2830
- .sendbird-unknown-message-item-body.reactions {
2831
- border-radius: 16px 16px 0px 0px; }
2832
- .sendbird-theme--light .sendbird-unknown-message-item-body.outgoing {
2833
- background-color: var(--sendbird-light-primary-300); }
2834
- .sendbird-theme--dark .sendbird-unknown-message-item-body.outgoing {
2835
- background-color: var(--sendbird-dark-primary-200); }
2836
- .sendbird-theme--light .sendbird-unknown-message-item-body.incoming {
2837
- background-color: var(--sendbird-light-background-100); }
2838
- .sendbird-theme--dark .sendbird-unknown-message-item-body.incoming {
2839
- background-color: var(--sendbird-dark-background-500); }
2840
- .sendbird-theme--light .sendbird-unknown-message-item-body.mouse-hover.outgoing, .sendbird-theme--light .sendbird-unknown-message-item-body:hover.outgoing {
2841
- background-color: var(--sendbird-light-primary-400); }
2842
- .sendbird-theme--dark .sendbird-unknown-message-item-body.mouse-hover.outgoing, .sendbird-theme--dark .sendbird-unknown-message-item-body:hover.outgoing {
2843
- background-color: var(--sendbird-dark-primary-300); }
2844
- .sendbird-theme--light .sendbird-unknown-message-item-body.mouse-hover.incoming, .sendbird-theme--light .sendbird-unknown-message-item-body:hover.incoming {
2845
- background-color: var(--sendbird-light-background-200); }
2846
- .sendbird-theme--dark .sendbird-unknown-message-item-body.mouse-hover.incoming, .sendbird-theme--dark .sendbird-unknown-message-item-body:hover.incoming {
2847
- background-color: var(--sendbird-dark-background-400); }
2848
- .sendbird-unknown-message-item-body .sendbird-unknown-message-item-body__header {
2849
- display: block; }
2850
- .sendbird-unknown-message-item-body .sendbird-unknown-message-item-body__description {
2851
- display: block; }
2852
-
2853
- .sendbird-quote-message {
2854
- position: relative;
2855
- display: inline-flex;
2856
- box-sizing: border-box;
2857
- flex-direction: column;
2858
- max-width: 400px; }
2859
- .sendbird-quote-message.incoming {
2860
- align-items: flex-start; }
2861
- .sendbird-quote-message.outgoing {
2862
- align-items: flex-end; }
2863
- .sendbird-quote-message .sendbird-quote-message__replied-to {
2864
- position: relative;
2865
- display: inline-flex;
2866
- flex-direction: row;
2867
- align-items: center;
2868
- height: 16px;
2869
- padding: 0px 12px; }
2870
- .sendbird-quote-message .sendbird-quote-message__replied-to .sendbird-quote-message__replied-to__icon {
2871
- position: relative;
2872
- margin-bottom: 4px;
2873
- margin-right: 4px; }
2874
- .sendbird-quote-message .sendbird-quote-message__replied-to .sendbird-quote-message__replied-to__text {
2875
- position: relative;
2876
- max-width: 360px;
2877
- overflow: hidden;
2878
- overflow-x: hidden;
2879
- white-space: nowrap;
2880
- word-break: keep-all;
2881
- text-overflow: ellipsis;
2882
- font-size: 12px; }
2883
- .sendbird-quote-message .sendbird-quote-message__replied-message {
2884
- position: relative;
2885
- display: inline-flex; }
2886
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__text-message {
2887
- position: relative;
2888
- white-space: pre-wrap;
2889
- word-break: break-all;
2890
- font-size: 12px;
2891
- padding: 8px 12px 16px 12px;
2892
- border-radius: 16px;
2893
- opacity: 0.5; }
2894
- .sendbird-theme--light .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__text-message {
2895
- background-color: var(--sendbird-light-background-100); }
2896
- .sendbird-theme--dark .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__text-message {
2897
- background-color: var(--sendbird-dark-background-500); }
2898
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__text-message .sendbird-quote-message__replied-message__text-message__word {
2899
- position: relative;
2900
- display: inline-flex;
2901
- max-height: 30px;
2902
- overflow: hidden;
2903
- text-overflow: ellipsis; }
2904
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message {
2905
- position: relative;
2906
- width: 144px;
2907
- height: 108px;
2908
- border-radius: 6.4px;
2909
- overflow: hidden; }
2910
- .sendbird-theme--light .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message {
2911
- background-color: var(--sendbird-light-background-100); }
2912
- .sendbird-theme--dark .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message {
2913
- background-color: var(--sendbird-dark-background-500); }
2914
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message .sendbird-quote-message__replied-message__thumbnail-message__video,
2915
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message .sendbird-quote-message__replied-message__thumbnail-message__image {
2916
- position: absolute;
2917
- top: 0px;
2918
- display: inline-flex;
2919
- width: 100%;
2920
- height: 100%;
2921
- opacity: 0.5; }
2922
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message .sendbird-quote-message__replied-message__thumbnail-message__placeholder {
2923
- position: absolute;
2924
- display: inline-flex;
2925
- width: 100%;
2926
- height: 100%;
2927
- justify-content: center;
2928
- align-items: center; }
2929
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message .sendbird-quote-message__replied-message__thumbnail-message__placeholder .sendbird-quote-message__replied-message__thumbnail-message__placeholder__icon {
2930
- display: inline-flex;
2931
- justify-content: center;
2932
- align-items: center;
2933
- width: 22px;
2934
- height: 22px;
2935
- border-radius: 50%; }
2936
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message .sendbird-quote-message__replied-message__thumbnail-message__cover {
2937
- position: absolute;
2938
- display: inline-flex;
2939
- width: 100%;
2940
- height: 100%;
2941
- justify-content: center;
2942
- align-items: center;
2943
- top: 0px; }
2944
- .sendbird-theme--light .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message .sendbird-quote-message__replied-message__thumbnail-message__cover {
2945
- background-color: rgba(255, 255, 255, 0.4); }
2946
- .sendbird-theme--dark .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message .sendbird-quote-message__replied-message__thumbnail-message__cover {
2947
- background-color: rgba(255, 255, 255, 0.4); }
2948
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message .sendbird-quote-message__replied-message__thumbnail-message__cover .sendbird-quote-message__replied-message__thumbnail-message__cover__icon {
2949
- position: relative;
2950
- display: inline-flex;
2951
- justify-content: center;
2952
- align-items: center;
2953
- width: 22px;
2954
- height: 22px;
2955
- border-radius: 50%; }
2956
- .sendbird-theme--light .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message .sendbird-quote-message__replied-message__thumbnail-message__cover .sendbird-quote-message__replied-message__thumbnail-message__cover__icon {
2957
- background-color: white; }
2958
- .sendbird-theme--dark .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__thumbnail-message .sendbird-quote-message__replied-message__thumbnail-message__cover .sendbird-quote-message__replied-message__thumbnail-message__cover__icon {
2959
- background-color: white; }
2960
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__file-message {
2961
- position: relative;
2962
- display: inline-flex;
2963
- flex-direction: row;
2964
- font-size: 12px;
2965
- padding: 8px 12px 16px 12px;
2966
- border-radius: 16px;
2967
- opacity: 0.5; }
2968
- .sendbird-theme--light .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__file-message {
2969
- background-color: var(--sendbird-light-background-100); }
2970
- .sendbird-theme--dark .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__file-message {
2971
- background-color: var(--sendbird-dark-background-500); }
2972
- .sendbird-quote-message .sendbird-quote-message__replied-message .sendbird-quote-message__replied-message__file-message .sendbird-quote-message__replied-message__file-message__type-icon {
2973
- margin-right: 2px; }
2974
-
2975
- .sendbird-fileviewer__header__right__actions__download,
2976
- .sendbird-fileviewer__header__right__actions__delete,
2977
- .sendbird-fileviewer__header__right__actions__close {
2978
- width: 64px;
2979
- padding: 21px;
2980
- box-sizing: border-box;
2981
- cursor: pointer; }
2982
- .sendbird-fileviewer__header__right__actions__download .disabled,
2983
- .sendbird-fileviewer__header__right__actions__delete .disabled,
2984
- .sendbird-fileviewer__header__right__actions__close .disabled {
2985
- cursor: not-allowed; }
2986
-
2987
- .sendbird-fileviewer {
2988
- width: 100%;
2989
- height: 100%;
2990
- position: fixed;
2991
- top: 0;
2992
- left: 0;
2993
- z-index: 100000; }
2994
- .sendbird-theme--light .sendbird-fileviewer {
2995
- background-color: var(--sendbird-light-background-50); }
2996
- .sendbird-theme--dark .sendbird-fileviewer {
2997
- background-color: var(--sendbird-dark-background-600); }
2998
- .sendbird-fileviewer .sendbird-fileviewer__header {
2999
- height: 64px;
3000
- min-height: 64px;
3001
- box-sizing: border-box;
3002
- display: flex;
3003
- justify-content: space-between; }
3004
- .sendbird-theme--light .sendbird-fileviewer .sendbird-fileviewer__header {
3005
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
3006
- .sendbird-theme--dark .sendbird-fileviewer .sendbird-fileviewer__header {
3007
- border-bottom: 1px solid var(--sendbird-dark-ondark-04); }
3008
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__left {
3009
- box-sizing: border-box;
3010
- display: flex;
3011
- flex-direction: row;
3012
- align-items: center;
3013
- height: 64px;
3014
- padding: 16px 20px; }
3015
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__left .sendbird-fileviewer__header__left__avatar {
3016
- margin-right: 8px; }
3017
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__left .sendbird-fileviewer__header__left__filename {
3018
- max-width: 500px;
3019
- white-space: nowrap;
3020
- overflow: hidden;
3021
- text-overflow: ellipsis;
3022
- display: inline-block; }
3023
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__left .sendbird-fileviewer__header__left__sender-name {
3024
- max-width: 200px;
3025
- white-space: nowrap;
3026
- overflow: hidden;
3027
- text-overflow: ellipsis;
3028
- display: inline-flex;
3029
- margin-left: 8px;
3030
- padding-top: 5px; }
3031
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__right {
3032
- display: flex;
3033
- width: 160px;
3034
- justify-content: flex-end; }
3035
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__right .sendbird-fileviewer__header__right__actions {
3036
- right: 0;
3037
- display: flex;
3038
- flex-direction: row; }
3039
- .sendbird-theme--light .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__right .sendbird-fileviewer__header__right__actions__close {
3040
- border-left: 1px solid var(--sendbird-light-onlight-04); }
3041
- .sendbird-theme--dark .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__right .sendbird-fileviewer__header__right__actions__close {
3042
- border-left: 1px solid var(--sendbird-dark-ondark-04); }
3043
- .sendbird-fileviewer .sendbird-fileviewer__content {
3044
- height: calc(100% - 72px);
3045
- margin-top: 8px;
3046
- overflow-y: auto;
3047
- display: flex;
3048
- align-items: center;
3049
- justify-content: center; }
3050
- .sendbird-fileviewer .sendbird-fileviewer__content .sendbird-fileviewer__content__video {
3051
- max-width: 100%;
3052
- max-height: 100%; }
3053
- .sendbird-fileviewer .sendbird-fileviewer__content .sendbird-fileviewer__content__img {
3054
- max-width: 90%;
3055
- max-height: 90%; }
3056
- .sendbird-fileviewer .sendbird-fileviewer__content .sendbird-fileviewer__content__unsupported {
3057
- max-width: 100%;
3058
- max-height: 100%;
3059
- display: flex;
3060
- justify-content: center;
3061
- align-items: center; }
3062
-
3063
- .sendbird-notification {
3064
- margin-top: 8px;
3065
- margin-left: 24px;
3066
- margin-right: 24px;
3067
- border-radius: 4px;
3068
- padding: 0px 2px;
3069
- height: 32px;
3070
- display: flex;
3071
- align-items: center;
3072
- justify-content: center; }
3073
- .sendbird-theme--light .sendbird-notification {
3074
- background-color: var(--sendbird-light-primary-300); }
3075
- .sendbird-theme--dark .sendbird-notification {
3076
- background-color: var(--sendbird-dark-primary-200); }
3077
- .sendbird-notification:hover {
3078
- cursor: pointer; }
3079
- .sendbird-theme--light .sendbird-notification:hover {
3080
- background-color: var(--sendbird-light-primary-400); }
3081
- .sendbird-theme--dark .sendbird-notification:hover {
3082
- background-color: var(--sendbird-dark-primary-300); }
3083
- .sendbird-theme--light .sendbird-notification.sendbird-notification--frozen {
3084
- background-color: var(--sendbird-light-information-100); }
3085
- .sendbird-theme--dark .sendbird-notification.sendbird-notification--frozen {
3086
- background-color: var(--sendbird-dark-information-100); }
3087
- .sendbird-theme--light .sendbird-notification.sendbird-notification--frozen .sendbird-notification__text {
3088
- color: var(--sendbird-light-onlight-01); }
3089
- .sendbird-theme--dark .sendbird-notification.sendbird-notification--frozen .sendbird-notification__text {
3090
- color: var(--sendbird-dark-onlight-01); }
3091
- .sendbird-notification .sendbird-notification__text {
3092
- display: flex;
3093
- align-items: center;
3094
- justify-content: center;
3095
- margin-right: 8px; }
3096
-
3097
- .sendbird-notification {
3098
- margin-top: 8px;
3099
- margin-left: 24px;
3100
- margin-right: 24px;
3101
- border-radius: 4px;
3102
- padding: 0px 2px;
3103
- height: 32px;
3104
- display: flex;
3105
- align-items: center;
3106
- justify-content: center; }
3107
- .sendbird-theme--light .sendbird-notification {
3108
- background-color: var(--sendbird-light-primary-300); }
3109
- .sendbird-theme--dark .sendbird-notification {
3110
- background-color: var(--sendbird-dark-primary-200); }
3111
- .sendbird-notification:hover {
3112
- cursor: pointer; }
3113
- .sendbird-theme--light .sendbird-notification:hover {
3114
- background-color: var(--sendbird-light-primary-400); }
3115
- .sendbird-theme--dark .sendbird-notification:hover {
3116
- background-color: var(--sendbird-dark-primary-300); }
3117
- .sendbird-theme--light .sendbird-notification.sendbird-notification--frozen {
3118
- background-color: var(--sendbird-light-information-100); }
3119
- .sendbird-theme--dark .sendbird-notification.sendbird-notification--frozen {
3120
- background-color: var(--sendbird-dark-information-100); }
3121
- .sendbird-theme--light .sendbird-notification.sendbird-notification--frozen .sendbird-notification__text {
3122
- color: var(--sendbird-light-onlight-01); }
3123
- .sendbird-theme--dark .sendbird-notification.sendbird-notification--frozen .sendbird-notification__text {
3124
- color: var(--sendbird-dark-onlight-01); }
3125
- .sendbird-notification .sendbird-notification__text {
3126
- display: flex;
3127
- align-items: center;
3128
- justify-content: center;
3129
- margin-right: 8px; }
3130
-
3131
- .sendbird-message-input-wrapper {
3132
- position: relative;
3133
- width: 100%; }
3134
- .sendbird-message-input-wrapper .sendbird-message-input-wrapper__quote-message-input {
3135
- position: relative;
3136
- width: 100%; }
3137
- .sendbird-theme--light .sendbird-message-input-wrapper .sendbird-message-input-wrapper__quote-message-input {
3138
- border-top: solid 1px var(--sendbird-light-onlight-04); }
3139
- .sendbird-theme--dark .sendbird-message-input-wrapper .sendbird-message-input-wrapper__quote-message-input {
3140
- border-top: solid 1px var(--sendbird-dark-ondark-04); }
3141
- .sendbird-message-input-wrapper .sendbird-message-input-wrapper__message-input {
3142
- position: relative;
3143
- width: 100%;
3144
- box-sizing: border-box;
3145
- padding-left: 24px;
3146
- padding-right: 24px; }
3147
-
3148
- .sendbird-quote_message_input {
3149
- position: relative;
3150
- padding: 16px 80px 16px 40px;
3151
- width: 100%;
3152
- height: 76px;
3153
- display: flex;
3154
- flex-direction: row;
3155
- box-sizing: border-box; }
3156
- .sendbird-quote_message_input .sendbird-quote_message_input__avatar {
3157
- width: 44px;
3158
- min-width: 44px;
3159
- height: 44px;
3160
- min-height: 44px;
3161
- position: relative;
3162
- border-radius: 8px;
3163
- display: flex;
3164
- justify-content: center;
3165
- align-items: center; }
3166
- .sendbird-theme--light .sendbird-quote_message_input .sendbird-quote_message_input__avatar {
3167
- background-color: var(--sendbird-light-background-100); }
3168
- .sendbird-theme--dark .sendbird-quote_message_input .sendbird-quote_message_input__avatar {
3169
- background-color: var(--sendbird-dark-background-500); }
3170
- .sendbird-quote_message_input .sendbird-quote_message_input__body {
3171
- position: absolute;
3172
- display: flex;
3173
- flex-direction: column;
3174
- align-items: flex-start;
3175
- overflow: hidden; }
3176
- .sendbird-quote_message_input .sendbird-quote_message_input__body .sendbird-quote_message_input__body__sender-name {
3177
- position: relative;
3178
- width: 100%;
3179
- overflow: hidden;
3180
- text-overflow: ellipsis;
3181
- white-space: nowrap;
3182
- box-sizing: border-box;
3183
- margin-bottom: 8px; }
3184
- .sendbird-quote_message_input .sendbird-quote_message_input__body .sendbird-quote_message_input__body__message-content {
3185
- position: relative;
3186
- width: 100%;
3187
- overflow: hidden;
3188
- text-overflow: ellipsis;
3189
- white-space: nowrap;
3190
- box-sizing: border-box; }
3191
- .sendbird-quote_message_input .sendbird-quote_message_input__close-button {
3192
- position: absolute;
3193
- top: 26px;
3194
- right: 40px; }
3195
- .sendbird-quote_message_input .sendbird-quote_message_input__close-button:hover {
3196
- cursor: pointer; }
3197
-
3198
- .sendbird-channel-settings {
3199
- height: 100%;
3200
- width: 320px;
3201
- display: inline-block;
3202
- box-sizing: border-box; }
3203
- .sendbird-theme--light .sendbird-channel-settings {
3204
- background-color: var(--sendbird-light-background-50);
3205
- border-left: 1px solid var(--sendbird-light-onlight-04); }
3206
- .sendbird-theme--dark .sendbird-channel-settings {
3207
- background-color: var(--sendbird-dark-background-600);
3208
- border-left: 1px solid var(--sendbird-dark-background-600); }
3209
- .sendbird-channel-settings .sendbird-channel-settings__header-icon {
3210
- cursor: pointer;
3211
- position: absolute;
3212
- top: 16px;
3213
- right: 16px; }
3214
- .sendbird-theme--light .sendbird-channel-settings .sendbird-channel-settings__header-icon .sendbird-channel-settings__close-icon path {
3215
- fill: var(--sendbird-light-onlight-01); }
3216
- .sendbird-theme--dark .sendbird-channel-settings .sendbird-channel-settings__header-icon .sendbird-channel-settings__close-icon path {
3217
- fill: var(--sendbird-dark-ondark-01); }
3218
- .sendbird-channel-settings .sendbird-channel-settings__members .sendbird-badge__text {
3219
- margin-top: -2px; }
3220
- .sendbird-channel-settings .sendbird-channel-settings__header {
3221
- height: 64px;
3222
- min-height: 64px;
3223
- position: relative;
3224
- padding: 20px 24px;
3225
- box-sizing: border-box; }
3226
- .sendbird-theme--light .sendbird-channel-settings .sendbird-channel-settings__header {
3227
- border-bottom: solid 1px var(--sendbird-light-onlight-04); }
3228
- .sendbird-theme--dark .sendbird-channel-settings .sendbird-channel-settings__header {
3229
- border-bottom: solid 1px var(--sendbird-dark-ondark-04); }
3230
- .sendbird-channel-settings .sendbird-channel-settings__scroll-area {
3231
- display: flex;
3232
- flex-grow: 1;
3233
- flex-direction: column;
3234
- height: calc(100% - 64px);
3235
- overflow-y: auto; }
3236
- .sendbird-channel-settings .sendbird-channel-settings__panel-item {
3237
- cursor: pointer;
3238
- position: relative;
3239
- padding: 12px 22px 10px 56px; }
3240
- .sendbird-theme--light .sendbird-channel-settings .sendbird-channel-settings__panel-item {
3241
- background-color: var(--sendbird-light-background-50);
3242
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
3243
- .sendbird-theme--dark .sendbird-channel-settings .sendbird-channel-settings__panel-item {
3244
- background-color: var(--sendbird-dark-background-600);
3245
- border-bottom: 1px solid var(--sendbird-dark-ondark-04); }
3246
- .sendbird-channel-settings .sendbird-channel-settings__panel-item:focus {
3247
- outline: none; }
3248
- .sendbird-channel-settings .sendbird-channel-settings__panel-item.sendbird-channel-settings__panel-item__disabled {
3249
- cursor: not-allowed; }
3250
- .sendbird-channel-settings .sendbird-channel-settings__panel-icon-left,
3251
- .sendbird-channel-settings .sendbird-channel-settings__panel-icon-right {
3252
- position: absolute;
3253
- top: 10px; }
3254
- .sendbird-channel-settings .sendbird-channel-settings__panel-icon-left {
3255
- left: 16px; }
3256
- .sendbird-channel-settings .sendbird-channel-settings__panel-icon-right {
3257
- right: 16px; }
3258
- .sendbird-channel-settings .sendbird-channel-settings__panel-icon--open {
3259
- transform: rotate(90deg); }
3260
- .sendbird-theme--light .sendbird-channel-settings .sendbird-channel-settings__panel-icon--chevron path {
3261
- fill: var(--sendbird-light-onlight-01); }
3262
- .sendbird-theme--dark .sendbird-channel-settings .sendbird-channel-settings__panel-icon--chevron path {
3263
- fill: var(--sendbird-dark-ondark-01); }
3264
-
3265
- .sendbird-channel-profile {
3266
- position: relative;
3267
- text-align: center;
3268
- padding: 32px 40px 27px 40px; }
3269
- .sendbird-theme--light .sendbird-channel-profile {
3270
- border-bottom: 1px solid var(--sendbird-light-onlight-04);
3271
- background-color: var(--sendbird-light-background-50); }
3272
- .sendbird-theme--dark .sendbird-channel-profile {
3273
- border-bottom: 1px solid var(--sendbird-dark-ondark-04);
3274
- background-color: var(--sendbird-dark-background-600); }
3275
- .sendbird-channel-profile .sendbird-channel-profile--inner {
3276
- height: 92px; }
3277
- .sendbird-channel-profile .sendbird-channel-profile__avatar {
3278
- margin-bottom: 16px;
3279
- display: flex;
3280
- justify-content: center; }
3281
- .sendbird-channel-profile .sendbird-channel-profile__title {
3282
- display: block;
3283
- max-width: 240px;
3284
- white-space: nowrap;
3285
- overflow-x: hidden;
3286
- text-overflow: ellipsis;
3287
- height: 18px; }
3288
- .sendbird-channel-profile .sendbird-channel-profile__edit {
3289
- position: absolute;
3290
- top: 10px;
3291
- right: 16px; }
3292
-
3293
- .channel-profile-form .channel-profile-form__img-section {
3294
- position: relative; }
3295
-
3296
- .channel-profile-form .channel-profile-form__avatar-button {
3297
- position: absolute;
3298
- top: 54px;
3299
- left: 96px; }
3300
-
3301
- .channel-profile-form .channel-profile-form__avatar {
3302
- margin-top: 16px; }
3303
-
3304
- .channel-profile-form .channel-profile-form__name-section {
3305
- margin-top: 12px; }
3306
- .channel-profile-form .channel-profile-form__name-section .sendbird-input {
3307
- height: 40px; }
3308
-
3309
- .sendbird-channel-settings__operator .sendbird-channel-settings__accordion-icon {
3310
- position: absolute;
3311
- left: 14px; }
3312
-
3313
- .sendbird-channel-settings__operator .sendbird-accordion__panel-heder {
3314
- position: relative; }
3315
-
3316
- .sendbird-more-members__popup-scroll {
3317
- max-height: 420px;
3318
- overflow: scroll; }
3319
- .sendbird-more-members__popup-scroll .sendbird-user-list-item__operator {
3320
- right: 72px; }
3321
- .sendbird-more-members__popup-scroll .sendbird-user-list-item__title {
3322
- max-width: 240px; }
3323
-
3324
- .sendbird-channel-settings__empty-list {
3325
- text-align: center;
3326
- margin-top: 12px;
3327
- margin-bottom: 4px;
3328
- display: block; }
3329
-
3330
- .sendbird-channel-settings-accordion__footer {
3331
- padding-top: 16px;
3332
- display: flex;
3333
- justify-content: left;
3334
- padding-left: 12px; }
3335
- .sendbird-channel-settings-accordion__footer .sendbird-button:nth-child(2) {
3336
- margin-left: 8px; }
3337
-
3338
- .sendbird-channel-settings__freeze {
3339
- max-width: 320px;
3340
- position: relative;
3341
- padding: 12px 22px 10px 56px; }
3342
- .sendbird-theme--light .sendbird-channel-settings__freeze {
3343
- background-color: var(--sendbird-light-background-50);
3344
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
3345
- .sendbird-theme--dark .sendbird-channel-settings__freeze {
3346
- background-color: var(--sendbird-dark-background-600);
3347
- border-bottom: 1px solid var(--sendbird-dark-ondark-04); }
3348
-
3349
- .sendbird-channel-settings__frozen-icon {
3350
- position: absolute;
3351
- right: 20px;
3352
- top: 12px; }
3353
- .sendbird-channel-settings__frozen-icon .sendbird-icon {
3354
- cursor: pointer; }
3355
-
3356
- .sendbird-channel-settings__members-list .sendbird-badge,
3357
- .sendbird-channel-settings__members .sendbird-badge {
3358
- position: absolute;
3359
- right: 44px;
3360
- top: 12px; }
3361
- .sendbird-theme--light .sendbird-channel-settings__members-list .sendbird-badge, .sendbird-theme--light
3362
- .sendbird-channel-settings__members .sendbird-badge {
3363
- background-color: var(--sendbird-light-background-200); }
3364
- .sendbird-theme--dark .sendbird-channel-settings__members-list .sendbird-badge, .sendbird-theme--dark
3365
- .sendbird-channel-settings__members .sendbird-badge {
3366
- background-color: var(--sendbird-dark-background-400); }
3367
- .sendbird-theme--light .sendbird-channel-settings__members-list .sendbird-badge .sendbird-label, .sendbird-theme--light
3368
- .sendbird-channel-settings__members .sendbird-badge .sendbird-label {
3369
- color: var(--sendbird-light-onlight-02); }
3370
- .sendbird-theme--dark .sendbird-channel-settings__members-list .sendbird-badge .sendbird-label, .sendbird-theme--dark
3371
- .sendbird-channel-settings__members .sendbird-badge .sendbird-label {
3372
- color: var(--sendbird-dark-ondark-02); }
3373
-
3374
- .sendbird-accordion {
3375
- padding: 8px 0px 16px 0px;
3376
- position: relative;
3377
- box-sizing: border-box; }
3378
- .sendbird-theme--light .sendbird-accordion {
3379
- border-bottom: 1px solid var(--sendbird-light-onlight-04);
3380
- background-color: var(--sendbird-light-background-50); }
3381
- .sendbird-theme--dark .sendbird-accordion {
3382
- border-bottom: 1px solid var(--sendbird-dark-ondark-04);
3383
- background-color: var(--sendbird-dark-background-600); }
3384
- .sendbird-accordion .sendbird-accordion__member {
3385
- position: relative;
3386
- padding: 12px 0px 12px 44px;
3387
- height: 40px;
3388
- box-sizing: border-box; }
3389
- .sendbird-accordion .sendbird-accordion__footer {
3390
- display: flex;
3391
- justify-content: flex-start;
3392
- margin-top: 8px; }
3393
-
3394
- .sendbird-accordion__panel-header {
3395
- cursor: pointer;
3396
- position: relative;
3397
- padding: 12px 22px 10px 56px; }
3398
- .sendbird-theme--light .sendbird-accordion__panel-header {
3399
- background-color: var(--sendbird-light-background-50);
3400
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
3401
- .sendbird-theme--dark .sendbird-accordion__panel-header {
3402
- background-color: var(--sendbird-dark-background-600);
3403
- border-bottom: 1px solid var(--sendbird-dark-ondark-04); }
3404
- .sendbird-accordion__panel-header:focus {
3405
- outline: none; }
3406
- .sendbird-accordion__panel-header.sendbird-accordion__panel-item__disabled {
3407
- cursor: not-allowed; }
3408
-
3409
- .sendbird-accordion__panel-icon-left,
3410
- .sendbird-accordion__panel-icon-right {
3411
- position: absolute;
3412
- top: 10px; }
3413
-
3414
- .sendbird-accordion__panel-icon-left {
3415
- left: 16px; }
3416
-
3417
- .sendbird-accordion__panel-icon-right {
3418
- right: 16px; }
3419
-
3420
- .sendbird-accordion__panel-icon--open {
3421
- transform: rotate(90deg); }
3422
-
3423
- .sendbird-theme--light .sendbird-accordion__panel-icon--chevron path {
3424
- fill: var(--sendbird-light-onlight-01); }
3425
-
3426
- .sendbird-theme--dark .sendbird-accordion__panel-icon--chevron path {
3427
- fill: var(--sendbird-dark-ondark-01); }
3428
-
3429
- .sendbird-theme--light .sendbird-accordion__panel-icon__leave path {
3430
- fill: var(--sendbird-light-error-300); }
3431
-
3432
- .sendbird-theme--dark .sendbird-accordion__panel-icon__leave path {
3433
- fill: var(--sendbird-dark-error-300); }
3434
-
3435
- .sendbird-user-list-item--small {
3436
- display: block;
3437
- position: relative;
3438
- box-sizing: border-box;
3439
- height: 40px; }
3440
- .sendbird-user-list-item--small__avatar {
3441
- cursor: pointer;
3442
- position: absolute;
3443
- top: 10px;
3444
- left: 12px; }
3445
- .sendbird-user-list-item--small .sendbird-muted-avatar {
3446
- position: absolute;
3447
- top: 10px;
3448
- left: 12px;
3449
- z-index: 2;
3450
- pointer-events: none; }
3451
- .sendbird-user-list-item--small__title {
3452
- position: absolute;
3453
- top: 10px;
3454
- left: 54px;
3455
- width: 160px;
3456
- white-space: nowrap;
3457
- overflow: hidden;
3458
- text-overflow: ellipsis; }
3459
- .sendbird-user-list-item--small__subtitle {
3460
- position: absolute;
3461
- top: 23px;
3462
- left: 140px;
3463
- max-width: 237px;
3464
- white-space: nowrap;
3465
- overflow: hidden;
3466
- text-overflow: ellipsis; }
3467
- .sendbird-user-list-item--small__checkbox {
3468
- position: absolute;
3469
- top: 16px;
3470
- right: 16px; }
3471
- .sendbird-user-list-item--small__action {
3472
- display: none;
3473
- position: absolute;
3474
- right: 10px;
3475
- top: 4px; }
3476
- .sendbird-user-list-item--small__operator {
3477
- position: absolute;
3478
- right: 24px;
3479
- top: 10px; }
3480
- .sendbird-theme--light .sendbird-user-list-item--small:hover, .sendbird-theme--light .sendbird-user-list-item--small.sendbird-icon--pressed {
3481
- background-color: var(--sendbird-light-background-100); }
3482
- .sendbird-theme--dark .sendbird-user-list-item--small:hover, .sendbird-theme--dark .sendbird-user-list-item--small.sendbird-icon--pressed {
3483
- background-color: var(--sendbird-dark-background-500); }
3484
- .sendbird-user-list-item--small:hover .sendbird-user-list-item--small__action, .sendbird-user-list-item--small.sendbird-icon--pressed .sendbird-user-list-item--small__action {
3485
- display: block; }
3486
- .sendbird-user-list-item--small:hover .sendbird-user-list-item--small__operator, .sendbird-user-list-item--small.sendbird-icon--pressed .sendbird-user-list-item--small__operator {
3487
- display: none; }
3488
- .sendbird-theme--light .sendbird-user-list-item--small.sendbird-icon--pressed .sendbird-iconbutton {
3489
- background-color: var(--sendbird-light-primary-100); }
3490
- .sendbird-theme--dark .sendbird-user-list-item--small.sendbird-icon--pressed .sendbird-iconbutton {
3491
- background-color: var(--sendbird-dark-background-700); }
3492
-
3493
- .sendbird-message-search-pannel {
3494
- position: relative;
3495
- display: flex;
3496
- flex-direction: column;
3497
- width: 320px;
3498
- height: 100%;
3499
- box-sizing: border-box; }
3500
- .sendbird-theme--light .sendbird-message-search-pannel {
3501
- background-color: var(--sendbird-light-background-50); }
3502
- .sendbird-theme--dark .sendbird-message-search-pannel {
3503
- background-color: var(--sendbird-dark-background-600); }
3504
- .sendbird-message-search-pannel .sendbird-message-search-pannel__header {
3505
- position: relative;
3506
- display: flex;
3507
- width: 100%;
3508
- height: 64px;
3509
- min-height: 64px;
3510
- box-sizing: border-box; }
3511
- .sendbird-theme--light .sendbird-message-search-pannel .sendbird-message-search-pannel__header {
3512
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
3513
- .sendbird-theme--dark .sendbird-message-search-pannel .sendbird-message-search-pannel__header {
3514
- border-bottom: 1px solid var(--sendbird-dark-ondark-04); }
3515
- .sendbird-message-search-pannel .sendbird-message-search-pannel__header .sendbird-message-search-pannel__header__title {
3516
- position: absolute;
3517
- top: 20px;
3518
- left: 24px;
3519
- width: calc(100% - 74px);
3520
- overflow-x: hidden;
3521
- word-break: keep-all;
3522
- text-overflow: ellipsis; }
3523
- .sendbird-message-search-pannel .sendbird-message-search-pannel__header .sendbird-message-search-pannel__header__close-button {
3524
- position: absolute;
3525
- top: 16px;
3526
- right: 16px; }
3527
- .sendbird-message-search-pannel .sendbird-message-search-pannel__input {
3528
- display: flex;
3529
- position: relative;
3530
- padding: 16px;
3531
- box-sizing: border-box; }
3532
- .sendbird-message-search-pannel .sendbird-message-search-pannel__input .sendbird-message-search-pannel__input__container {
3533
- position: relative;
3534
- border-radius: 4px;
3535
- width: 100%;
3536
- height: 44px; }
3537
- .sendbird-theme--light .sendbird-message-search-pannel .sendbird-message-search-pannel__input .sendbird-message-search-pannel__input__container {
3538
- border: 1px solid var(--sendbird-light-onlight-03); }
3539
- .sendbird-theme--dark .sendbird-message-search-pannel .sendbird-message-search-pannel__input .sendbird-message-search-pannel__input__container {
3540
- border: 1px solid var(--sendbird-dark-ondark-03); }
3541
- .sendbird-message-search-pannel .sendbird-message-search-pannel__input .sendbird-message-search-pannel__input__container .sendbird-message-search-pannel__input__container__search-icon {
3542
- position: absolute;
3543
- top: 10px;
3544
- left: 16px; }
3545
- .sendbird-message-search-pannel .sendbird-message-search-pannel__input .sendbird-message-search-pannel__input__container .sendbird-message-search-pannel__input__container__input-area {
3546
- position: absolute;
3547
- top: 14px;
3548
- left: 48px;
3549
- margin: 0px;
3550
- padding: 0px;
3551
- border: 0px;
3552
- outline: none;
3553
- font-size: 14px;
3554
- width: calc(100% - 90px); }
3555
- .sendbird-theme--light .sendbird-message-search-pannel .sendbird-message-search-pannel__input .sendbird-message-search-pannel__input__container .sendbird-message-search-pannel__input__container__input-area {
3556
- color: var(--sendbird-light-onlight-01);
3557
- background-color: var(--sendbird-light-background-50); }
3558
- .sendbird-theme--dark .sendbird-message-search-pannel .sendbird-message-search-pannel__input .sendbird-message-search-pannel__input__container .sendbird-message-search-pannel__input__container__input-area {
3559
- color: var(--sendbird-dark-ondark-01);
3560
- background-color: var(--sendbird-dark-background-600); }
3561
- .sendbird-message-search-pannel .sendbird-message-search-pannel__input .sendbird-message-search-pannel__input__container .sendbird-message-search-pannel__input__container__spinner {
3562
- position: absolute;
3563
- top: 12px;
3564
- right: 12px; }
3565
- .sendbird-message-search-pannel .sendbird-message-search-pannel__input .sendbird-message-search-pannel__input__container .sendbird-message-search-pannel__input__container__reset-input-button {
3566
- position: absolute;
3567
- top: 12px;
3568
- right: 12px; }
3569
- .sendbird-message-search-pannel .sendbird-message-search-pannel__input .sendbird-message-search-pannel__input__container .sendbird-message-search-pannel__input__container__reset-input-button:hover {
3570
- cursor: pointer; }
3571
- .sendbird-message-search-pannel .sendbird-message-search-pannel__message-search {
3572
- position: relative;
3573
- box-sizing: border-box;
3574
- width: 100%;
3575
- height: 100%;
3576
- overflow-y: hidden; }
3577
-
3578
- .sendbird-message-search {
3579
- position: relative;
3580
- height: 100%;
3581
- overflow: scroll; }
3582
- .sendbird-theme--light .sendbird-message-search {
3583
- background-color: var(--sendbird-light-background-50); }
3584
- .sendbird-theme--dark .sendbird-message-search {
3585
- background-color: var(--sendbird-dark-background-600); }
3586
-
3587
- .sendbird-message-search-item {
3588
- display: inline-flex;
3589
- flex-direction: row;
3590
- width: 100%;
3591
- height: 80px;
3592
- position: relative;
3593
- cursor: pointer; }
3594
- .sendbird-theme--light .sendbird-message-search-item {
3595
- border-bottom: 1px solid var(--sendbird-light-onlight-04);
3596
- background-color: var(--sendbird-light-background-50); }
3597
- .sendbird-theme--dark .sendbird-message-search-item {
3598
- border-bottom: 1px solid var(--sendbird-dark-ondark-04);
3599
- background-color: var(--sendbird-dark-background-600); }
3600
- .sendbird-theme--light .sendbird-message-search-item:hover {
3601
- background-color: var(--sendbird-light-background-100); }
3602
- .sendbird-theme--dark .sendbird-message-search-item:hover {
3603
- background-color: var(--sendbird-dark-background-500); }
3604
- .sendbird-message-search-item .sendbird-message-search-item__left {
3605
- display: flex;
3606
- align-items: center;
3607
- justify-content: center;
3608
- width: 90px;
3609
- height: 80px; }
3610
- .sendbird-message-search-item .sendbird-message-search-item__right {
3611
- display: flex;
3612
- flex-direction: column;
3613
- width: calc(100% - 106px); }
3614
- .sendbird-message-search-item .sendbird-message-search-item__right .sendbird-message-search-item__right__sender-name {
3615
- display: flex;
3616
- max-width: 280px;
3617
- height: 16px;
3618
- overflow: hidden;
3619
- text-overflow: ellipsis;
3620
- position: absolute;
3621
- top: 12px; }
3622
- .sendbird-message-search-item .sendbird-message-search-item__right .sendbird-message-search-item__right__message-text {
3623
- box-sizing: border-box;
3624
- display: flex;
3625
- width: inherit;
3626
- height: 32px;
3627
- overflow: hidden;
3628
- text-overflow: ellipsis;
3629
- position: absolute;
3630
- top: 36px;
3631
- word-break: break-word; }
3632
- .sendbird-message-search-item .sendbird-message-search-item__right .sendbird-message-search-item__right__message-created-at {
3633
- position: absolute;
3634
- top: 12px;
3635
- right: 18px; }
3636
- .sendbird-message-search-item .sendbird-message-search-item__right-footer {
3637
- width: 16px; }
3638
-
3639
- .sendbird-theme--light .sendbird-message-search-item.sendbird-message-search-item--selected {
3640
- background-color: var(--sendbird-light-primary-100); }
3641
-
3642
- .sendbird-theme--dark .sendbird-message-search-item.sendbird-message-search-item--selected {
3643
- background-color: var(--sendbird-dark-background-700); }
3644
-
3645
- .sendbird-theme--light .sendbird-message-search-item.sendbird-message-search-item--selected .sendbird-message-search-item__left {
3646
- border-left: 4px solid var(--sendbird-light-primary-300); }
3647
-
3648
- .sendbird-theme--dark .sendbird-message-search-item.sendbird-message-search-item--selected .sendbird-message-search-item__left {
3649
- border-left: 4px solid var(--sendbird-dark-primary-200); }
3650
-
3651
- .sendbird-message-search-file-item {
3652
- position: relative;
3653
- display: inline-flex;
3654
- flex-direction: row;
3655
- width: 100%;
3656
- height: 80px;
3657
- cursor: pointer; }
3658
- .sendbird-theme--light .sendbird-message-search-file-item {
3659
- border-bottom: 1px solid var(--sendbird-light-onlight-04);
3660
- background-color: var(--sendbird-light-background-50); }
3661
- .sendbird-theme--dark .sendbird-message-search-file-item {
3662
- border-bottom: 1px solid var(--sendbird-dark-ondark-04);
3663
- background-color: var(--sendbird-dark-background-600); }
3664
- .sendbird-theme--light .sendbird-message-search-file-item:hover {
3665
- background-color: var(--sendbird-light-background-100); }
3666
- .sendbird-theme--dark .sendbird-message-search-file-item:hover {
3667
- background-color: var(--sendbird-dark-background-500); }
3668
- .sendbird-message-search-file-item .sendbird-message-search-file-item__left {
3669
- position: relative;
3670
- display: flex;
3671
- align-items: center;
3672
- justify-content: center;
3673
- width: 90px;
3674
- height: 80px; }
3675
- .sendbird-message-search-file-item .sendbird-message-search-file-item__right {
3676
- position: relative;
3677
- display: flex;
3678
- flex-direction: column;
3679
- width: calc(100% - 106px); }
3680
- .sendbird-message-search-file-item .sendbird-message-search-file-item__right .sendbird-message-search-file-item__right__sender-name {
3681
- position: absolute;
3682
- top: 12px;
3683
- display: flex;
3684
- max-width: 280px;
3685
- height: 16px;
3686
- overflow: hidden;
3687
- text-overflow: ellipsis; }
3688
- .sendbird-message-search-file-item .sendbird-message-search-file-item__right .sendbird-message-search-file-item__right__content {
3689
- position: absolute;
3690
- top: 36px;
3691
- box-sizing: border-box;
3692
- width: 100%;
3693
- height: 32px;
3694
- display: flex;
3695
- flex-direction: row;
3696
- align-items: center; }
3697
- .sendbird-message-search-file-item .sendbird-message-search-file-item__right .sendbird-message-search-file-item__right__content .sendbird-message-search-file-item__right__content__type-icon {
3698
- position: relative;
3699
- margin-right: 4px;
3700
- display: flex;
3701
- align-items: center;
3702
- justify-content: center;
3703
- width: 26px;
3704
- min-width: 26px;
3705
- height: 26px;
3706
- border-radius: 8px; }
3707
- .sendbird-theme--light .sendbird-message-search-file-item .sendbird-message-search-file-item__right .sendbird-message-search-file-item__right__content .sendbird-message-search-file-item__right__content__type-icon {
3708
- background-color: var(--sendbird-light-background-100); }
3709
- .sendbird-theme--dark .sendbird-message-search-file-item .sendbird-message-search-file-item__right .sendbird-message-search-file-item__right__content .sendbird-message-search-file-item__right__content__type-icon {
3710
- background-color: var(--sendbird-dark-background-500); }
3711
- .sendbird-message-search-file-item .sendbird-message-search-file-item__right .sendbird-message-search-file-item__right__content .sendbird-message-search-file-item__right__content__url {
3712
- height: 16px;
3713
- position: relative;
3714
- display: flex;
3715
- overflow: hidden;
3716
- text-overflow: ellipsis;
3717
- word-break: keep-all;
3718
- white-space: nowrap; }
3719
- .sendbird-message-search-file-item .sendbird-message-search-file-item__message-created-at {
3720
- position: absolute;
3721
- top: 12px;
3722
- right: 18px; }
3723
- .sendbird-message-search-file-item .sendbird-message-search-file-item__right-footer {
3724
- width: 16px; }
3725
-
3726
- .sendbird-theme--light .sendbird-message-search-file-item.sendbird-message-search-file-item--selected {
3727
- background-color: var(--sendbird-light-primary-100); }
3728
-
3729
- .sendbird-theme--dark .sendbird-message-search-file-item.sendbird-message-search-file-item--selected {
3730
- background-color: var(--sendbird-dark-background-700); }
3731
-
3732
- .sendbird-theme--light .sendbird-message-search-file-item.sendbird-message-search-file-item--selected .sendbird-message-search-file-item__left {
3733
- border-left: 4px solid var(--sendbird-light-primary-300); }
3734
-
3735
- .sendbird-theme--dark .sendbird-message-search-file-item.sendbird-message-search-file-item--selected .sendbird-message-search-file-item__left {
3736
- border-left: 4px solid var(--sendbird-dark-primary-200); }
3737
-
3738
- .sendbird-app__wrap {
3739
- width: 100%;
3740
- height: 100%;
3741
- display: flex;
3742
- box-sizing: border-box; }
3743
- .sendbird-app__wrap .sendbird-app__searchpanel-wrap {
3744
- width: 320px;
3745
- overflow-y: scroll;
3746
- box-sizing: border-box; }
3747
- .sendbird-theme--light .sendbird-app__wrap .sendbird-app__searchpanel-wrap {
3748
- border-top: 1px solid var(--sendbird-light-onlight-04);
3749
- border-right: 1px solid var(--sendbird-light-onlight-04);
3750
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
3751
- .sendbird-theme--dark .sendbird-app__wrap .sendbird-app__searchpanel-wrap {
3752
- border-top: 1px solid var(--sendbird-dark-background-600);
3753
- border-right: 1px solid var(--sendbird-dark-background-600);
3754
- border-bottom: 1px solid var(--sendbird-dark-background-600); }
3755
- .sendbird-app__wrap .sendbird-app__conversation-wrap {
3756
- flex: 1;
3757
- position: relative;
3758
- width: calc(100% - 320px); }
3759
- .sendbird-app__wrap .sendbird-app__channellist-wrap {
3760
- max-width: 320px; }
3761
- .sendbird-theme--light .sendbird-app__wrap .sendbird-app__channellist-wrap {
3762
- border-top: 1px solid var(--sendbird-light-onlight-04);
3763
- border-left: 1px solid var(--sendbird-light-onlight-04);
3764
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
3765
- .sendbird-theme--dark .sendbird-app__wrap .sendbird-app__channellist-wrap {
3766
- border-top: 1px solid var(--sendbird-dark-background-600);
3767
- border-left: 1px solid var(--sendbird-dark-background-600);
3768
- border-bottom: 1px solid var(--sendbird-dark-background-600); }
3769
- .sendbird-theme--light .sendbird-app__wrap .sendbird-app__conversation--settings-open .sendbird-chat-header__info {
3770
- background-color: var(--sendbird-light-primary-100); }
3771
- .sendbird-theme--dark .sendbird-app__wrap .sendbird-app__conversation--settings-open .sendbird-chat-header__info {
3772
- background-color: var(--sendbird-dark-background-700); }
3773
- .sendbird-app__wrap .sendbird-chat-header__search {
3774
- margin-right: 16px; }
3775
- .sendbird-theme--light .sendbird-app__wrap .sendbird-app__conversation--search-open .sendbird-chat-header__search {
3776
- background-color: var(--sendbird-light-primary-100); }
3777
- .sendbird-theme--dark .sendbird-app__wrap .sendbird-app__conversation--search-open .sendbird-chat-header__search {
3778
- background-color: var(--sendbird-dark-background-700); }
3779
- .sendbird-app__wrap .sendbird-channel-settings {
3780
- border-left: none; }
3781
- .sendbird-theme--light .sendbird-app__wrap .sendbird-channel-settings {
3782
- border-top: 1px solid var(--sendbird-light-onlight-04);
3783
- border-right: 1px solid var(--sendbird-light-onlight-04);
3784
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
3785
- .sendbird-theme--dark .sendbird-app__wrap .sendbird-channel-settings {
3786
- border-top: 1px solid var(--sendbird-dark-background-600);
3787
- border-right: 1px solid var(--sendbird-dark-background-600);
3788
- border-bottom: 1px solid var(--sendbird-dark-background-600); }
3789
- .sendbird-app__wrap .sendbird-channel-settings .sendbird-channel-settings__header {
3790
- height: 64px; }
3791
-
3792
- .sendbird-openchannel-conversation {
3793
- position: relative;
3794
- display: flex;
3795
- flex-direction: column;
3796
- height: 100%;
3797
- width: 100%; }
3798
- .sendbird-theme--light .sendbird-openchannel-conversation {
3799
- background-color: var(--sendbird-light-background-50); }
3800
- .sendbird-theme--dark .sendbird-openchannel-conversation {
3801
- background-color: var(--sendbird-dark-background-600); }
3802
- .sendbird-openchannel-conversation .sendbird-openchannel-conversation-scroll {
3803
- overflow-y: auto;
3804
- flex: 1 1 0;
3805
- order: 2;
3806
- width: 100%; }
3807
- .sendbird-openchannel-conversation .sendbird-openchannel-footer {
3808
- order: 3;
3809
- padding: 12px 24px 24px 24px; }
3810
- .sendbird-openchannel-conversation .sendbird-openchannel-conversation-scroll-container {
3811
- display: flex;
3812
- height: 100%;
3813
- overflow-y: auto;
3814
- overflow-x: hidden;
3815
- flex-direction: column; }
3816
- .sendbird-openchannel-conversation .sendbird-openchannel-conversation-scroll-container .sendbird-openchannel-conversation-scroll-padding {
3817
- flex: 1 1 0; }
3818
-
3819
-
3820
- .sendbird-frozen-channel-notification {
3821
- position: relative;
3822
- margin-top: 8px;
3823
- margin-right: 24px;
3824
- margin-left: 24px;
3825
- height: 32px;
3826
- display: flex;
3827
- align-items: center;
3828
- justify-content: center;
3829
- border-radius: 4px; }
3830
- .sendbird-theme--light .sendbird-frozen-channel-notification {
3831
- background-color: var(--sendbird-light-information-100); }
3832
- .sendbird-theme--dark .sendbird-frozen-channel-notification {
3833
- background-color: var(--sendbird-dark-information-100); }
3834
-
3835
- .sendbird-openchannel-conversation-header {
3836
- position: relative;
3837
- min-height: 64px;
3838
- box-sizing: border-box; }
3839
- .sendbird-theme--light .sendbird-openchannel-conversation-header {
3840
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
3841
- .sendbird-theme--dark .sendbird-openchannel-conversation-header {
3842
- border-bottom: 1px solid var(--sendbird-dark-ondark-04); }
3843
- .sendbird-openchannel-conversation-header .sendbird-openchannel-conversation-header__left__title {
3844
- white-space: nowrap;
3845
- overflow-x: hidden;
3846
- text-overflow: ellipsis;
3847
- max-width: calc(100% - 120px); }
3848
- .sendbird-openchannel-conversation-header__left [class*=sendbird-openchannel-conversation-header__left__cover-image] {
3849
- position: absolute;
3850
- left: 20px;
3851
- top: 16px; }
3852
- .sendbird-openchannel-conversation-header__left__title {
3853
- position: absolute;
3854
- left: 60px;
3855
- top: 12px; }
3856
- .sendbird-openchannel-conversation-header__left__sub-title {
3857
- position: absolute;
3858
- left: 60px;
3859
- top: 36px; }
3860
- .sendbird-openchannel-conversation-header__right {
3861
- position: absolute;
3862
- top: 0px;
3863
- right: 0px;
3864
- width: 64px;
3865
- height: 64px; }
3866
- .sendbird-openchannel-conversation-header__right__trigger {
3867
- position: absolute;
3868
- top: 16px;
3869
- right: 16px;
3870
- display: flex;
3871
- align-items: center;
3872
- justify-content: center; }
3873
-
3874
- .sendbird-openchannel-conversation-header__left__cover-image--icon {
3875
- display: flex;
3876
- justify-content: center;
3877
- align-items: center;
3878
- border-radius: 50%; }
3879
- .sendbird-theme--light .sendbird-openchannel-conversation-header__left__cover-image--icon {
3880
- background-color: var(--sendbird-light-background-300); }
3881
- .sendbird-theme--dark .sendbird-openchannel-conversation-header__left__cover-image--icon {
3882
- background-color: var(--sendbird-dark-background-300); }
3883
-
3884
- .sendbird-openchannel-conversation-scroll {
3885
- position: relative;
3886
- width: 100%; }
3887
- .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container {
3888
- position: -webkit-sticky;
3889
- position: sticky;
3890
- width: 100%;
3891
- bottom: 0px;
3892
- height: 100%; }
3893
- .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__padding {
3894
- height: 8px; }
3895
- .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__scroll-bottom-button {
3896
- position: -webkit-sticky;
3897
- position: sticky;
3898
- display: flex;
3899
- align-items: center;
3900
- justify-content: center;
3901
- bottom: 8px;
3902
- left: calc(50% - 20px);
3903
- width: 40px;
3904
- height: 40px;
3905
- border-radius: 24px;
3906
- z-index: 1; }
3907
- .sendbird-theme--light .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__scroll-bottom-button {
3908
- background-color: var(--sendbird-light-primary-300);
3909
- box-shadow: var(--sendbird-light-shadow-05); }
3910
- .sendbird-theme--dark .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__scroll-bottom-button {
3911
- background-color: var(--sendbird-dark-primary-200);
3912
- box-shadow: var(--sendbird-dark-shadow-05); }
3913
- .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__scroll-bottom-button:hover {
3914
- cursor: pointer; }
3915
- .sendbird-theme--light .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__scroll-bottom-button:hover {
3916
- background-color: var(--sendbird-light-primary-400); }
3917
- .sendbird-theme--dark .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__scroll-bottom-button:hover {
3918
- background-color: var(--sendbird-dark-primary-300); }
3919
- .sendbird-theme--light .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__scroll-bottom-button:active {
3920
- background-color: var(--sendbird-light-primary-500); }
3921
- .sendbird-theme--dark .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__scroll-bottom-button:active {
3922
- background-color: var(--sendbird-dark-primary-400); }
3923
- .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__item-container--no-messages {
3924
- width: 100%;
3925
- height: calc(100% - 8px); }
3926
- .sendbird-openchannel-conversation-scroll .sendbird-openchannel-conversation-scroll__container .sendbird-openchannel-conversation-scroll__container__item-container--no-messages .sendbird-openchannel-conversation-scroll__container__place-holder {
3927
- width: 100%;
3928
- height: 100%; }
3929
-
3930
- .sendbird-openchannel-user-message {
3931
- position: relative;
3932
- display: flex;
3933
- flex-direction: row;
3934
- width: 100%; }
3935
- .sendbird-theme--light .sendbird-openchannel-user-message:hover {
3936
- background-color: var(--sendbird-light-background-100); }
3937
- .sendbird-theme--dark .sendbird-openchannel-user-message:hover {
3938
- background-color: var(--sendbird-dark-background-400); }
3939
- .sendbird-openchannel-user-message:hover .sendbird-openchannel-user-message__context-menu {
3940
- display: block; }
3941
- .sendbird-openchannel-user-message .sendbird-openchannel-user-message__left {
3942
- position: relative;
3943
- display: flex;
3944
- width: 52px;
3945
- min-width: 52px; }
3946
- .sendbird-openchannel-user-message .sendbird-openchannel-user-message__left .sendbird-openchannel-user-message__left__avatar {
3947
- position: relative;
3948
- display: flex;
3949
- margin-top: 8px;
3950
- margin-left: 24px; }
3951
- .sendbird-openchannel-user-message .sendbird-openchannel-user-message__right {
3952
- position: relative;
3953
- display: flex;
3954
- flex-direction: column;
3955
- width: 100%;
3956
- margin: 8px 24px 8px 12px; }
3957
- .sendbird-openchannel-user-message .sendbird-openchannel-user-message__right .sendbird-openchannel-user-message__right__top {
3958
- position: relative;
3959
- display: flex;
3960
- margin-bottom: 2px; }
3961
- .sendbird-openchannel-user-message .sendbird-openchannel-user-message__right .sendbird-openchannel-user-message__right__top .sendbird-openchannel-user-message__right__top__sender-name {
3962
- position: relative;
3963
- display: flex; }
3964
- .sendbird-openchannel-user-message .sendbird-openchannel-user-message__right .sendbird-openchannel-user-message__right__top .sendbird-openchannel-user-message__right__top__sent-at {
3965
- position: relative;
3966
- display: flex;
3967
- margin-left: 4px; }
3968
- .sendbird-openchannel-user-message .sendbird-openchannel-user-message__right .sendbird-openchannel-user-message__right__bottom {
3969
- position: relative;
3970
- display: flex;
3971
- width: 100%; }
3972
- .sendbird-openchannel-user-message .sendbird-openchannel-user-message__right .sendbird-openchannel-user-message__right__bottom .sendbird-openchannel-user-message__right__bottom__message {
3973
- position: relative;
3974
- word-break: break-all; }
3975
- .sendbird-openchannel-user-message .sendbird-openchannel-user-message__right .sendbird-openchannel-user-message__right__tail {
3976
- position: relative;
3977
- top: 2px; }
3978
- .sendbird-openchannel-user-message .sendbird-openchannel-user-message__context-menu {
3979
- position: absolute;
3980
- right: 16px;
3981
- display: none; }
3982
- .sendbird-theme--light .sendbird-openchannel-user-message .sendbird-openchannel-user-message__context-menu .sendbird-openchannel-user-message__context-menu--icon {
3983
- background-color: var(--sendbird-light-background-200); }
3984
- .sendbird-theme--dark .sendbird-openchannel-user-message .sendbird-openchannel-user-message__context-menu .sendbird-openchannel-user-message__context-menu--icon {
3985
- background-color: var(--sendbird-dark-background-500); }
3986
- .sendbird-theme--light .sendbird-openchannel-user-message .sendbird-openchannel-user-message__context-menu .sendbird-openchannel-user-message__context-menu--icon:hover {
3987
- background-color: var(--sendbird-light-primary-100); }
3988
- .sendbird-theme--dark .sendbird-openchannel-user-message .sendbird-openchannel-user-message__context-menu .sendbird-openchannel-user-message__context-menu--icon:hover {
3989
- background-color: var(--sendbird-dark-background-700); }
3990
-
3991
- .sendbird-openchannel-admin-message {
3992
- position: relative;
3993
- margin: 16px 24px;
3994
- padding: 12px 16px;
3995
- border-radius: 4px; }
3996
- .sendbird-theme--light .sendbird-openchannel-admin-message {
3997
- background-color: var(--sendbird-light-background-100); }
3998
- .sendbird-theme--dark .sendbird-openchannel-admin-message {
3999
- background-color: var(--sendbird-dark-background-500); }
4000
- .sendbird-theme--light .sendbird-openchannel-admin-message:hover {
4001
- background-color: var(--sendbird-light-background-100); }
4002
- .sendbird-theme--dark .sendbird-openchannel-admin-message:hover {
4003
- background-color: var(--sendbird-dark-background-400); }
4004
- .sendbird-openchannel-admin-message .sendbird-openchannel-admin-message__text {
4005
- word-wrap: break-word; }
4006
-
4007
- .sendbird-openchannel-og-message {
4008
- position: relative;
4009
- display: flex;
4010
- flex-direction: column;
4011
- width: 100%; }
4012
- .sendbird-theme--light .sendbird-openchannel-og-message:hover {
4013
- background-color: var(--sendbird-light-background-100); }
4014
- .sendbird-theme--dark .sendbird-openchannel-og-message:hover {
4015
- background-color: var(--sendbird-dark-background-400); }
4016
- .sendbird-openchannel-og-message:hover .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__context-menu {
4017
- display: block; }
4018
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top {
4019
- box-sizing: border-box;
4020
- position: relative;
4021
- display: flex;
4022
- flex-direction: row; }
4023
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__left {
4024
- position: relative;
4025
- display: flex;
4026
- width: 52px;
4027
- min-width: 52px; }
4028
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__left .sendbird-openchannel-og-message__top__left__avatar {
4029
- position: absolute;
4030
- display: flex;
4031
- top: 8px;
4032
- left: 24px; }
4033
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__right {
4034
- position: relative;
4035
- display: flex;
4036
- box-sizing: border-box;
4037
- flex-direction: column;
4038
- margin: 8px 24px 8px 12px; }
4039
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__right .sendbird-openchannel-og-message__top__right__title {
4040
- position: relative;
4041
- display: flex;
4042
- margin-bottom: 2px; }
4043
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__right .sendbird-openchannel-og-message__top__right__title .sendbird-openchannel-og-message__top__right__title__sender-name {
4044
- position: relative;
4045
- display: flex; }
4046
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__right .sendbird-openchannel-og-message__top__right__title .sendbird-openchannel-og-message__top__right__title__sent-at {
4047
- position: relative;
4048
- display: flex;
4049
- margin-left: 4px; }
4050
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__right .sendbird-openchannel-og-message__top__right__description .sendbird-openchannel-og-message__top__right__description__message {
4051
- position: relative;
4052
- display: inline;
4053
- white-space: pre-wrap;
4054
- word-break: break-all; }
4055
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__context-menu {
4056
- position: absolute;
4057
- right: 16px;
4058
- display: none; }
4059
- .sendbird-theme--light .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__context-menu .sendbird-openchannel-og-message__top__context-menu--icon {
4060
- background-color: var(--sendbird-light-background-200); }
4061
- .sendbird-theme--dark .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__context-menu .sendbird-openchannel-og-message__top__context-menu--icon {
4062
- background-color: var(--sendbird-dark-background-500); }
4063
- .sendbird-theme--light .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__context-menu .sendbird-openchannel-og-message__top__context-menu--icon:hover {
4064
- background-color: var(--sendbird-light-primary-100); }
4065
- .sendbird-theme--dark .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top .sendbird-openchannel-og-message__top__context-menu .sendbird-openchannel-og-message__top__context-menu--icon:hover {
4066
- background-color: var(--sendbird-dark-background-700); }
4067
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom {
4068
- position: relative;
4069
- display: inline;
4070
- margin-bottom: 8px;
4071
- width: 100%; }
4072
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag {
4073
- position: relative;
4074
- display: inline-block;
4075
- box-sizing: border-box;
4076
- width: calc(100% - 64px);
4077
- max-width: 360px;
4078
- left: 64px;
4079
- padding: 12px 12px 4px 12px;
4080
- border-radius: 8px; }
4081
- .sendbird-theme--light .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag {
4082
- border: solid 1px var(--sendbird-light-onlight-04);
4083
- background-color: var(--sendbird-light-background-100); }
4084
- .sendbird-theme--dark .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag {
4085
- border: solid 1px var(--sendbird-dark-ondark-04);
4086
- background-color: var(--sendbird-dark-background-500); }
4087
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag .sendbird-openchannel-og-message__bottom__og-tag__url {
4088
- position: relative;
4089
- display: block;
4090
- white-space: nowrap;
4091
- overflow: hidden;
4092
- text-overflow: ellipsis;
4093
- margin-bottom: 8px;
4094
- max-width: 336px; }
4095
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag .sendbird-openchannel-og-message__bottom__og-tag__title {
4096
- position: relative;
4097
- display: inline-block;
4098
- white-space: pre-wrap;
4099
- overflow-wrap: normal;
4100
- margin-bottom: 8px;
4101
- max-width: 336px; }
4102
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag .sendbird-openchannel-og-message__bottom__og-tag__title:hover {
4103
- cursor: pointer; }
4104
- .sendbird-theme--light .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag .sendbird-openchannel-og-message__bottom__og-tag__title:hover {
4105
- color: var(--sendbird-light-primary-300); }
4106
- .sendbird-theme--dark .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag .sendbird-openchannel-og-message__bottom__og-tag__title:hover {
4107
- color: var(--sendbird-dark-primary-200); }
4108
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag .sendbird-openchannel-og-message__bottom__og-tag__description {
4109
- position: relative;
4110
- display: block;
4111
- white-space: pre-wrap;
4112
- overflow: hidden;
4113
- text-overflow: ellipsis;
4114
- word-break: break-all;
4115
- max-height: 32px;
4116
- margin-bottom: 8px;
4117
- width: 100%;
4118
- max-width: 336px; }
4119
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag .sendbird-openchannel-og-message__bottom__og-tag__thumbnail {
4120
- box-sizing: border-box;
4121
- position: relative;
4122
- display: block;
4123
- margin-top: 4px;
4124
- margin-bottom: 8px;
4125
- width: 100%; }
4126
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag .sendbird-openchannel-og-message__bottom__og-tag__thumbnail:hover {
4127
- cursor: pointer; }
4128
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag .sendbird-openchannel-og-message__bottom__og-tag__thumbnail .sendbird-openchannel-og-message__bottom__og-tag__thumbnail__image {
4129
- border-radius: 8px;
4130
- width: 100%;
4131
- min-width: 200px;
4132
- max-width: 336px; }
4133
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__bottom .sendbird-openchannel-og-message__bottom__og-tag .sendbird-openchannel-og-message__bottom__og-tag__thumbnail .sendbird-openchannel-og-message__bottom__og-tag__thumbnail__image--placeholder {
4134
- border-radius: 8px;
4135
- width: 100%;
4136
- min-width: 200px;
4137
- max-width: 336px; }
4138
- .sendbird-openchannel-og-message .sendbird-openchannel-og-message__top__right__tail {
4139
- position: relative;
4140
- left: 64px;
4141
- top: 2px; }
4142
-
4143
- .sendbird-openchannel-og-message--word {
4144
- display: inline;
4145
- margin: 0px 2px;
4146
- word-break: break-all; }
4147
-
4148
- .sendbird-theme--light .sendbird-openchannel-og-message--word--link {
4149
- color: var(--sendbird-light-primary-300); }
4150
-
4151
- .sendbird-theme--dark .sendbird-openchannel-og-message--word--link {
4152
- color: var(--sendbird-dark-primary-200); }
4153
-
4154
- .sendbird-openchannel-thumbnail-message {
4155
- position: relative;
4156
- display: flex;
4157
- flex-direction: row; }
4158
- .sendbird-theme--light .sendbird-openchannel-thumbnail-message:hover {
4159
- background-color: var(--sendbird-light-background-100); }
4160
- .sendbird-theme--dark .sendbird-openchannel-thumbnail-message:hover {
4161
- background-color: var(--sendbird-dark-background-400); }
4162
- .sendbird-openchannel-thumbnail-message:hover .sendbird-openchannel-thumbnail-message__context-menu {
4163
- display: block; }
4164
- .sendbird-theme--light .sendbird-openchannel-thumbnail-message:hover .sendbird-openchannel-thumbnail-message__context-menu .sendbird-openchannel-thumbnail-message__context-menu--icon {
4165
- background-color: var(--sendbird-light-background-200); }
4166
- .sendbird-theme--dark .sendbird-openchannel-thumbnail-message:hover .sendbird-openchannel-thumbnail-message__context-menu .sendbird-openchannel-thumbnail-message__context-menu--icon {
4167
- background-color: var(--sendbird-dark-background-500); }
4168
- .sendbird-theme--light .sendbird-openchannel-thumbnail-message:hover .sendbird-openchannel-thumbnail-message__context-menu .sendbird-openchannel-thumbnail-message__context-menu--icon:hover {
4169
- background-color: var(--sendbird-light-primary-100); }
4170
- .sendbird-theme--dark .sendbird-openchannel-thumbnail-message:hover .sendbird-openchannel-thumbnail-message__context-menu .sendbird-openchannel-thumbnail-message__context-menu--icon:hover {
4171
- background-color: var(--sendbird-dark-background-700); }
4172
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__left {
4173
- position: relative;
4174
- display: flex;
4175
- width: 52px;
4176
- min-width: 52px; }
4177
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__left .sendbird-openchannel-thumbnail-message__left__avatar {
4178
- position: absolute;
4179
- display: inline;
4180
- margin-top: 8px;
4181
- margin-left: 28px; }
4182
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right {
4183
- position: relative;
4184
- display: flex;
4185
- flex-direction: column;
4186
- margin-top: 8px;
4187
- margin-bottom: 8px;
4188
- margin-left: 12px;
4189
- width: calc(100% - 64px); }
4190
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__title {
4191
- position: relative;
4192
- display: inline;
4193
- margin-bottom: 4px; }
4194
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__title .sendbird-openchannel-thumbnail-message__right__title__sender-name {
4195
- position: relative;
4196
- display: inline;
4197
- margin-right: 4px; }
4198
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__title .sendbird-openchannel-thumbnail-message__right__title__sent-at {
4199
- position: relative;
4200
- display: inline; }
4201
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body {
4202
- position: relative;
4203
- display: flex;
4204
- border-radius: 8px; }
4205
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body:hover .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__overlay {
4206
- opacity: 1; }
4207
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap {
4208
- position: relative;
4209
- box-sizing: content-box; }
4210
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__overlay {
4211
- position: absolute;
4212
- opacity: 0;
4213
- width: 100%;
4214
- height: 100%;
4215
- max-width: 360px;
4216
- top: 0px;
4217
- left: 0px;
4218
- border-radius: 8px;
4219
- cursor: pointer; }
4220
- .sendbird-theme--light .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__overlay {
4221
- background-color: var(--sendbird-light-overlay-02); }
4222
- .sendbird-theme--dark .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__overlay {
4223
- background-color: var(--sendbird-dark-overlay-02); }
4224
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__video {
4225
- max-width: 360px;
4226
- max-height: 360px; }
4227
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__video:hover {
4228
- cursor: pointer; }
4229
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__video .sendbird-openchannel-thumbnail-message__right__body__wrap__video__video {
4230
- max-width: 360px;
4231
- max-height: 360px;
4232
- border-radius: 8px; }
4233
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__video .sendbird-openchannel-thumbnail-message__right__body__wrap__video__icon {
4234
- position: absolute;
4235
- top: calc(50% - 28px);
4236
- left: calc(50% - 28px); }
4237
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__video--icon {
4238
- padding: 107px 152px 107px 152px;
4239
- border-radius: 8px; }
4240
- .sendbird-theme--light .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__video--icon {
4241
- background-color: var(--sendbird-light-background-100); }
4242
- .sendbird-theme--dark .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__video--icon {
4243
- background-color: var(--sendbird-dark-background-500); }
4244
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__image {
4245
- border-radius: 8px; }
4246
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__image--icon {
4247
- padding: 107px 152px 107px 152px;
4248
- border-radius: 8px; }
4249
- .sendbird-theme--light .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__image--icon {
4250
- background-color: var(--sendbird-light-background-100); }
4251
- .sendbird-theme--dark .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__image--icon {
4252
- background-color: var(--sendbird-dark-background-500); }
4253
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__unknown {
4254
- padding: 107px 152px 107px 152px;
4255
- border-radius: 8px; }
4256
- .sendbird-theme--light .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__unknown {
4257
- background-color: var(--sendbird-light-background-100); }
4258
- .sendbird-theme--dark .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__body .sendbird-openchannel-thumbnail-message__right__body__wrap .sendbird-openchannel-thumbnail-message__right__body__wrap__unknown {
4259
- background-color: var(--sendbird-dark-background-500); }
4260
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__right .sendbird-openchannel-thumbnail-message__right__tail {
4261
- position: relative;
4262
- top: 2px; }
4263
- .sendbird-openchannel-thumbnail-message .sendbird-openchannel-thumbnail-message__context-menu {
4264
- position: absolute;
4265
- display: none;
4266
- top: 8px;
4267
- right: 16px; }
4268
-
4269
- .sendbird-openchannel-file-message {
4270
- position: relative;
4271
- display: flex;
4272
- flex-direction: row; }
4273
- .sendbird-theme--light .sendbird-openchannel-file-message:hover {
4274
- background-color: var(--sendbird-light-background-100); }
4275
- .sendbird-theme--dark .sendbird-openchannel-file-message:hover {
4276
- background-color: var(--sendbird-dark-background-400); }
4277
- .sendbird-openchannel-file-message:hover .sendbird-openchannel-file-message__context-menu {
4278
- display: block; }
4279
- .sendbird-openchannel-file-message .sendbird-openchannel-file-message__left {
4280
- position: relative;
4281
- display: flex;
4282
- width: 52px;
4283
- min-width: 52px; }
4284
- .sendbird-openchannel-file-message .sendbird-openchannel-file-message__left .sendbird-openchannel-file-message__left__avatar {
4285
- position: absolute;
4286
- display: block;
4287
- margin-top: 8px;
4288
- margin-left: 24px; }
4289
- .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right {
4290
- position: relative;
4291
- display: flex;
4292
- flex-direction: column;
4293
- margin-left: 12px;
4294
- margin-bottom: 4px; }
4295
- .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right .sendbird-openchannel-file-message__right__title {
4296
- position: relative;
4297
- display: flex;
4298
- margin-top: 8px; }
4299
- .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right .sendbird-openchannel-file-message__right__title .sendbird-openchannel-file-message__right__title__sender-name {
4300
- position: relative;
4301
- display: flex; }
4302
- .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right .sendbird-openchannel-file-message__right__title .sendbird-openchannel-file-message__right__title__sent-at {
4303
- position: relative;
4304
- display: flex;
4305
- margin-left: 4px; }
4306
- .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right .sendbird-openchannel-file-message__right__body {
4307
- position: relative;
4308
- display: flex;
4309
- margin-top: 4px;
4310
- margin-bottom: 4px;
4311
- border-radius: 8px; }
4312
- .sendbird-theme--light .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right .sendbird-openchannel-file-message__right__body {
4313
- background-color: var(--sendbird-light-background-100);
4314
- border: solid 1px var(--sendbird-light-onlight-04); }
4315
- .sendbird-theme--dark .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right .sendbird-openchannel-file-message__right__body {
4316
- background-color: var(--sendbird-dark-background-500);
4317
- border: solid 1px var(--sendbird-dark-ondark-04); }
4318
- .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right .sendbird-openchannel-file-message__right__body .sendbird-openchannel-file-message__right__body__icon {
4319
- position: relative;
4320
- display: inline-block;
4321
- margin: 8px;
4322
- border-radius: 8.6px; }
4323
- .sendbird-theme--light .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right .sendbird-openchannel-file-message__right__body .sendbird-openchannel-file-message__right__body__icon {
4324
- background-color: var(--sendbird-light-background-50); }
4325
- .sendbird-theme--dark .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right .sendbird-openchannel-file-message__right__body .sendbird-openchannel-file-message__right__body__icon {
4326
- background-color: var(--sendbird-dark-background-600); }
4327
- .sendbird-openchannel-file-message .sendbird-openchannel-file-message__right .sendbird-openchannel-file-message__right__body .sendbird-openchannel-file-message__right__body__file-name {
4328
- position: relative;
4329
- display: flex;
4330
- margin-top: 22px;
4331
- margin-right: 16px;
4332
- margin-left: 4px;
4333
- overflow: hidden;
4334
- height: 20px;
4335
- max-height: 20px;
4336
- text-overflow: ellipsis; }
4337
- .sendbird-openchannel-file-message .sendbird-openchannel-file-message__context-menu {
4338
- position: absolute;
4339
- display: none;
4340
- top: 8px;
4341
- right: 16px; }
4342
- .sendbird-theme--light .sendbird-openchannel-file-message .sendbird-openchannel-file-message__context-menu .sendbird-openchannel-file-message__context-menu__icon {
4343
- background-color: var(--sendbird-light-background-200); }
4344
- .sendbird-theme--dark .sendbird-openchannel-file-message .sendbird-openchannel-file-message__context-menu .sendbird-openchannel-file-message__context-menu__icon {
4345
- background-color: var(--sendbird-dark-background-500); }
4346
- .sendbird-theme--light .sendbird-openchannel-file-message .sendbird-openchannel-file-message__context-menu .sendbird-openchannel-file-message__context-menu__icon:hover {
4347
- background-color: var(--sendbird-light-primary-100); }
4348
- .sendbird-theme--dark .sendbird-openchannel-file-message .sendbird-openchannel-file-message__context-menu .sendbird-openchannel-file-message__context-menu__icon:hover {
4349
- background-color: var(--sendbird-dark-background-700); }
4350
-
4351
- .sendbird-fileviewer__header__right__actions__download,
4352
- .sendbird-fileviewer__header__right__actions__delete,
4353
- .sendbird-fileviewer__header__right__actions__close {
4354
- width: 64px;
4355
- padding: 21px;
4356
- box-sizing: border-box;
4357
- cursor: pointer; }
4358
- .sendbird-fileviewer__header__right__actions__download .disabled,
4359
- .sendbird-fileviewer__header__right__actions__delete .disabled,
4360
- .sendbird-fileviewer__header__right__actions__close .disabled {
4361
- cursor: not-allowed; }
4362
-
4363
- .sendbird-fileviewer {
4364
- width: 100%;
4365
- height: 100%;
4366
- position: fixed;
4367
- top: 0;
4368
- left: 0;
4369
- z-index: 100000; }
4370
- .sendbird-theme--light .sendbird-fileviewer {
4371
- background-color: var(--sendbird-light-background-50); }
4372
- .sendbird-theme--dark .sendbird-fileviewer {
4373
- background-color: var(--sendbird-dark-background-600); }
4374
- .sendbird-fileviewer .sendbird-fileviewer__header {
4375
- height: 64px;
4376
- min-height: 64px;
4377
- box-sizing: border-box;
4378
- display: flex;
4379
- justify-content: space-between; }
4380
- .sendbird-theme--light .sendbird-fileviewer .sendbird-fileviewer__header {
4381
- border-bottom: 1px solid var(--sendbird-light-onlight-04); }
4382
- .sendbird-theme--dark .sendbird-fileviewer .sendbird-fileviewer__header {
4383
- border-bottom: 1px solid var(--sendbird-dark-ondark-04); }
4384
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__left {
4385
- box-sizing: border-box;
4386
- display: flex;
4387
- flex-direction: row;
4388
- align-items: center;
4389
- height: 64px;
4390
- padding: 16px 20px; }
4391
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__left .sendbird-fileviewer__header__left__avatar {
4392
- margin-right: 8px; }
4393
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__left .sendbird-fileviewer__header__left__filename {
4394
- max-width: 500px;
4395
- white-space: nowrap;
4396
- overflow: hidden;
4397
- text-overflow: ellipsis;
4398
- display: inline-block; }
4399
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__left .sendbird-fileviewer__header__left__sender-name {
4400
- max-width: 200px;
4401
- white-space: nowrap;
4402
- overflow: hidden;
4403
- text-overflow: ellipsis;
4404
- display: inline-flex;
4405
- margin-left: 8px;
4406
- padding-top: 5px; }
4407
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__right {
4408
- display: flex;
4409
- width: 160px;
4410
- justify-content: flex-end; }
4411
- .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__right .sendbird-fileviewer__header__right__actions {
4412
- right: 0;
4413
- display: flex;
4414
- flex-direction: row; }
4415
- .sendbird-theme--light .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__right .sendbird-fileviewer__header__right__actions__close {
4416
- border-left: 1px solid var(--sendbird-light-onlight-04); }
4417
- .sendbird-theme--dark .sendbird-fileviewer .sendbird-fileviewer__header .sendbird-fileviewer__header__right .sendbird-fileviewer__header__right__actions__close {
4418
- border-left: 1px solid var(--sendbird-dark-ondark-04); }
4419
- .sendbird-fileviewer .sendbird-fileviewer__content {
4420
- height: calc(100% - 72px);
4421
- margin-top: 8px;
4422
- overflow-y: auto;
4423
- display: flex;
4424
- align-items: center;
4425
- justify-content: center; }
4426
- .sendbird-fileviewer .sendbird-fileviewer__content .sendbird-fileviewer__content__video {
4427
- max-width: 100%;
4428
- max-height: 100%; }
4429
- .sendbird-fileviewer .sendbird-fileviewer__content .sendbird-fileviewer__content__img {
4430
- max-width: 90%;
4431
- max-height: 90%; }
4432
- .sendbird-fileviewer .sendbird-fileviewer__content .sendbird-fileviewer__content__unsupported {
4433
- max-width: 100%;
4434
- max-height: 100%;
4435
- display: flex;
4436
- justify-content: center;
4437
- align-items: center; }
4438
-
4439
- .sendbird-openchannel-profile {
4440
- position: relative;
4441
- text-align: center;
4442
- padding: 32px 40px 27px 40px; }
4443
- .sendbird-theme--light .sendbird-openchannel-profile {
4444
- border-bottom: 1px solid var(--sendbird-light-onlight-04);
4445
- background-color: var(--sendbird-light-background-50); }
4446
- .sendbird-theme--dark .sendbird-openchannel-profile {
4447
- border-bottom: 1px solid var(--sendbird-dark-ondark-04);
4448
- background-color: var(--sendbird-dark-background-600); }
4449
- .sendbird-openchannel-profile .sendbird-openchannel-profile--inner {
4450
- height: 116px; }
4451
- .sendbird-openchannel-profile .sendbird-openchannel-profile__avatar {
4452
- margin-bottom: 16px;
4453
- text-align: center; }
4454
- .sendbird-openchannel-profile .sendbird-openchannel-profile__title {
4455
- max-width: 240px;
4456
- white-space: nowrap;
4457
- overflow-x: hidden;
4458
- text-overflow: ellipsis;
4459
- height: 18px; }
4460
- .sendbird-openchannel-profile .sendbird-openchannel-profile__edit {
4461
- position: absolute;
4462
- top: 10px;
4463
- right: 16px; }
4464
-
4465
- /*# sourceMappingURL=index.css.map */