@bcc-code/vue-bcc-chat-ui 1.6.0 → 1.6.2
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.
- package/dist/chat/mobileView.d.ts +9 -4
- package/dist/offline/index.d.ts +1 -0
- package/dist/offline/offlineStoreLocalStorage.d.ts +3 -0
- package/dist/offline/types.d.ts +4 -0
- package/dist/style.css +1 -1
- package/dist/vue-bcc-chat-ui.js +11426 -11394
- package/package.json +1 -1
- package/src/components/BccChatMessageList.vue +75 -3
package/package.json
CHANGED
|
@@ -34,9 +34,19 @@ watch(chatGroup, (exists: null) => {
|
|
|
34
34
|
nextTick(() => {
|
|
35
35
|
watchAndApplyStyle(
|
|
36
36
|
".bcc-chat-message-list",
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
37
|
+
[{
|
|
38
|
+
selector: '.cc__imageviewer__close-button',
|
|
39
|
+
style: { "padding-top": "env(safe-area-inset-top)" },
|
|
40
|
+
shadowDomSelector: 'cometchat-full-screen-viewer'
|
|
41
|
+
}, {
|
|
42
|
+
selector: '.cc__text',
|
|
43
|
+
style: { color: 'var(--cc__text-color)' },
|
|
44
|
+
shadowDomSelector: 'cometchat-text-bubble'
|
|
45
|
+
}, {
|
|
46
|
+
selector: '.cc__linkpreview-title',
|
|
47
|
+
style: { color: 'var(--cc__text-color)' },
|
|
48
|
+
shadowDomSelector: 'link-preview'
|
|
49
|
+
}]
|
|
40
50
|
);
|
|
41
51
|
});
|
|
42
52
|
})
|
|
@@ -186,8 +196,63 @@ function getMessageListConfiguration(): MessageListConfiguration {
|
|
|
186
196
|
</template>
|
|
187
197
|
|
|
188
198
|
<style lang="scss">
|
|
199
|
+
body {
|
|
200
|
+
background: #fff;
|
|
201
|
+
color: #000;
|
|
202
|
+
|
|
203
|
+
@media (prefers-color-scheme: dark) {
|
|
204
|
+
background: #000;
|
|
205
|
+
color: #fff;
|
|
206
|
+
}
|
|
207
|
+
}
|
|
208
|
+
|
|
209
|
+
/*
|
|
210
|
+
primary: my bubble
|
|
211
|
+
accent: message bar text
|
|
212
|
+
accent100: message bar and widget buttons bg, others bubble
|
|
213
|
+
accent200: horizontal line on message bar
|
|
214
|
+
accent500: icons on message bar
|
|
215
|
+
accent600: dates and date separator and popup icons
|
|
216
|
+
accent700: avatar background, widget buttons text
|
|
217
|
+
accent900: text in avatar
|
|
218
|
+
*/
|
|
219
|
+
|
|
189
220
|
.bcc-chat-message-list {
|
|
190
221
|
height: 100%;
|
|
222
|
+
--cc__primary: #CFEAC8;
|
|
223
|
+
--cc__background: #F3FAF7;
|
|
224
|
+
--cc__secondary: white;
|
|
225
|
+
--cc__accent: #004e48;
|
|
226
|
+
--cc__accent50: rgba(62, 142, 117, 0.04);
|
|
227
|
+
--cc__accent100: #FFFFFF;
|
|
228
|
+
--cc__accent200: rgba(62, 142, 117, 0.15);
|
|
229
|
+
--cc__accent300: rgba(62, 142, 117, 0.24);
|
|
230
|
+
--cc__accent400: rgba(62, 142, 117, 0.33);
|
|
231
|
+
--cc__accent500: rgba(62, 142, 117, 0.46);
|
|
232
|
+
--cc__accent600: #004E48;
|
|
233
|
+
--cc__accent700: #254A40;
|
|
234
|
+
--cc__accent800: rgba(62, 142, 117, 0.82);
|
|
235
|
+
--cc__accent900: #F3FAF7;
|
|
236
|
+
--cc__text-color: #000;
|
|
237
|
+
|
|
238
|
+
@media (prefers-color-scheme: dark) {
|
|
239
|
+
--cc__primary: #57639E;
|
|
240
|
+
--cc__background: hsl(230, 25%, 15%);
|
|
241
|
+
--cc__secondary: #111827;
|
|
242
|
+
--cc__accent: #6274AE;
|
|
243
|
+
--cc__accent50: rgba(98, 116, 174, 0.24);
|
|
244
|
+
--cc__accent100: linear-gradient(45deg, #05070b 0%, #0c111c 100%);
|
|
245
|
+
--cc__accent200: rgba(98, 116, 174, 0.35);
|
|
246
|
+
--cc__accent300: rgba(98, 116, 174, 0.44);
|
|
247
|
+
--cc__accent400: rgba(98, 116, 174, 0.53);
|
|
248
|
+
--cc__accent500: rgba(98, 116, 174, 0.66);
|
|
249
|
+
--cc__accent600: #758ABC;
|
|
250
|
+
--cc__accent700: #6274AE;
|
|
251
|
+
--cc__accent800: rgba(98, 116, 174, 0.92);
|
|
252
|
+
--cc__accent900: #F3FAF7;
|
|
253
|
+
--cc__text-color: #fff;
|
|
254
|
+
}
|
|
255
|
+
|
|
191
256
|
/* 1. Wrapper for Messages component */
|
|
192
257
|
.cc-messages-wrapper {
|
|
193
258
|
/* 1.1 Messages component */
|
|
@@ -198,6 +263,13 @@ function getMessageListConfiguration(): MessageListConfiguration {
|
|
|
198
263
|
}
|
|
199
264
|
}
|
|
200
265
|
}
|
|
266
|
+
|
|
267
|
+
.cc-messagebubble-wrapper__messageoptions {
|
|
268
|
+
border-radius: 8px;
|
|
269
|
+
.cc-context-menu__top-menu {
|
|
270
|
+
border: 1px var(--cc__secondary) solid !important;
|
|
271
|
+
}
|
|
272
|
+
}
|
|
201
273
|
}
|
|
202
274
|
|
|
203
275
|
.cc-messagecomposer__emojikeyboard {
|