@zohoim/chat-components 1.0.8-alpha.0 → 1.0.9-alpha.0

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 (19) hide show
  1. package/assets/Appearance/dark/mode/General_DarkMode.module.css +71 -0
  2. package/assets/Appearance/dark/themes/blue/blue_General_DarkTheme.module.css +35 -0
  3. package/assets/Appearance/dark/themes/green/green_General_DarkTheme.module.css +35 -0
  4. package/assets/Appearance/dark/themes/orange/orange_General_DarkTheme.module.css +35 -0
  5. package/assets/Appearance/dark/themes/red/red_General_DarkTheme.module.css +35 -0
  6. package/assets/Appearance/dark/themes/yellow/yellow_General_DarkTheme.module.css +35 -0
  7. package/assets/Appearance/light/mode/General_LightMode.module.css +71 -0
  8. package/assets/Appearance/light/themes/blue/blue_General_LightTheme.module.css +35 -0
  9. package/assets/Appearance/light/themes/green/green_General_LightTheme.module.css +35 -0
  10. package/assets/Appearance/light/themes/orange/orange_General_LightTheme.module.css +35 -0
  11. package/assets/Appearance/light/themes/red/red_General_LightTheme.module.css +35 -0
  12. package/assets/Appearance/light/themes/yellow/yellow_General_LightTheme.module.css +35 -0
  13. package/assets/Appearance/pureDark/mode/General_PureDarkMode.module.css +71 -0
  14. package/assets/Appearance/pureDark/themes/blue/blue_General_PureDarkTheme.module.css +35 -0
  15. package/assets/Appearance/pureDark/themes/green/green_General_PureDarkTheme.module.css +35 -0
  16. package/assets/Appearance/pureDark/themes/orange/orange_General_PureDarkTheme.module.css +35 -0
  17. package/assets/Appearance/pureDark/themes/red/red_General_PureDarkTheme.module.css +35 -0
  18. package/assets/Appearance/pureDark/themes/yellow/yellow_General_PureDarkTheme.module.css +35 -0
  19. package/package.json +3 -2
@@ -0,0 +1,71 @@
1
+ [data-zohoim-mode='dark'] {
2
+ /* integration colors */
3
+ --imlib_chat_components_imIntegrationIcon_whatsapp_color: hsla(143, 70.85%, calc(48.43% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_imIntegrationIcon_telegram_color: hsla(201, 63.72%, calc(57.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
5
+ --imlib_chat_components_imIntegrationIcon_wechat_color: hsla(106, 100.00%, calc(37.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
6
+ --imlib_chat_components_imIntegrationIcon_line_color: hsla(120, 98.92%, calc(36.47% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_imIntegrationIcon_twillio_color: hsla(353, 88.24%, calc(56.67% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
8
+ --imlib_chat_components_imIntegrationIcon_instagram_color: linear-gradient(221.05deg,#933ab9 11.59%,#d12f8c 50.45%,#fdbb59 85.46%);
9
+ --imlib_chat_components_imIntegrationIcon_asap_color: linear-gradient(180deg, #A375FF 0%, #7732FF 100%);
10
+ --imlib_chat_components_imIntegrationIcon_fb_color: hsla(215, 100.00%, calc(50.00% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+
12
+ /* two tone icon colors */
13
+ --imlib_chat_components_imTtIcon_path0_color: rgba(255, 255, 255, 0.25);
14
+ --imlib_chat_components_imTtIcon_path1_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
15
+ --imlib_chat_components_imIntegrationIcon_path0_color: rgba(255, 255, 255, 0.25);
16
+ --imlib_chat_components_imIntegrationIcon_path1_color: rgb(255,255,255);
17
+
18
+ /* text / icon colors */
19
+ --imlib_chat_components_actionIconWrapper_color: rgb(226,228,230);
20
+ --imlib_chat_components_messageBox_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_line_color: hsla(217, 58.73%, calc(87.65% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_replyBubbleContent_sender_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+ --imlib_chat_components_attachmentBubbleInfo_fileName_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
24
+ --imlib_chat_components_attachmentBubbleInfo_fileSize_color: hsla(218, 9.76%, calc(51.76% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
25
+ --imlib_chat_components_replyBubbleContent_content_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
26
+ --imlib_chat_components_replyBubbleHeader_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
27
+ --imlib_chat_components_replyBubbleHeader_time_color: hsla(217, 7.76%, calc(54.51% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
28
+ --imlib_chat_components_textBubble_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
29
+ --imlib_chat_components_articleBubble_title_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
30
+ --imlib_chat_components_articleBubble_summary_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
31
+ --imlib_chat_components_imMessageContent_text_color: hsla(217, 13.73%, calc(70.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_imMessageMeta_time_color: hsla(217, 13.73%, calc(70.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_imAutoMessageInfo_text_color: hsla(217, 7.76%, calc(54.51% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_messageBubble_messageBox_footer_text_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ --imlib_chat_components_messageStatus_send_color: hsla(228, 11.42%, calc(42.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
36
+ --imlib_chat_components_imageBubble_alt_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
37
+
38
+ /* text / icon failed colors */
39
+ --imlib_chat_components_messageBox_failed_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ --imlib_chat_components_replyBubbleHeader_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
41
+ --imlib_chat_components_textBubble_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_lighter_low)), calc(1 + var(--zdc_alpha_low)));
42
+ --imlib_chat_components_imageBubble_alt_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
43
+ --imlib_chat_components_articleBubble_summary_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
44
+ --imlib_chat_components_replyBubbleContent_line_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
45
+ --imlib_chat_components_replyBubbleContent_sender_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
46
+ --imlib_chat_components_attachmentBubbleInfo_fileName_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
47
+ --imlib_chat_components_attachmentBubbleInfo_fileSize_color_failed: hsla(218, 9.76%, calc(51.76% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
48
+ --imlib_chat_components_replyBubbleContent_content_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
49
+ --imlib_chat_components_replyBubbleHeader_time_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
50
+ --imlib_chat_components_articleBubble_title_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
51
+
52
+ /* bg colors */
53
+ --imlib_chat_components_messageBox_bg_color: hsla(212, 86.67%, calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
54
+
55
+ /* bg failed colors */
56
+ --imlib_chat_components_messageBox_failed_bg_color: hsla(2, 75.51%, calc(90.39% + var(--zdc_darker_low)), calc(1 + var(--zdc_alpha_low)));
57
+ --imlib_chat_components_imageBubble_bg_color_failed: hsla(353, 59.09%, calc(91.37% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
58
+ --imlib_chat_components_attachmentBubble_bg_color_failed: hsla(353, 59.09%, calc(91.37% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
59
+ --imlib_chat_components_articleBubble_bg_color_failed: hsla(353, 59.09%, calc(91.37% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
60
+ --imlib_chat_components_locationBubble_bg_color_failed: hsla(353, 59.09%, calc(91.37% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
61
+ --imlib_chat_components_replyBubbleContent_bg_color_failed: hsla(353, 59.09%, calc(91.37% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
62
+
63
+ /* border failed colors */
64
+ --imlib_chat_components_attachmentBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
65
+ --imlib_chat_components_imageBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
66
+ --imlib_chat_components_locationBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
67
+ --imlib_chat_components_replyBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
68
+ --imlib_chat_components_videoBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
69
+ --imlib_chat_components_articleBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
70
+ --imlib_chat_components_replyBubbleContent_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
71
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='dark'][data-zohoim-theme='blue'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(213, 27.27%, calc(23.73% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(213, 27.27%, calc(23.73% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(193, 30.77%, calc(15.29% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(213, 25.88%, calc(33.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='dark'][data-zohoim-theme='green'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(191, 21.65%, calc(19.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(191, 21.65%, calc(19.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(193, 30.77%, calc(15.29% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(189, 21.21%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(158, 26.83%, calc(24.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='dark'][data-zohoim-theme='orange'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(252, 4.85%, calc(20.20% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(252, 4.85%, calc(20.20% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(193, 30.77%, calc(15.29% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(19, 21.54%, calc(25.49% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='dark'][data-zohoim-theme='red'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(258, 12.62%, calc(20.20% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(256, 13.25%, calc(16.27% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(256, 13.25%, calc(16.27% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(256, 13.25%, calc(16.27% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(256, 13.25%, calc(16.27% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(258, 12.62%, calc(20.20% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(193, 30.77%, calc(15.29% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(256, 13.25%, calc(16.27% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(334, 20.00%, calc(24.51% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='dark'][data-zohoim-theme='yellow'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(218, 7.69%, calc(20.39% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(218, 7.69%, calc(20.39% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(193, 30.77%, calc(15.29% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(37, 12.70%, calc(24.71% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,71 @@
1
+ [data-zohoim-mode='light'] {
2
+ /* integration colors */
3
+ --imlib_chat_components_imIntegrationIcon_whatsapp_color: hsla(143, 70.85%, calc(48.43% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_imIntegrationIcon_telegram_color: hsla(201, 63.72%, calc(57.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
5
+ --imlib_chat_components_imIntegrationIcon_wechat_color: hsla(106, 100.00%, calc(37.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
6
+ --imlib_chat_components_imIntegrationIcon_line_color: hsla(120, 98.92%, calc(36.47% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_imIntegrationIcon_twillio_color: hsla(353, 88.24%, calc(56.67% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
8
+ --imlib_chat_components_imIntegrationIcon_instagram_color: linear-gradient(221.05deg,#933ab9 11.59%,#d12f8c 50.45%,#fdbb59 85.46%);
9
+ --imlib_chat_components_imIntegrationIcon_asap_color: linear-gradient(180deg, #A375FF 0%, #7732FF 100%);
10
+ --imlib_chat_components_imIntegrationIcon_fb_color: hsla(215, 100.00%, calc(50.00% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+
12
+ /* two tone icon colors */
13
+ --imlib_chat_components_imTtIcon_path0_color: rgba(200,203,220,0.7);
14
+ --imlib_chat_components_imTtIcon_path1_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
15
+ --imlib_chat_components_imIntegrationIcon_path0_color: rgba(255, 255, 255, 0.25);
16
+ --imlib_chat_components_imIntegrationIcon_path1_color: rgb(255,255,255);
17
+
18
+ /* text / icon colors */
19
+ --imlib_chat_components_actionIconWrapper_color: rgb(0,0,0);
20
+ --imlib_chat_components_messageBox_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_line_color: hsla(217, 58.73%, calc(87.65% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_replyBubbleContent_sender_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+ --imlib_chat_components_attachmentBubbleInfo_fileName_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
24
+ --imlib_chat_components_attachmentBubbleInfo_fileSize_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
25
+ --imlib_chat_components_replyBubbleContent_content_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
26
+ --imlib_chat_components_replyBubbleHeader_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
27
+ --imlib_chat_components_replyBubbleHeader_time_color: hsla(228, 11.42%, calc(42.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
28
+ --imlib_chat_components_textBubble_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
29
+ --imlib_chat_components_articleBubble_title_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
30
+ --imlib_chat_components_articleBubble_summary_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
31
+ --imlib_chat_components_imMessageContent_text_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_imMessageMeta_time_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_imAutoMessageInfo_text_color: hsla(240, 1.29%, calc(45.69% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_messageBubble_messageBox_footer_text_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ --imlib_chat_components_messageStatus_send_color: hsla(228, 11.42%, calc(42.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
36
+ --imlib_chat_components_imageBubble_alt_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
37
+
38
+ /* text / icon failed colors */
39
+ --imlib_chat_components_messageBox_failed_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ --imlib_chat_components_replyBubbleHeader_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
41
+ --imlib_chat_components_textBubble_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_lighter_low)), calc(1 + var(--zdc_alpha_low)));
42
+ --imlib_chat_components_imageBubble_alt_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
43
+ --imlib_chat_components_articleBubble_summary_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
44
+ --imlib_chat_components_replyBubbleContent_line_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
45
+ --imlib_chat_components_replyBubbleContent_sender_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
46
+ --imlib_chat_components_attachmentBubbleInfo_fileName_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
47
+ --imlib_chat_components_attachmentBubbleInfo_fileSize_color_failed: hsla(218, 9.76%, calc(51.76% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
48
+ --imlib_chat_components_replyBubbleContent_content_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
49
+ --imlib_chat_components_replyBubbleHeader_time_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
50
+ --imlib_chat_components_articleBubble_title_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
51
+
52
+ /* bg colors */
53
+ --imlib_chat_components_messageBox_bg_color: hsla(212, 86.67%, calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
54
+
55
+ /* bg failed colors */
56
+ --imlib_chat_components_messageBox_failed_bg_color: hsla(0, 73.91%, calc(95.49% + var(--zdc_darker_low)), calc(1 + var(--zdc_alpha_low)));
57
+ --imlib_chat_components_imageBubble_bg_color_failed: hsla(0, 100.00%, calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
58
+ --imlib_chat_components_attachmentBubble_bg_color_failed: hsla(0, 100.00%, calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
59
+ --imlib_chat_components_articleBubble_bg_color_failed: hsla(0, 100.00%, calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
60
+ --imlib_chat_components_locationBubble_bg_color_failed: hsla(0, 100.00%, calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
61
+ --imlib_chat_components_replyBubbleContent_bg_color_failed: hsla(0, 100.00%, calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
62
+
63
+ /* border failed colors */
64
+ --imlib_chat_components_attachmentBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
65
+ --imlib_chat_components_imageBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
66
+ --imlib_chat_components_locationBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
67
+ --imlib_chat_components_replyBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
68
+ --imlib_chat_components_videoBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
69
+ --imlib_chat_components_articleBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
70
+ --imlib_chat_components_replyBubbleContent_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
71
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='light'][data-zohoim-theme='blue'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(212, 86.67%, calc(97.06% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 40.00%, calc(96.08% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(212, 86.67%, calc(97.06% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(64, 100.00%, calc(94.51% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(213, 65.52%, calc(82.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='light'][data-zohoim-theme='green'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(143, 44.44%, calc(96.47% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 40.00%, calc(96.08% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(143, 44.44%, calc(96.47% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(64, 100.00%, calc(94.51% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(132, 42.86%, calc(82.16% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='light'][data-zohoim-theme='orange'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(26, 77.78%, calc(96.47% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 40.00%, calc(96.08% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(26, 77.78%, calc(96.47% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(64, 100.00%, calc(94.51% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(28, 79.49%, calc(84.71% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='light'][data-zohoim-theme='red'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(0, 71.43%, calc(97.25% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 40.00%, calc(96.08% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(0, 71.43%, calc(97.25% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(64, 100.00%, calc(94.51% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(0, 70.21%, calc(90.78% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='light'][data-zohoim-theme='yellow'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(45, 83.33%, calc(95.29% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 40.00%, calc(96.08% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(45, 83.33%, calc(95.29% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(64, 100.00%, calc(94.51% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(46, 81.44%, calc(80.98% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(46, 92.59%, calc(37.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(46, 92.59%, calc(37.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(46, 92.59%, calc(37.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(46, 92.59%, calc(37.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(46, 92.59%, calc(37.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(46, 92.59%, calc(37.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(46, 92.59%, calc(37.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(46, 92.59%, calc(37.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,71 @@
1
+ [data-zohoim-mode='pureDark'] {
2
+ /* integration colors */
3
+ --imlib_chat_components_imIntegrationIcon_whatsapp_color: hsla(143, 70.85%, calc(48.43% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_imIntegrationIcon_telegram_color: hsla(201, 63.72%, calc(57.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
5
+ --imlib_chat_components_imIntegrationIcon_wechat_color: hsla(106, 100.00%, calc(37.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
6
+ --imlib_chat_components_imIntegrationIcon_line_color: hsla(120, 98.92%, calc(36.47% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_imIntegrationIcon_twillio_color: hsla(353, 88.24%, calc(56.67% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
8
+ --imlib_chat_components_imIntegrationIcon_instagram_color: linear-gradient(221.05deg,#933ab9 11.59%,#d12f8c 50.45%,#fdbb59 85.46%);
9
+ --imlib_chat_components_imIntegrationIcon_asap_color: linear-gradient(180deg, #A375FF 0%, #7732FF 100%);
10
+ --imlib_chat_components_imIntegrationIcon_fb_color: hsla(215, 100.00%, calc(50.00% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+
12
+ /* two tone icon colors */
13
+ --imlib_chat_components_imTtIcon_path0_color: rgba(255, 255, 255, 0.25);
14
+ --imlib_chat_components_imTtIcon_path1_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
15
+ --imlib_chat_components_imIntegrationIcon_path0_color: rgba(255, 255, 255, 0.25);
16
+ --imlib_chat_components_imIntegrationIcon_path1_color: rgb(255,255,255);
17
+
18
+ /* text / icon colors */
19
+ --imlib_chat_components_actionIconWrapper_color: rgb(226,228,230);
20
+ --imlib_chat_components_messageBox_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_line_color: hsla(217, 58.73%, calc(87.65% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_replyBubbleContent_sender_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+ --imlib_chat_components_attachmentBubbleInfo_fileName_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
24
+ --imlib_chat_components_attachmentBubbleInfo_fileSize_color: hsla(0, 0.00%, calc(60.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
25
+ --imlib_chat_components_replyBubbleContent_content_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
26
+ --imlib_chat_components_replyBubbleHeader_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
27
+ --imlib_chat_components_replyBubbleHeader_time_color: hsla(217, 7.76%, calc(54.51% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
28
+ --imlib_chat_components_textBubble_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
29
+ --imlib_chat_components_articleBubble_title_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
30
+ --imlib_chat_components_articleBubble_summary_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
31
+ --imlib_chat_components_imMessageContent_text_color: hsla(217, 13.73%, calc(70.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_imMessageMeta_time_color: hsla(0, 0.00%, calc(60.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_imAutoMessageInfo_text_color: hsla(0, 0.00%, calc(60.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_messageBubble_messageBox_footer_text_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ --imlib_chat_components_messageStatus_send_color: hsla(228, 11.42%, calc(42.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
36
+ --imlib_chat_components_imageBubble_alt_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
37
+
38
+ /* text / icon failed colors */
39
+ --imlib_chat_components_messageBox_failed_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ --imlib_chat_components_replyBubbleHeader_text_color_failed: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
41
+ --imlib_chat_components_textBubble_text_color_failed: hsla(210, 7.41%, calc(89.41% + var(--zdc_lighter_low)), calc(1 + var(--zdc_alpha_low)));
42
+ --imlib_chat_components_imageBubble_alt_text_color_failed: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
43
+ --imlib_chat_components_articleBubble_summary_color_failed: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
44
+ --imlib_chat_components_replyBubbleContent_line_color_failed: hsla(0, 100.00%, calc(8.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
45
+ --imlib_chat_components_replyBubbleContent_sender_color_failed: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
46
+ --imlib_chat_components_attachmentBubbleInfo_fileName_color_failed: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
47
+ --imlib_chat_components_attachmentBubbleInfo_fileSize_color_failed: hsla(218, 9.76%, calc(51.76% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
48
+ --imlib_chat_components_replyBubbleContent_content_color_failed: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
49
+ --imlib_chat_components_replyBubbleHeader_time_color_failed: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
50
+ --imlib_chat_components_articleBubble_title_color_failed: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
51
+
52
+ /* bg colors */
53
+ --imlib_chat_components_messageBox_bg_color: hsla(212, 86.67%, calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
54
+
55
+ /* bg failed colors */
56
+ --imlib_chat_components_messageBox_failed_bg_color: hsla(346, 36.31%, calc(30.78% + var(--zdc_darker_low)), calc(1 + var(--zdc_alpha_low)));
57
+ --imlib_chat_components_imageBubble_bg_color_failed: hsla(321, 18.68%, calc(17.84% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
58
+ --imlib_chat_components_attachmentBubble_bg_color_failed: hsla(321, 18.68%, calc(17.84% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
59
+ --imlib_chat_components_articleBubble_bg_color_failed: hsla(321, 18.68%, calc(17.84% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
60
+ --imlib_chat_components_locationBubble_bg_color_failed: hsla(321, 18.68%, calc(17.84% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
61
+ --imlib_chat_components_replyBubbleContent_bg_color_failed: hsla(321, 18.68%, calc(17.84% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
62
+
63
+ /* border failed colors */
64
+ --imlib_chat_components_attachmentBubble_border_color_failed: hsla(0, 100.00%, calc(8.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
65
+ --imlib_chat_components_imageBubble_border_color_failed: hsla(0, 100.00%, calc(8.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
66
+ --imlib_chat_components_locationBubble_border_color_failed: hsla(0, 100.00%, calc(8.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
67
+ --imlib_chat_components_replyBubble_border_color_failed: hsla(0, 100.00%, calc(8.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
68
+ --imlib_chat_components_videoBubble_border_color_failed: hsla(0, 100.00%, calc(8.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
69
+ --imlib_chat_components_articleBubble_border_color_failed: hsla(0, 100.00%, calc(8.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
70
+ --imlib_chat_components_replyBubbleContent_border_color_failed: hsla(0, 100.00%, calc(8.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
71
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='pureDark'][data-zohoim-theme='blue'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(213, 19.57%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(0, 0.00%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(0, 0.00%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(128, 11.11%, calc(14.12% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(212, 38.89%, calc(28.24% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='pureDark'][data-zohoim-theme='green'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(133, 10.84%, calc(16.27% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(0, 0.00%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(0, 0.00%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(128, 11.11%, calc(14.12% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(133, 23.48%, calc(22.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='pureDark'][data-zohoim-theme='orange'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(26, 19.51%, calc(16.08% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(0, 0.00%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(0, 0.00%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(128, 11.11%, calc(14.12% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(26, 40.00%, calc(21.57% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='pureDark'][data-zohoim-theme='red'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(0, 13.25%, calc(16.27% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(0, 0.00%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(0, 0.00%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(128, 11.11%, calc(14.12% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(2, 28.07%, calc(22.35% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
@@ -0,0 +1,35 @@
1
+ [data-zohoim-mode='pureDark'][data-zohoim-theme='yellow'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(35, 15.00%, calc(15.69% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(0, 0.00%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(0, 0.00%, calc(18.04% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(128, 11.11%, calc(14.12% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(38, 30.19%, calc(20.78% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_attachmentBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_articleBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_imageBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_locationBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_replyBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_videoBubble_border_color: hsla(0, 2.33%, calc(8.43% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+
23
+ /* url / themes / primary colors */
24
+ --imlib_chat_components_locationBubble_url_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
25
+ --imlib_chat_components_imPermaLink_url_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
26
+ --imlib_chat_components_textBubble_see_more_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
27
+ --imlib_chat_components_textBubble_url_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
28
+ --imlib_chat_components_messageStatus_read_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+
30
+ /* failed colors */
31
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_textBubble_url_color_failed: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zohoim/chat-components",
3
- "version": "1.0.8-alpha.0",
3
+ "version": "1.0.9-alpha.0",
4
4
  "description": "Chat Components",
5
5
  "main": "lib/index.js",
6
6
  "module": "es/index.js",
@@ -31,6 +31,7 @@
31
31
  },
32
32
  "files": [
33
33
  "es",
34
+ "assets",
34
35
  "!**/__tests__"
35
36
  ],
36
37
  "dependencies": {
@@ -51,5 +52,5 @@
51
52
  "jsdom": "23.0.0",
52
53
  "react-to-jsx": "1.3.2"
53
54
  },
54
- "gitHead": "0832af76162f0ffe43d573afa9b7dbf0452fd038"
55
+ "gitHead": "9cda3855c3440ea8439c75bcb7b9e2a2ad41bc5b"
55
56
  }