@product7/product7-js 0.5.6 → 0.5.7
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/README.md +6 -7
- package/dist/README.md +6 -7
- package/dist/product7-js.js +7155 -6999
- package/dist/product7-js.js.map +1 -1
- package/dist/product7-js.min.js +1 -1
- package/dist/product7-js.min.js.map +1 -1
- package/package.json +1 -1
- package/src/api/services/LiveChatService.js +12 -12
- package/src/core/APIService.js +1 -1
- package/src/core/WebSocketService.js +1 -1
- package/src/index.js +6 -5
- package/src/styles/base.js +8 -8
- package/src/styles/{live-chat-components.js → liveChat-components.js} +113 -113
- package/src/styles/{live-chat-core.js → liveChat-core.js} +95 -30
- package/src/styles/{live-chat-features.js → liveChat-features.js} +19 -19
- package/src/styles/{live-chat-views.js → liveChat-views.js} +136 -136
- package/src/styles/liveChat.js +17 -0
- package/src/styles/liveChatCustomStyles.js +14 -14
- package/src/styles/styles.js +2 -2
- package/src/widgets/BaseWidget.js +2 -2
- package/src/widgets/ChangelogWidget.js +3 -3
- package/src/widgets/LiveChatWidget.js +17 -13
- package/src/widgets/SurveyWidget.js +7 -7
- package/src/widgets/WidgetFactory.js +1 -1
- package/src/widgets/{live-chat → liveChat}/components/LiveChatLauncher.js +15 -15
- package/src/widgets/{live-chat → liveChat}/components/LiveChatPanel.js +40 -9
- package/src/widgets/{live-chat → liveChat}/components/NavigationTabs.js +16 -16
- package/src/widgets/{live-chat → liveChat}/views/ChangelogView.js +17 -17
- package/src/widgets/{live-chat → liveChat}/views/ChatView.js +153 -95
- package/src/widgets/{live-chat → liveChat}/views/ConversationsView.js +24 -24
- package/src/widgets/{live-chat → liveChat}/views/HelpView.js +32 -32
- package/src/widgets/{live-chat → liveChat}/views/HomeView.js +52 -52
- package/src/widgets/{live-chat → liveChat}/views/PreChatFormView.js +15 -18
- package/types/index.d.ts +0 -2
- package/src/styles/live-chat.js +0 -17
- /package/src/widgets/{live-chat → liveChat}/LiveChatState.js +0 -0
|
@@ -3,13 +3,13 @@
|
|
|
3
3
|
HOME VIEW
|
|
4
4
|
======================================== */
|
|
5
5
|
|
|
6
|
-
.
|
|
6
|
+
.liveChat-home-view {
|
|
7
7
|
background: var(--msg-bg-header-gradient);
|
|
8
8
|
position: relative;
|
|
9
9
|
overflow: hidden;
|
|
10
10
|
}
|
|
11
11
|
|
|
12
|
-
.
|
|
12
|
+
.liveChat-home-view::before {
|
|
13
13
|
content: '';
|
|
14
14
|
position: absolute;
|
|
15
15
|
top: 0;
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
z-index: 1;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
.
|
|
25
|
+
.liveChat-home-view::after {
|
|
26
26
|
content: '';
|
|
27
27
|
position: absolute;
|
|
28
28
|
top: 0;
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
z-index: 1;
|
|
36
36
|
}
|
|
37
37
|
|
|
38
|
-
.
|
|
38
|
+
.liveChat-home-scroll {
|
|
39
39
|
flex: 1;
|
|
40
40
|
overflow-y: auto;
|
|
41
41
|
display: flex;
|
|
@@ -43,14 +43,14 @@
|
|
|
43
43
|
position: relative;
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
.
|
|
46
|
+
.liveChat-home-header {
|
|
47
47
|
padding: var(--spacing-6) var(--spacing-5);
|
|
48
48
|
position: relative;
|
|
49
49
|
z-index: 2;
|
|
50
50
|
flex-shrink: 0;
|
|
51
51
|
}
|
|
52
52
|
|
|
53
|
-
.
|
|
53
|
+
.liveChat-home-header-top {
|
|
54
54
|
display: flex;
|
|
55
55
|
align-items: center;
|
|
56
56
|
justify-content: space-between;
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
z-index: 2;
|
|
60
60
|
}
|
|
61
61
|
|
|
62
|
-
.
|
|
62
|
+
.liveChat-home-logo {
|
|
63
63
|
width: 48px;
|
|
64
64
|
height: 48px;
|
|
65
65
|
border-radius: var(--radius-lg);
|
|
@@ -70,14 +70,14 @@
|
|
|
70
70
|
justify-content: center;
|
|
71
71
|
}
|
|
72
72
|
|
|
73
|
-
.
|
|
73
|
+
.liveChat-home-logo img {
|
|
74
74
|
width: 100%;
|
|
75
75
|
height: 100%;
|
|
76
76
|
object-fit: contain;
|
|
77
77
|
border-radius: var(--radius-lg);
|
|
78
78
|
}
|
|
79
79
|
|
|
80
|
-
.
|
|
80
|
+
.liveChat-home-avatars {
|
|
81
81
|
flex: 1;
|
|
82
82
|
display: flex;
|
|
83
83
|
justify-content: flex-end;
|
|
@@ -85,11 +85,11 @@
|
|
|
85
85
|
margin-left: var(--spacing-4);
|
|
86
86
|
}
|
|
87
87
|
|
|
88
|
-
.
|
|
88
|
+
.liveChat-home-avatars:empty {
|
|
89
89
|
display: none;
|
|
90
90
|
}
|
|
91
91
|
|
|
92
|
-
.
|
|
92
|
+
.liveChat-home-welcome {
|
|
93
93
|
display: flex;
|
|
94
94
|
flex-direction: column;
|
|
95
95
|
text-align: left;
|
|
@@ -97,7 +97,7 @@
|
|
|
97
97
|
z-index: 2;
|
|
98
98
|
}
|
|
99
99
|
|
|
100
|
-
.
|
|
100
|
+
.liveChat-home-greeting {
|
|
101
101
|
font-size: clamp(22px, 8vw, 34px);
|
|
102
102
|
font-weight: var(--font-weight-bold);
|
|
103
103
|
color: var(--msg-text);
|
|
@@ -105,7 +105,7 @@
|
|
|
105
105
|
word-break: break-word;
|
|
106
106
|
}
|
|
107
107
|
|
|
108
|
-
.
|
|
108
|
+
.liveChat-home-question {
|
|
109
109
|
font-size: clamp(18px, 6.5vw, 28px);
|
|
110
110
|
font-weight: var(--font-weight-bold);
|
|
111
111
|
color: var(--msg-text);
|
|
@@ -113,14 +113,14 @@
|
|
|
113
113
|
word-break: break-word;
|
|
114
114
|
}
|
|
115
115
|
|
|
116
|
-
.
|
|
116
|
+
.liveChat-home-body {
|
|
117
117
|
flex: 1;
|
|
118
118
|
padding: 0 var(--spacing-5) var(--spacing-5);
|
|
119
119
|
position: relative;
|
|
120
120
|
z-index: 2;
|
|
121
121
|
}
|
|
122
122
|
|
|
123
|
-
.
|
|
123
|
+
.liveChat-home-recent-card {
|
|
124
124
|
background: var(--msg-bg);
|
|
125
125
|
border: 1px solid var(--msg-border);
|
|
126
126
|
border-radius: 10px;
|
|
@@ -131,24 +131,24 @@
|
|
|
131
131
|
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
|
|
132
132
|
}
|
|
133
133
|
|
|
134
|
-
.
|
|
134
|
+
.liveChat-home-recent-card:hover {
|
|
135
135
|
background: var(--msg-bg-hover);
|
|
136
136
|
}
|
|
137
137
|
|
|
138
|
-
.
|
|
138
|
+
.liveChat-home-recent-card-label {
|
|
139
139
|
font-size: 0.875rem;
|
|
140
140
|
font-weight: 600;
|
|
141
141
|
color: var(--msg-text-tertiary);
|
|
142
142
|
margin-bottom: var(--spacing-2);
|
|
143
143
|
}
|
|
144
144
|
|
|
145
|
-
.
|
|
145
|
+
.liveChat-home-recent-card-row {
|
|
146
146
|
display: flex;
|
|
147
147
|
align-items: center;
|
|
148
148
|
gap: var(--spacing-3);
|
|
149
149
|
}
|
|
150
150
|
|
|
151
|
-
.
|
|
151
|
+
.liveChat-home-recent-avatar {
|
|
152
152
|
width: 36px;
|
|
153
153
|
height: 36px;
|
|
154
154
|
border-radius: var(--radius-full);
|
|
@@ -162,28 +162,28 @@
|
|
|
162
162
|
overflow: hidden;
|
|
163
163
|
}
|
|
164
164
|
|
|
165
|
-
.
|
|
165
|
+
.liveChat-home-recent-avatar img {
|
|
166
166
|
width: 100%;
|
|
167
167
|
height: 100%;
|
|
168
168
|
object-fit: cover;
|
|
169
169
|
}
|
|
170
170
|
|
|
171
|
-
.
|
|
171
|
+
.liveChat-home-recent-avatar-logo {
|
|
172
172
|
background: var(--msg-bg-surface);
|
|
173
173
|
border: 1px solid var(--msg-border);
|
|
174
174
|
padding: 4px;
|
|
175
175
|
}
|
|
176
176
|
|
|
177
|
-
.
|
|
177
|
+
.liveChat-home-recent-avatar-logo img {
|
|
178
178
|
object-fit: contain;
|
|
179
179
|
}
|
|
180
180
|
|
|
181
|
-
.
|
|
181
|
+
.liveChat-home-recent-card-content {
|
|
182
182
|
flex: 1;
|
|
183
183
|
min-width: 0;
|
|
184
184
|
}
|
|
185
185
|
|
|
186
|
-
.
|
|
186
|
+
.liveChat-home-recent-card-header {
|
|
187
187
|
display: flex;
|
|
188
188
|
align-items: center;
|
|
189
189
|
justify-content: space-between;
|
|
@@ -191,26 +191,26 @@
|
|
|
191
191
|
margin-bottom: 2px;
|
|
192
192
|
}
|
|
193
193
|
|
|
194
|
-
.
|
|
194
|
+
.liveChat-home-recent-card-name {
|
|
195
195
|
font-size: var(--font-size-sm);
|
|
196
196
|
font-weight: var(--font-weight-semibold);
|
|
197
197
|
color: var(--msg-text);
|
|
198
198
|
}
|
|
199
199
|
|
|
200
|
-
.
|
|
200
|
+
.liveChat-home-recent-card-time {
|
|
201
201
|
font-size: var(--font-size-xs);
|
|
202
202
|
color: var(--msg-text-tertiary);
|
|
203
203
|
flex-shrink: 0;
|
|
204
204
|
}
|
|
205
205
|
|
|
206
|
-
.
|
|
206
|
+
.liveChat-home-recent-card-preview {
|
|
207
207
|
display: flex;
|
|
208
208
|
align-items: center;
|
|
209
209
|
justify-content: space-between;
|
|
210
210
|
gap: var(--spacing-2);
|
|
211
211
|
}
|
|
212
212
|
|
|
213
|
-
.
|
|
213
|
+
.liveChat-home-recent-card-message {
|
|
214
214
|
font-size: var(--font-size-sm);
|
|
215
215
|
color: var(--msg-text-secondary);
|
|
216
216
|
white-space: nowrap;
|
|
@@ -218,7 +218,7 @@
|
|
|
218
218
|
text-overflow: ellipsis;
|
|
219
219
|
}
|
|
220
220
|
|
|
221
|
-
.
|
|
221
|
+
.liveChat-home-recent-unread-dot {
|
|
222
222
|
width: 8px;
|
|
223
223
|
height: 8px;
|
|
224
224
|
border-radius: var(--radius-full);
|
|
@@ -226,7 +226,7 @@
|
|
|
226
226
|
flex-shrink: 0;
|
|
227
227
|
}
|
|
228
228
|
|
|
229
|
-
.
|
|
229
|
+
.liveChat-home-message-btn {
|
|
230
230
|
width: 100%;
|
|
231
231
|
display: flex;
|
|
232
232
|
align-items: center;
|
|
@@ -245,27 +245,27 @@
|
|
|
245
245
|
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
|
|
246
246
|
}
|
|
247
247
|
|
|
248
|
-
.
|
|
248
|
+
.liveChat-home-message-btn:hover {
|
|
249
249
|
background: var(--msg-bg-hover);
|
|
250
250
|
}
|
|
251
251
|
|
|
252
|
-
.
|
|
252
|
+
.liveChat-home-message-btn:active {
|
|
253
253
|
transform: translateY(1px);
|
|
254
254
|
transition-duration: 100ms;
|
|
255
255
|
}
|
|
256
256
|
|
|
257
|
-
.
|
|
257
|
+
.liveChat-home-continue-btn {
|
|
258
258
|
flex-direction: row;
|
|
259
259
|
align-items: center;
|
|
260
260
|
justify-content: space-between;
|
|
261
261
|
gap: var(--spacing-3);
|
|
262
262
|
}
|
|
263
263
|
|
|
264
|
-
.
|
|
264
|
+
.liveChat-home-continue-btn > svg {
|
|
265
265
|
flex-shrink: 0;
|
|
266
266
|
}
|
|
267
267
|
|
|
268
|
-
.
|
|
268
|
+
.liveChat-home-continue-info {
|
|
269
269
|
display: flex;
|
|
270
270
|
flex-direction: column;
|
|
271
271
|
gap: 2px;
|
|
@@ -273,25 +273,25 @@
|
|
|
273
273
|
flex: 1;
|
|
274
274
|
}
|
|
275
275
|
|
|
276
|
-
.
|
|
276
|
+
.liveChat-home-continue-label {
|
|
277
277
|
font-size: 0.875rem;
|
|
278
278
|
font-weight: var(--font-weight-semibold);
|
|
279
279
|
color: var(--msg-text);
|
|
280
280
|
}
|
|
281
281
|
|
|
282
|
-
.
|
|
282
|
+
.liveChat-home-message-subtext {
|
|
283
283
|
font-size: var(--font-size-xs);
|
|
284
284
|
font-weight: 400;
|
|
285
285
|
color: var(--msg-text-secondary);
|
|
286
286
|
}
|
|
287
287
|
|
|
288
|
-
.
|
|
288
|
+
.liveChat-home-continue-preview {
|
|
289
289
|
font-size: var(--font-size-sm);
|
|
290
290
|
opacity: 0.6;
|
|
291
291
|
font-weight: var(--font-weight-normal);
|
|
292
292
|
}
|
|
293
293
|
|
|
294
|
-
.
|
|
294
|
+
.liveChat-home-featured {
|
|
295
295
|
background: var(--msg-bg);
|
|
296
296
|
border-radius: var(--radius-xl);
|
|
297
297
|
overflow: hidden;
|
|
@@ -299,23 +299,23 @@
|
|
|
299
299
|
box-shadow: var(--msg-shadow-card);
|
|
300
300
|
}
|
|
301
301
|
|
|
302
|
-
.
|
|
302
|
+
.liveChat-home-featured-image {
|
|
303
303
|
width: 100%;
|
|
304
304
|
height: 160px;
|
|
305
305
|
object-fit: cover;
|
|
306
306
|
display: block;
|
|
307
307
|
}
|
|
308
308
|
|
|
309
|
-
.
|
|
309
|
+
.liveChat-home-featured-divider {
|
|
310
310
|
height: 1px;
|
|
311
311
|
background: var(--msg-border);
|
|
312
312
|
}
|
|
313
313
|
|
|
314
|
-
.
|
|
314
|
+
.liveChat-home-featured-content {
|
|
315
315
|
padding: var(--spacing-4) var(--spacing-5);
|
|
316
316
|
}
|
|
317
317
|
|
|
318
|
-
.
|
|
318
|
+
.liveChat-home-featured-content h3 {
|
|
319
319
|
margin: 0 0 var(--spacing-2);
|
|
320
320
|
font-size: var(--font-size-xl);
|
|
321
321
|
font-weight: var(--font-weight-semibold);
|
|
@@ -323,25 +323,25 @@
|
|
|
323
323
|
line-height: var(--line-height-normal);
|
|
324
324
|
}
|
|
325
325
|
|
|
326
|
-
.
|
|
326
|
+
.liveChat-home-featured-content p {
|
|
327
327
|
margin: 0;
|
|
328
328
|
font-size: var(--font-size-base);
|
|
329
329
|
color: var(--msg-text-tertiary);
|
|
330
330
|
line-height: var(--line-height-relaxed);
|
|
331
331
|
}
|
|
332
332
|
|
|
333
|
-
.
|
|
333
|
+
.liveChat-home-featured-btn {
|
|
334
334
|
margin-top: var(--spacing-3);
|
|
335
335
|
}
|
|
336
336
|
|
|
337
|
-
.
|
|
337
|
+
.liveChat-home-changelog-section {
|
|
338
338
|
margin-top: var(--spacing-5);
|
|
339
339
|
display: flex;
|
|
340
340
|
flex-direction: column;
|
|
341
341
|
gap: var(--spacing-4);
|
|
342
342
|
}
|
|
343
343
|
|
|
344
|
-
.
|
|
344
|
+
.liveChat-home-changelog-card {
|
|
345
345
|
background: var(--msg-bg-surface);
|
|
346
346
|
border-radius: 8px;
|
|
347
347
|
overflow: hidden;
|
|
@@ -351,29 +351,29 @@
|
|
|
351
351
|
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
|
|
352
352
|
}
|
|
353
353
|
|
|
354
|
-
.
|
|
354
|
+
.liveChat-home-changelog-card:hover {
|
|
355
355
|
background: var(--msg-bg-hover);
|
|
356
356
|
}
|
|
357
357
|
|
|
358
|
-
.
|
|
358
|
+
.liveChat-home-changelog-card:active {
|
|
359
359
|
transform: translateY(1px);
|
|
360
360
|
transition-duration: 100ms;
|
|
361
361
|
}
|
|
362
362
|
|
|
363
|
-
.
|
|
363
|
+
.liveChat-home-changelog-cover {
|
|
364
364
|
width: 100%;
|
|
365
365
|
height: 140px;
|
|
366
366
|
overflow: hidden;
|
|
367
367
|
position: relative;
|
|
368
368
|
}
|
|
369
369
|
|
|
370
|
-
.
|
|
370
|
+
.liveChat-home-changelog-cover img {
|
|
371
371
|
width: 100%;
|
|
372
372
|
height: 100%;
|
|
373
373
|
object-fit: cover;
|
|
374
374
|
}
|
|
375
375
|
|
|
376
|
-
.
|
|
376
|
+
.liveChat-home-changelog-cover-text {
|
|
377
377
|
position: absolute;
|
|
378
378
|
bottom: var(--spacing-3);
|
|
379
379
|
left: var(--spacing-3);
|
|
@@ -385,12 +385,12 @@
|
|
|
385
385
|
line-height: var(--line-height-snug);
|
|
386
386
|
}
|
|
387
387
|
|
|
388
|
-
.
|
|
388
|
+
.liveChat-home-changelog-card-content {
|
|
389
389
|
padding: var(--spacing-4);
|
|
390
390
|
border-top: 1px solid var(--msg-border);
|
|
391
391
|
}
|
|
392
392
|
|
|
393
|
-
.
|
|
393
|
+
.liveChat-home-changelog-card-title {
|
|
394
394
|
margin: 0 0 var(--spacing-2);
|
|
395
395
|
font-size: var(--font-size-md);
|
|
396
396
|
font-weight: var(--font-weight-semibold);
|
|
@@ -398,7 +398,7 @@
|
|
|
398
398
|
line-height: var(--line-height-snug);
|
|
399
399
|
}
|
|
400
400
|
|
|
401
|
-
.
|
|
401
|
+
.liveChat-home-changelog-card-desc {
|
|
402
402
|
margin: 0;
|
|
403
403
|
font-size: var(--font-size-sm);
|
|
404
404
|
font-weight: var(--font-weight-normal);
|
|
@@ -410,8 +410,8 @@
|
|
|
410
410
|
overflow: hidden;
|
|
411
411
|
}
|
|
412
412
|
|
|
413
|
-
.
|
|
414
|
-
.
|
|
413
|
+
.liveChat-home-availability,
|
|
414
|
+
.liveChat-chat-availability {
|
|
415
415
|
display: flex;
|
|
416
416
|
align-items: center;
|
|
417
417
|
gap: var(--spacing-2);
|
|
@@ -420,7 +420,7 @@
|
|
|
420
420
|
color: var(--msg-text-secondary);
|
|
421
421
|
}
|
|
422
422
|
|
|
423
|
-
.
|
|
423
|
+
.liveChat-availability-dot {
|
|
424
424
|
width: 8px;
|
|
425
425
|
height: 8px;
|
|
426
426
|
border-radius: var(--radius-full);
|
|
@@ -429,16 +429,16 @@
|
|
|
429
429
|
display: block;
|
|
430
430
|
}
|
|
431
431
|
|
|
432
|
-
.
|
|
432
|
+
.liveChat-availability-online {
|
|
433
433
|
background: var(--color-success);
|
|
434
434
|
box-shadow: 0 0 0 2px var(--color-success-light);
|
|
435
435
|
}
|
|
436
436
|
|
|
437
|
-
.
|
|
437
|
+
.liveChat-availability-away {
|
|
438
438
|
background: var(--color-neutral-400);
|
|
439
439
|
}
|
|
440
440
|
|
|
441
|
-
.
|
|
441
|
+
.liveChat-availability-text {
|
|
442
442
|
opacity: 0.9;
|
|
443
443
|
}
|
|
444
444
|
|
|
@@ -446,7 +446,7 @@
|
|
|
446
446
|
CONVERSATIONS VIEW
|
|
447
447
|
======================================== */
|
|
448
448
|
|
|
449
|
-
.
|
|
449
|
+
.liveChat-conversations-header {
|
|
450
450
|
display: flex;
|
|
451
451
|
align-items: center;
|
|
452
452
|
justify-content: space-between;
|
|
@@ -457,7 +457,7 @@
|
|
|
457
457
|
overflow: hidden;
|
|
458
458
|
}
|
|
459
459
|
|
|
460
|
-
.
|
|
460
|
+
.liveChat-conversations-header h2 {
|
|
461
461
|
margin: 0;
|
|
462
462
|
font-size: var(--font-size-xl);
|
|
463
463
|
font-weight: var(--font-weight-semibold);
|
|
@@ -466,22 +466,22 @@
|
|
|
466
466
|
flex: 1;
|
|
467
467
|
}
|
|
468
468
|
|
|
469
|
-
.
|
|
469
|
+
.liveChat-conversations-body {
|
|
470
470
|
flex: 1;
|
|
471
471
|
overflow-y: auto;
|
|
472
472
|
padding: 0;
|
|
473
473
|
}
|
|
474
474
|
|
|
475
|
-
.
|
|
475
|
+
.liveChat-conversations-list {
|
|
476
476
|
display: flex;
|
|
477
477
|
flex-direction: column;
|
|
478
478
|
}
|
|
479
479
|
|
|
480
|
-
.
|
|
480
|
+
.liveChat-conversation-item + .liveChat-conversation-item {
|
|
481
481
|
border-top: 1px solid var(--msg-border);
|
|
482
482
|
}
|
|
483
483
|
|
|
484
|
-
.
|
|
484
|
+
.liveChat-conversation-item {
|
|
485
485
|
display: flex;
|
|
486
486
|
align-items: center;
|
|
487
487
|
gap: var(--spacing-3);
|
|
@@ -490,23 +490,23 @@
|
|
|
490
490
|
transition: background var(--transition-base);
|
|
491
491
|
}
|
|
492
492
|
|
|
493
|
-
.
|
|
493
|
+
.liveChat-conversation-item:hover {
|
|
494
494
|
background: var(--msg-bg-hover);
|
|
495
495
|
}
|
|
496
496
|
|
|
497
|
-
.
|
|
497
|
+
.liveChat-conversation-item:active {
|
|
498
498
|
transform: translateY(1px);
|
|
499
499
|
transition-duration: 100ms;
|
|
500
500
|
}
|
|
501
501
|
|
|
502
|
-
.
|
|
502
|
+
.liveChat-conversation-avatars {
|
|
503
503
|
flex-shrink: 0;
|
|
504
504
|
display: flex;
|
|
505
505
|
align-items: center;
|
|
506
506
|
align-self: stretch;
|
|
507
507
|
}
|
|
508
508
|
|
|
509
|
-
.
|
|
509
|
+
.liveChat-conversation-content {
|
|
510
510
|
flex: 1;
|
|
511
511
|
min-width: 0;
|
|
512
512
|
display: flex;
|
|
@@ -514,7 +514,7 @@
|
|
|
514
514
|
justify-content: center;
|
|
515
515
|
}
|
|
516
516
|
|
|
517
|
-
.
|
|
517
|
+
.liveChat-conversation-header {
|
|
518
518
|
display: flex;
|
|
519
519
|
align-items: center;
|
|
520
520
|
justify-content: space-between;
|
|
@@ -522,7 +522,7 @@
|
|
|
522
522
|
gap: var(--spacing-3);
|
|
523
523
|
}
|
|
524
524
|
|
|
525
|
-
.
|
|
525
|
+
.liveChat-conversation-title {
|
|
526
526
|
font-size: var(--font-size-sm);
|
|
527
527
|
font-weight: var(--font-weight-semibold);
|
|
528
528
|
color: var(--msg-text);
|
|
@@ -532,19 +532,19 @@
|
|
|
532
532
|
text-overflow: ellipsis;
|
|
533
533
|
}
|
|
534
534
|
|
|
535
|
-
.
|
|
535
|
+
.liveChat-conversation-time {
|
|
536
536
|
font-size: var(--font-size-sm);
|
|
537
537
|
color: var(--msg-text-tertiary);
|
|
538
538
|
flex-shrink: 0;
|
|
539
539
|
}
|
|
540
540
|
|
|
541
|
-
.
|
|
541
|
+
.liveChat-conversation-preview {
|
|
542
542
|
display: flex;
|
|
543
543
|
align-items: center;
|
|
544
544
|
gap: var(--spacing-2);
|
|
545
545
|
}
|
|
546
546
|
|
|
547
|
-
.
|
|
547
|
+
.liveChat-conversation-message {
|
|
548
548
|
font-size: var(--font-size-sm);
|
|
549
549
|
font-weight: 400;
|
|
550
550
|
color: var(--msg-text-secondary);
|
|
@@ -554,12 +554,12 @@
|
|
|
554
554
|
line-height: 1.4;
|
|
555
555
|
}
|
|
556
556
|
|
|
557
|
-
.
|
|
557
|
+
.liveChat-conversation-item.unread .liveChat-conversation-message {
|
|
558
558
|
color: var(--msg-text);
|
|
559
559
|
font-weight: 500;
|
|
560
560
|
}
|
|
561
561
|
|
|
562
|
-
.
|
|
562
|
+
.liveChat-unread-dot {
|
|
563
563
|
width: 8px;
|
|
564
564
|
height: 8px;
|
|
565
565
|
background: var(--color-primary);
|
|
@@ -567,12 +567,12 @@
|
|
|
567
567
|
flex-shrink: 0;
|
|
568
568
|
}
|
|
569
569
|
|
|
570
|
-
.
|
|
571
|
-
.
|
|
570
|
+
.liveChat-conversation-item.closed .liveChat-conversation-title,
|
|
571
|
+
.liveChat-conversation-item.closed .liveChat-conversation-message {
|
|
572
572
|
color: var(--msg-text-tertiary);
|
|
573
573
|
}
|
|
574
574
|
|
|
575
|
-
.
|
|
575
|
+
.liveChat-conversation-resolved-badge {
|
|
576
576
|
font-size: 0.6875rem;
|
|
577
577
|
font-weight: 500;
|
|
578
578
|
color: var(--color-success-dark);
|
|
@@ -582,11 +582,11 @@
|
|
|
582
582
|
flex-shrink: 0;
|
|
583
583
|
}
|
|
584
584
|
|
|
585
|
-
.
|
|
585
|
+
.liveChat-conversations-footer {
|
|
586
586
|
border-top: 1px solid var(--msg-border);
|
|
587
587
|
}
|
|
588
588
|
|
|
589
|
-
.
|
|
589
|
+
.liveChat-new-message-btn {
|
|
590
590
|
width: 100%;
|
|
591
591
|
display: flex;
|
|
592
592
|
align-items: center;
|
|
@@ -603,16 +603,16 @@
|
|
|
603
603
|
text-align: left;
|
|
604
604
|
}
|
|
605
605
|
|
|
606
|
-
.
|
|
606
|
+
.liveChat-new-message-btn:hover {
|
|
607
607
|
background: var(--msg-bg-hover);
|
|
608
608
|
}
|
|
609
609
|
|
|
610
|
-
.
|
|
610
|
+
.liveChat-new-message-btn:active {
|
|
611
611
|
transform: translateX(4px) translateY(1px);
|
|
612
612
|
transition-duration: 100ms;
|
|
613
613
|
}
|
|
614
614
|
|
|
615
|
-
.
|
|
615
|
+
.liveChat-new-message-btn span {
|
|
616
616
|
flex: 1;
|
|
617
617
|
text-align: left;
|
|
618
618
|
}
|
|
@@ -621,7 +621,7 @@
|
|
|
621
621
|
HELP VIEW
|
|
622
622
|
======================================== */
|
|
623
623
|
|
|
624
|
-
.
|
|
624
|
+
.liveChat-help-header {
|
|
625
625
|
display: flex;
|
|
626
626
|
flex-direction: column;
|
|
627
627
|
gap: var(--spacing-2);
|
|
@@ -633,7 +633,7 @@
|
|
|
633
633
|
overflow: hidden;
|
|
634
634
|
}
|
|
635
635
|
|
|
636
|
-
.
|
|
636
|
+
.liveChat-help-header::before {
|
|
637
637
|
content: '';
|
|
638
638
|
position: absolute;
|
|
639
639
|
top: -20px;
|
|
@@ -645,7 +645,7 @@
|
|
|
645
645
|
pointer-events: none;
|
|
646
646
|
}
|
|
647
647
|
|
|
648
|
-
.
|
|
648
|
+
.liveChat-help-header::after {
|
|
649
649
|
content: '';
|
|
650
650
|
position: absolute;
|
|
651
651
|
top: -10px;
|
|
@@ -657,33 +657,33 @@
|
|
|
657
657
|
pointer-events: none;
|
|
658
658
|
}
|
|
659
659
|
|
|
660
|
-
.
|
|
660
|
+
.liveChat-help-header-top {
|
|
661
661
|
display: flex;
|
|
662
662
|
align-items: center;
|
|
663
663
|
justify-content: center;
|
|
664
664
|
position: relative;
|
|
665
665
|
}
|
|
666
666
|
|
|
667
|
-
.
|
|
667
|
+
.liveChat-help-header-top h2 {
|
|
668
668
|
margin: 0;
|
|
669
669
|
font-size: var(--font-size-xl);
|
|
670
670
|
font-weight: var(--font-weight-semibold);
|
|
671
671
|
color: var(--msg-text);
|
|
672
672
|
}
|
|
673
673
|
|
|
674
|
-
.
|
|
674
|
+
.liveChat-help-close-btn {
|
|
675
675
|
position: absolute;
|
|
676
676
|
right: 0;
|
|
677
677
|
top: 50%;
|
|
678
678
|
transform: translateY(-50%);
|
|
679
679
|
}
|
|
680
680
|
|
|
681
|
-
.
|
|
681
|
+
.liveChat-help-search-wrap {
|
|
682
682
|
position: relative;
|
|
683
683
|
width: 100%;
|
|
684
684
|
}
|
|
685
685
|
|
|
686
|
-
.
|
|
686
|
+
.liveChat-help-search-icon {
|
|
687
687
|
position: absolute;
|
|
688
688
|
left: var(--spacing-3);
|
|
689
689
|
top: 50%;
|
|
@@ -694,7 +694,7 @@
|
|
|
694
694
|
pointer-events: none;
|
|
695
695
|
}
|
|
696
696
|
|
|
697
|
-
.
|
|
697
|
+
.liveChat-help-search-input {
|
|
698
698
|
width: 100%;
|
|
699
699
|
background: var(--msg-bg-input);
|
|
700
700
|
border: 1px solid var(--msg-border);
|
|
@@ -709,30 +709,30 @@
|
|
|
709
709
|
box-sizing: border-box;
|
|
710
710
|
}
|
|
711
711
|
|
|
712
|
-
.
|
|
712
|
+
.liveChat-help-search-input:focus {
|
|
713
713
|
border-color: var(--color-primary);
|
|
714
714
|
background: var(--msg-bg);
|
|
715
715
|
}
|
|
716
716
|
|
|
717
|
-
.
|
|
717
|
+
.liveChat-help-search-input::placeholder {
|
|
718
718
|
color: var(--msg-text-tertiary);
|
|
719
719
|
}
|
|
720
720
|
|
|
721
|
-
.
|
|
721
|
+
.liveChat-help-body {
|
|
722
722
|
flex: 1;
|
|
723
723
|
overflow-y: auto;
|
|
724
724
|
padding: 0;
|
|
725
725
|
}
|
|
726
726
|
|
|
727
|
-
.
|
|
727
|
+
.liveChat-help-collections-header {
|
|
728
728
|
display: none;
|
|
729
729
|
}
|
|
730
730
|
|
|
731
|
-
.
|
|
731
|
+
.liveChat-help-collections {
|
|
732
732
|
padding: 0;
|
|
733
733
|
}
|
|
734
734
|
|
|
735
|
-
.
|
|
735
|
+
.liveChat-help-collection {
|
|
736
736
|
display: flex;
|
|
737
737
|
align-items: center;
|
|
738
738
|
gap: var(--spacing-3);
|
|
@@ -742,16 +742,16 @@
|
|
|
742
742
|
border-bottom: 1px solid var(--msg-border);
|
|
743
743
|
}
|
|
744
744
|
|
|
745
|
-
.
|
|
745
|
+
.liveChat-help-collection:hover {
|
|
746
746
|
background: var(--msg-bg-hover);
|
|
747
747
|
}
|
|
748
748
|
|
|
749
|
-
.
|
|
749
|
+
.liveChat-help-collection:active {
|
|
750
750
|
transform: translateY(1px);
|
|
751
751
|
transition-duration: 100ms;
|
|
752
752
|
}
|
|
753
753
|
|
|
754
|
-
.
|
|
754
|
+
.liveChat-help-collection-icon {
|
|
755
755
|
flex-shrink: 0;
|
|
756
756
|
width: 2.25rem;
|
|
757
757
|
height: 2.25rem;
|
|
@@ -761,14 +761,14 @@
|
|
|
761
761
|
color: var(--msg-text-secondary);
|
|
762
762
|
}
|
|
763
763
|
|
|
764
|
-
.
|
|
764
|
+
.liveChat-help-collection-icon svg {
|
|
765
765
|
width: 1.5rem;
|
|
766
766
|
height: 1.5rem;
|
|
767
767
|
display: block;
|
|
768
768
|
flex-shrink: 0;
|
|
769
769
|
}
|
|
770
770
|
|
|
771
|
-
.
|
|
771
|
+
.liveChat-help-collection-icon iconify-icon {
|
|
772
772
|
font-size: 1.5rem;
|
|
773
773
|
width: 1em;
|
|
774
774
|
height: 1em;
|
|
@@ -776,12 +776,12 @@
|
|
|
776
776
|
flex-shrink: 0;
|
|
777
777
|
}
|
|
778
778
|
|
|
779
|
-
.
|
|
779
|
+
.liveChat-help-collection-content {
|
|
780
780
|
flex: 1;
|
|
781
781
|
min-width: 0;
|
|
782
782
|
}
|
|
783
783
|
|
|
784
|
-
.
|
|
784
|
+
.liveChat-help-collection-title {
|
|
785
785
|
font-size: var(--font-size-base);
|
|
786
786
|
font-weight: var(--font-weight-semibold);
|
|
787
787
|
color: var(--msg-text);
|
|
@@ -791,7 +791,7 @@
|
|
|
791
791
|
text-overflow: ellipsis;
|
|
792
792
|
}
|
|
793
793
|
|
|
794
|
-
.
|
|
794
|
+
.liveChat-help-collection-desc {
|
|
795
795
|
margin: 2px 0 var(--spacing-1);
|
|
796
796
|
font-size: var(--font-size-sm);
|
|
797
797
|
color: var(--msg-text-secondary);
|
|
@@ -804,35 +804,35 @@
|
|
|
804
804
|
text-overflow: ellipsis;
|
|
805
805
|
}
|
|
806
806
|
|
|
807
|
-
.
|
|
807
|
+
.liveChat-help-collection-meta {
|
|
808
808
|
display: flex;
|
|
809
809
|
align-items: center;
|
|
810
810
|
gap: var(--spacing-2);
|
|
811
811
|
margin-top: 2px;
|
|
812
812
|
}
|
|
813
813
|
|
|
814
|
-
.
|
|
814
|
+
.liveChat-help-collection-avatar {
|
|
815
815
|
display: none;
|
|
816
816
|
}
|
|
817
817
|
|
|
818
|
-
.
|
|
818
|
+
.liveChat-help-collection-avatar--initials {
|
|
819
819
|
display: none;
|
|
820
820
|
line-height: 1;
|
|
821
821
|
}
|
|
822
822
|
|
|
823
|
-
.
|
|
823
|
+
.liveChat-help-collection-count {
|
|
824
824
|
font-size: var(--font-size-xs);
|
|
825
825
|
font-weight: var(--font-weight-medium);
|
|
826
826
|
color: var(--msg-text-tertiary);
|
|
827
827
|
}
|
|
828
828
|
|
|
829
|
-
.
|
|
829
|
+
.liveChat-help-footer {
|
|
830
830
|
padding: var(--spacing-4) var(--spacing-5);
|
|
831
831
|
border-top: 1px solid var(--msg-border);
|
|
832
832
|
text-align: center;
|
|
833
833
|
}
|
|
834
834
|
|
|
835
|
-
.
|
|
835
|
+
.liveChat-help-footer-link {
|
|
836
836
|
display: inline-flex;
|
|
837
837
|
align-items: center;
|
|
838
838
|
gap: var(--spacing-2);
|
|
@@ -844,7 +844,7 @@
|
|
|
844
844
|
transition: color var(--transition-base);
|
|
845
845
|
}
|
|
846
846
|
|
|
847
|
-
.
|
|
847
|
+
.liveChat-help-footer-link:hover {
|
|
848
848
|
color: var(--color-primary);
|
|
849
849
|
}
|
|
850
850
|
|
|
@@ -852,7 +852,7 @@
|
|
|
852
852
|
CHANGELOG VIEW
|
|
853
853
|
======================================== */
|
|
854
854
|
|
|
855
|
-
.
|
|
855
|
+
.liveChat-changelog-header {
|
|
856
856
|
padding: var(--spacing-2) var(--spacing-5);
|
|
857
857
|
border-bottom: 1px solid var(--msg-border);
|
|
858
858
|
flex-shrink: 0;
|
|
@@ -861,7 +861,7 @@
|
|
|
861
861
|
overflow: hidden;
|
|
862
862
|
}
|
|
863
863
|
|
|
864
|
-
.
|
|
864
|
+
.liveChat-changelog-header::before {
|
|
865
865
|
content: '';
|
|
866
866
|
position: absolute;
|
|
867
867
|
top: -20px;
|
|
@@ -873,7 +873,7 @@
|
|
|
873
873
|
pointer-events: none;
|
|
874
874
|
}
|
|
875
875
|
|
|
876
|
-
.
|
|
876
|
+
.liveChat-changelog-header::after {
|
|
877
877
|
content: '';
|
|
878
878
|
position: absolute;
|
|
879
879
|
top: -10px;
|
|
@@ -885,40 +885,40 @@
|
|
|
885
885
|
pointer-events: none;
|
|
886
886
|
}
|
|
887
887
|
|
|
888
|
-
.
|
|
888
|
+
.liveChat-changelog-header-top {
|
|
889
889
|
display: flex;
|
|
890
890
|
align-items: center;
|
|
891
891
|
justify-content: center;
|
|
892
892
|
position: relative;
|
|
893
893
|
}
|
|
894
894
|
|
|
895
|
-
.
|
|
895
|
+
.liveChat-changelog-header-top h2 {
|
|
896
896
|
margin: 0;
|
|
897
897
|
font-size: var(--font-size-xl);
|
|
898
898
|
font-weight: var(--font-weight-semibold);
|
|
899
899
|
color: var(--msg-text);
|
|
900
900
|
}
|
|
901
901
|
|
|
902
|
-
.
|
|
902
|
+
.liveChat-changelog-close-btn {
|
|
903
903
|
position: absolute;
|
|
904
904
|
right: 0;
|
|
905
905
|
top: 50%;
|
|
906
906
|
transform: translateY(-50%);
|
|
907
907
|
}
|
|
908
908
|
|
|
909
|
-
.
|
|
909
|
+
.liveChat-changelog-body {
|
|
910
910
|
flex: 1;
|
|
911
911
|
overflow-y: auto;
|
|
912
912
|
}
|
|
913
913
|
|
|
914
|
-
.
|
|
914
|
+
.liveChat-changelog-list {
|
|
915
915
|
display: flex;
|
|
916
916
|
flex-direction: column;
|
|
917
917
|
gap: var(--spacing-3);
|
|
918
918
|
padding: var(--spacing-4) var(--spacing-5);
|
|
919
919
|
}
|
|
920
920
|
|
|
921
|
-
.
|
|
921
|
+
.liveChat-changelog-card {
|
|
922
922
|
display: flex;
|
|
923
923
|
flex-direction: column;
|
|
924
924
|
border: 1px solid var(--msg-border);
|
|
@@ -928,43 +928,43 @@
|
|
|
928
928
|
transition: box-shadow var(--transition-base), transform var(--transition-base);
|
|
929
929
|
}
|
|
930
930
|
|
|
931
|
-
.
|
|
931
|
+
.liveChat-changelog-card:hover {
|
|
932
932
|
box-shadow: var(--shadow-md);
|
|
933
933
|
transform: translateY(-1px);
|
|
934
934
|
}
|
|
935
935
|
|
|
936
|
-
.
|
|
936
|
+
.liveChat-changelog-card:active {
|
|
937
937
|
transform: translateY(0);
|
|
938
938
|
transition-duration: 100ms;
|
|
939
939
|
}
|
|
940
940
|
|
|
941
|
-
.
|
|
941
|
+
.liveChat-changelog-content {
|
|
942
942
|
display: flex;
|
|
943
943
|
flex-direction: column;
|
|
944
944
|
gap: var(--spacing-1);
|
|
945
945
|
padding: var(--spacing-3) var(--spacing-4);
|
|
946
946
|
}
|
|
947
947
|
|
|
948
|
-
.
|
|
948
|
+
.liveChat-changelog-meta {
|
|
949
949
|
display: flex;
|
|
950
950
|
align-items: center;
|
|
951
951
|
gap: var(--spacing-2);
|
|
952
952
|
flex-wrap: wrap;
|
|
953
953
|
}
|
|
954
954
|
|
|
955
|
-
.
|
|
955
|
+
.liveChat-changelog-date {
|
|
956
956
|
font-size: var(--font-size-xs);
|
|
957
957
|
font-weight: var(--font-weight-medium);
|
|
958
958
|
color: var(--msg-text-tertiary);
|
|
959
959
|
}
|
|
960
960
|
|
|
961
|
-
.
|
|
961
|
+
.liveChat-changelog-tags {
|
|
962
962
|
display: flex;
|
|
963
963
|
flex-wrap: wrap;
|
|
964
964
|
gap: var(--spacing-1);
|
|
965
965
|
}
|
|
966
966
|
|
|
967
|
-
.
|
|
967
|
+
.liveChat-changelog-tag {
|
|
968
968
|
display: inline-flex;
|
|
969
969
|
align-items: center;
|
|
970
970
|
padding: 1px 8px;
|
|
@@ -974,7 +974,7 @@
|
|
|
974
974
|
line-height: 1.5;
|
|
975
975
|
}
|
|
976
976
|
|
|
977
|
-
.
|
|
977
|
+
.liveChat-changelog-title {
|
|
978
978
|
margin: 0;
|
|
979
979
|
font-size: var(--font-size-base);
|
|
980
980
|
font-weight: var(--font-weight-semibold);
|
|
@@ -982,7 +982,7 @@
|
|
|
982
982
|
line-height: var(--line-height-snug);
|
|
983
983
|
}
|
|
984
984
|
|
|
985
|
-
.
|
|
985
|
+
.liveChat-changelog-description {
|
|
986
986
|
margin: 0;
|
|
987
987
|
font-size: var(--font-size-sm);
|
|
988
988
|
color: var(--msg-text-secondary);
|
|
@@ -993,13 +993,13 @@
|
|
|
993
993
|
overflow: hidden;
|
|
994
994
|
}
|
|
995
995
|
|
|
996
|
-
.
|
|
996
|
+
.liveChat-changelog-thumb {
|
|
997
997
|
width: 100%;
|
|
998
998
|
overflow: hidden;
|
|
999
999
|
border-bottom: 1px solid var(--msg-border);
|
|
1000
1000
|
}
|
|
1001
1001
|
|
|
1002
|
-
.
|
|
1002
|
+
.liveChat-changelog-thumb img {
|
|
1003
1003
|
width: 100%;
|
|
1004
1004
|
height: 180px;
|
|
1005
1005
|
display: block;
|