yt-chat-components 1.2.1 → 1.2.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.
Files changed (41) hide show
  1. package/.idea/sonarlint/issuestore/index.pb +0 -7
  2. package/package.json +78 -80
  3. package/public/index.html +108 -108
  4. package/src/YtChatView/chatWidget/chatWindow/callInterface/index.module.css +50 -50
  5. package/src/YtChatView/chatWidget/chatWindow/callInterface/index.tsx +549 -549
  6. package/src/YtChatView/chatWidget/chatWindow/callInterface/style.ts +44 -44
  7. package/src/YtChatView/chatWidget/chatWindow/chatMessage/index.tsx +501 -501
  8. package/src/YtChatView/chatWidget/chatWindow/chatPlaceholder/index.tsx +23 -23
  9. package/src/YtChatView/chatWidget/chatWindow/controllers/index.ts +249 -249
  10. package/src/YtChatView/chatWidget/chatWindow/index.module.css +196 -196
  11. package/src/YtChatView/chatWidget/chatWindow/index.tsx +1186 -1185
  12. package/src/YtChatView/chatWidget/chatWindow/types/chatWidget/index.ts +50 -50
  13. package/src/YtChatView/chatWidget/index.tsx +2596 -2596
  14. package/src/YtChatView/logoBtn/index.css +3 -3
  15. package/src/YtChatView/logoBtn/index.jsx +103 -103
  16. package/src/YtChatView/logoSplitBtn/index.css +3 -3
  17. package/src/YtChatView/logoSplitBtn/index.jsx +105 -105
  18. package/src/YtChatView/mobileChat/index.jsx +945 -945
  19. package/src/YtChatView/mobileChat/index.module.css +253 -253
  20. package/src/YtChatView/previewDialog/index.jsx +601 -601
  21. package/src/YtChatView/previewDialog/index.module.css +253 -253
  22. package/src/chatWidget/chatWindow/index.tsx +426 -426
  23. package/src/chatWidget/index.tsx +2195 -2195
  24. package/src/index.tsx +127 -11
  25. package/webpack.config.js +50 -50
  26. package/.idea/sonarlint/issuestore/7/0/7030d0b2f71b999ff89a343de08c414af32fc93a +0 -0
  27. package/.idea/sonarlint/issuestore/8/e/8ec9a00bfd09b3190ac6b22251dbb1aa95a0579d +0 -0
  28. package/.idea/sonarlint/issuestore/9/c/9cfff9a6d27bd6c255aa751213163c7901fb8ce7 +0 -0
  29. package/build/asset-manifest.json +0 -19
  30. package/build/index.html +0 -1
  31. package/build/static/css/main.8ee59d98.css +0 -2
  32. package/build/static/css/main.8ee59d98.css.map +0 -1
  33. package/build/static/js/main.ae39ed55.js +0 -3
  34. package/build/static/js/main.ae39ed55.js.LICENSE.txt +0 -181
  35. package/build/static/js/main.ae39ed55.js.map +0 -1
  36. package/build/static/media/aiavatar.74bafa995cce4c01b804.png +0 -0
  37. package/build/static/media/history-list-empty.1eb65b1550aef4e8c8a4.png +0 -0
  38. package/build/static/media/icon_history_headerbg.50747e81d01257f55346.png +0 -0
  39. package/build/static/media/moreAi.285e66289f838072060c.png +0 -0
  40. package/build/static/media/moreBg.9fc998472925cecd89f2.png +0 -0
  41. package/build/static/media/phone.19bc6f0d2e9eae4863ae.png +0 -0
@@ -1,2596 +1,2596 @@
1
- // @ts-nocheck
2
- import { useRef, useState } from 'react';
3
- import ChatWindow from './chatWindow';
4
- import { ChatMessageType } from './chatWindow/types/chatWidget';
5
-
6
- export default function ChatWidget({
7
- is_enable_call,
8
- tags,
9
- getHistoryList,
10
- userInfo,
11
- api_key,
12
- output_type = 'chat',
13
- input_type = 'chat',
14
- output_component,
15
- host_url,
16
- flow_id,
17
- tweaks,
18
- send_icon_style,
19
- bot_message_style,
20
- user_message_style,
21
- chat_window_style,
22
- height,
23
- width,
24
- error_message_style,
25
- send_button_style,
26
- online,
27
- online_message,
28
- offline_message,
29
- window_title,
30
- chat_position,
31
- placeholder,
32
- input_style,
33
- placeholder_sending,
34
- input_container_style,
35
- additional_headers,
36
- session_id,
37
- start_open = false,
38
- setDropDownList,
39
- dropDownList,
40
- baseConfig,
41
- isShowVoiceButton,
42
- isShowUploadButton,
43
- dropManUrl,
44
- modalWidth,
45
- isMobile = false,
46
- isShowChatHeader = true,
47
- }: {
48
- is_enable_call:boolean,
49
- tags: [];
50
- getHistoryList: Function;
51
- userInfo: object;
52
- api_key?: string;
53
- input_value: string;
54
- output_type: string;
55
- input_type: string;
56
- output_component?: string;
57
- send_icon_style?: React.CSSProperties;
58
- chat_position?: string;
59
- bot_message_style?: React.CSSProperties;
60
- user_message_style?: React.CSSProperties;
61
- chat_window_style?: React.CSSProperties;
62
- online?: boolean;
63
- online_message?: string;
64
- offline_message?: string;
65
- height?: string;
66
- width?: number;
67
- window_title?: string;
68
- error_message_style?: React.CSSProperties;
69
- send_button_style?: React.CSSProperties;
70
- placeholder_sending?: string;
71
- placeholder?: string;
72
- input_style?: React.CSSProperties;
73
- input_container_style?: React.CSSProperties;
74
- host_url: string;
75
- flow_id: string;
76
- tweaks?: { [key: string]: any };
77
- additional_headers?: { [key: string]: string };
78
- session_id?: string;
79
- start_open?: boolean;
80
- baseConfig:object;
81
- isShowVoiceButton:boolean;
82
- isShowUploadButton:boolean;
83
- dropManUrl: string;
84
- modalWidth: number;
85
- isMobile: boolean;
86
- isShowChatHeader: boolean;
87
- }) {
88
- const [open, setOpen] = useState(start_open);
89
- const [messages, setMessages] = useState<ChatMessageType[]>([]);
90
- const sessionId = session_id;
91
-
92
- function updateLastMessage(message: ChatMessageType) {
93
- setMessages((prev) => {
94
- prev[prev.length - 1] = message;
95
- return [...prev];
96
- });
97
- }
98
-
99
- function addMessage(message: ChatMessageType) {
100
- setMessages((prev) => [...prev, message]);
101
- }
102
-
103
- function clearMessage() {
104
- setMessages([]);
105
- }
106
-
107
- const triggerRef = useRef<HTMLButtonElement>(null);
108
-
109
- const styles = `
110
-
111
- *,
112
- ::before,
113
- ::after {
114
- box-sizing: border-box;
115
- border-width: 0;
116
- border-style: solid;
117
- border-color: #e5e7eb;
118
- }
119
-
120
- abbr:where([title]) {
121
- -webkit-text-decoration: underline dotted;
122
- text-decoration: underline dotted;
123
- }
124
-
125
- b,
126
- strong {
127
- font-weight: bolder;
128
- }
129
-
130
- code,
131
- kbd,
132
- samp,
133
- pre {
134
- font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
135
- /* 1 */
136
- font-size: 1em;
137
- /* 2 */
138
- }
139
-
140
- small {
141
- font-size: 80%;
142
- }
143
-
144
- sub,
145
- sup {
146
- font-size: 75%;
147
- line-height: 0;
148
- position: relative;
149
- vertical-align: baseline;
150
- }
151
-
152
- sub {
153
- bottom: -0.25em;
154
- }
155
-
156
- sup {
157
- top: -0.5em;
158
- }
159
-
160
- button,
161
- input,
162
- optgroup,
163
- select,
164
- textarea {
165
- font-family: inherit;
166
- /* 1 */
167
- font-size: 100%;
168
- /* 1 */
169
- font-weight: inherit;
170
- /* 1 */
171
- line-height: inherit;
172
- /* 1 */
173
- color: inherit;
174
- /* 1 */
175
- margin: 0;
176
- /* 2 */
177
- padding: 0;
178
- /* 3 */
179
- }
180
-
181
- /*
182
- Remove the inheritance of text transform in Edge and Firefox.
183
- */
184
-
185
- button,
186
- select {
187
- text-transform: none;
188
- }
189
-
190
- /*
191
- 1. Correct the inability to style clickable types in iOS and Safari.
192
- 2. Remove default button styles.
193
- */
194
-
195
- button,
196
- [type='button'],
197
- [type='reset'],
198
- [type='submit'] {
199
- -webkit-appearance: button;
200
- /* 1 */
201
- // background-color: transparent;
202
- /* 2 */
203
- background-image: none;
204
- /* 2 */
205
- }
206
-
207
- /*
208
- Use the modern Firefox focus style for all focusable elements.
209
- */
210
-
211
- :-moz-focusring {
212
- outline: auto;
213
- }
214
-
215
- /*
216
- Remove the additional ':invalid' styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
217
- */
218
-
219
- :-moz-ui-invalid {
220
- box-shadow: none;
221
- }
222
-
223
- /*
224
- Add the correct vertical alignment in Chrome and Firefox.
225
- */
226
-
227
- progress {
228
- vertical-align: baseline;
229
- }
230
-
231
- /*
232
- Correct the cursor style of increment and decrement buttons in Safari.
233
- */
234
-
235
- ::-webkit-inner-spin-button,
236
- ::-webkit-outer-spin-button {
237
- height: auto;
238
- }
239
-
240
- /*
241
- 1. Correct the odd appearance in Chrome and Safari.
242
- 2. Correct the outline style in Safari.
243
- */
244
-
245
- [type='search'] {
246
- -webkit-appearance: textfield;
247
- /* 1 */
248
- outline-offset: -2px;
249
- /* 2 */
250
- }
251
-
252
- /*
253
- Remove the inner padding in Chrome and Safari on macOS.
254
- */
255
-
256
- ::-webkit-search-decoration {
257
- -webkit-appearance: none;
258
- }
259
-
260
- /*
261
- 1. Correct the inability to style clickable types in iOS and Safari.
262
- 2. Change font properties to 'inherit' in Safari.
263
- */
264
-
265
- ::-webkit-file-upload-button {
266
- -webkit-appearance: button;
267
- /* 1 */
268
- font: inherit;
269
- /* 2 */
270
- }
271
-
272
- /*
273
- Add the correct display in Chrome and Safari.
274
- */
275
-
276
- summary {
277
- display: list-item;
278
- }
279
-
280
- /*
281
- Removes the default spacing and border for appropriate elements.
282
- */
283
-
284
- fieldset {
285
- margin: 0;
286
- padding: 0;
287
- }
288
-
289
- legend {
290
- padding: 0;
291
- }
292
-
293
-
294
- /*
295
- Prevent resizing textareas horizontally by default.
296
- */
297
-
298
- textarea {
299
- resize: vertical;
300
- }
301
-
302
- /*
303
- 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
304
- 2. Set the default placeholder color to the user's configured gray 400 color.
305
- */
306
-
307
- input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
308
- opacity: 1;
309
- /* 1 */
310
- color: #9ca3af;
311
- /* 2 */
312
- }
313
-
314
- input::placeholder,
315
- textarea::placeholder {
316
- opacity: 1;
317
- /* 1 */
318
- color: #9ca3af;
319
- /* 2 */
320
- }
321
-
322
- /*
323
- Set the default cursor for buttons.
324
- */
325
-
326
- button,
327
- [role="button"] {
328
- cursor: pointer;
329
- }
330
-
331
- /*
332
- Make sure disabled buttons don't get the pointer cursor.
333
- */
334
-
335
- :disabled {
336
- cursor: default;
337
- }
338
-
339
- /*
340
- 1. Make replaced elements 'display: block' by default. (https://github.com/mozdevs/cssremedy/issues/14)
341
- 2. Add 'vertical-align: middle' to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
342
- This can trigger a poorly considered lint error in some tools but is included by design.
343
- */
344
-
345
-
346
- /*
347
- Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
348
- */
349
-
350
- img,
351
- video {
352
- max-width: 100%;
353
- height: auto;
354
- }
355
-
356
- /* Make elements with the HTML hidden attribute stay hidden by default */
357
-
358
- [hidden] {
359
- display: none;
360
- }
361
-
362
- .cl-window {
363
- border-radius: 1rem;
364
- padding-top: 1.8rem;
365
- padding-bottom: 1.2rem;
366
- }
367
-
368
- .cl-middle-container{
369
- height:100%;
370
- display: flex;
371
- flex-direction: column;
372
- overflow: hidden;
373
- border-left:0.5px solid #3850FF2E;
374
- border-right:0.5px solid #3850FF2E;
375
- padding-left:1.6rem;
376
- padding-right:1.6rem;
377
- }
378
-
379
-
380
- .cl-scale-100 {
381
- --tw-scale-x: 1;
382
- --tw-scale-y: 1;
383
- -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
384
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
385
- }
386
-
387
- .cl-scale-0 {
388
- --tw-scale-x: 0;
389
- --tw-scale-y: 0;
390
- -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
391
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
392
- }
393
-
394
-
395
- .cl-chat-window {
396
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
397
- "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
398
- sans-serif;
399
- position: absolute;
400
- transition-property: all;
401
- transition-duration: 300ms;
402
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
403
- }
404
-
405
- .cl-online-message {
406
- height: 0.5rem;
407
- width: 0.5rem;
408
- border-radius: 9999px;
409
- --tw-bg-opacity: 1;
410
- background-color: rgb(34 197 94 / var(--tw-bg-opacity));
411
- }
412
-
413
- .cl-offline-message {
414
- height: 0.5rem;
415
- width: 0.5rem;
416
- border-radius: 9999px;
417
- --tw-bg-opacity: 1;
418
- background-color: rgb(239 68 68 / var(--tw-bg-opacity));
419
- }
420
-
421
- .cl-send-icon {
422
- margin-right: 1.25rem;
423
- height: 1.5rem;
424
- width: 1.5rem;
425
- }
426
-
427
- .cl-notsending-message {
428
- stroke: #3b82f6;
429
- }
430
-
431
- .cl-notsending-message:hover {
432
- stroke: #60a5fa;
433
- }
434
-
435
- .cl-sending-message {
436
- stroke: #9ca3af;
437
- }
438
-
439
- .cl-header-subtitle {
440
- display: flex;
441
- align-items: center;
442
- gap: 0.5rem;
443
- font-size: 0.875rem;
444
- line-height: 1.25rem;
445
- font-weight: 300;
446
- color: rgb(107 114 128);
447
- }
448
-
449
- .cl-header {
450
- position:relative;
451
- display: flex;
452
- flex-direction: column;
453
- --tw-bg-opacity: 1;
454
- font-size: 1.125rem;
455
- line-height: 1.75rem;
456
- font-weight: 400;
457
- color: rgb(17 24 39);
458
- }
459
-
460
- .cl-header .header-title{
461
- display: flex;
462
- align-items: center;
463
- margin-bottom: 16px;
464
- font-size: 22px;
465
- font-weight: 600;
466
- }
467
-
468
- .cl-header .diamond {
469
- position: relative;
470
- display: inline-block;
471
- width: 20px;
472
- height: 20px;
473
- }
474
-
475
- .cl-header .diamond::before {
476
- content: '';
477
- position: absolute;
478
- top: 5px;
479
- left: 0;
480
- width: 10px;
481
- height: 10px;
482
- background-color: blue;
483
- transform: rotate(45deg);
484
- border-radius: 3px;
485
- }
486
-
487
- .cl-tips-wrapper {
488
- width:100%;
489
- display:flex;
490
- margin-top:0.81rem;
491
- flex-direction: row;
492
- position: relative;
493
- padding-bottom: 100px;
494
- z-index: 1;
495
- }
496
-
497
- .cl-tips-wrapper .drop-man-img {
498
- width: 35%;
499
- }
500
- .cl-tips-wrapper .drop-down-title {
501
- margin-top: 45px;
502
- font-family: PingFangSC, PingFang SC;
503
- font-weight: 500;
504
- font-size: 18px;
505
- color: #333333;
506
- line-height: 28px;
507
- text-align: left;
508
- font-style: normal;
509
- > div {
510
- margin-top: 15px;
511
- font-size: 12px;
512
- color: # 999;
513
- }
514
- }
515
-
516
- .cl-tips-wrapper .cl-drop-down-mobile {
517
- position: absolute;
518
- width:100%;
519
- top: 120px;
520
- }
521
-
522
- .cl-tips-wrapper .drop-down-list-mobile {
523
- display: flex;
524
- flex-direction: column;
525
- margin-top: 2rem;
526
- width:100%;
527
- align-items: end;
528
- }
529
-
530
- .drop-down-item-card-mobile {
531
- width: 85%;
532
- height: 3.4rem;
533
- padding: 0 0.6rem 0;
534
- border-radius:20px;
535
- border-top-left-radius: 0;
536
- background: url("https://trans-from-yuntu-resourse.oss-cn-beijing.aliyuncs.com/smartSchool/appCreator/ai/drop-down-item-card-bg.png");
537
- background-size: cover;
538
- background-position: center;
539
- background-repeat: no-repeat;
540
- margin-bottom: 20px;
541
-
542
- display:flex;
543
- align-items: center;
544
- }
545
- .drop-down-item-title-mobile {
546
- font-family: PingFangSC, PingFang SC;
547
- font-weight: 400;
548
- font-size: 13px;
549
- color: #000000;
550
- line-height: 17px;
551
- text-align: left;
552
- font-style: normal;
553
- width: 100%;
554
- margin-bottom:0 !important;
555
- }
556
-
557
- .drop-down-item-bottom-img-mobile{
558
- width:3.5rem;
559
- height:2.5rem;
560
- }
561
-
562
- .cl-drop-man{
563
- width:100%;
564
- display:flex;
565
- margin-top:0.81rem;
566
- }
567
- .cl-drop-man .drop-man-img{
568
- height:340px;
569
- margin-right: 4rem;
570
- margin-left: 3rem;
571
- }
572
-
573
- .cl-drop-man .cl-drop-down .drop-down-item-card .drop-down-item-bottom-img{
574
- height:3.4rem;
575
- margin-right:20px;
576
- }
577
-
578
- .cl-drop-man .drop-down-list{
579
- width:auto;
580
- display:flex;
581
- flex-direction:row;
582
- flex-wrap:wrap;
583
- }
584
-
585
- .cl-drop-man .cl-drop-down .drop-down-item-card{
586
- width:calc(50% - 0.65rem);
587
- }
588
-
589
- .cl-drop-man .cl-drop-down{
590
- flex:1;
591
- position:unset;
592
- border-bottom-left-radius: 0;
593
- }
594
-
595
- .cl-drop-horizontal{
596
- width:100%;
597
- display:flex;
598
- margin-top:0.81rem;
599
- }
600
-
601
- .cl-drop-horizontal .drop-man-img{
602
- height:340px;
603
- margin-right: 4rem;
604
- margin-left: 3rem;
605
- }
606
-
607
- .cl-drop-horizontal .drop-down-list{
608
- width:auto;
609
- display:flex;
610
- flex-direction:row;
611
- flex-wrap:wrap;
612
- }
613
-
614
- .cl-drop-horizontal .cl-drop-down .drop-down-item-card .drop-down-item-bottom-img{
615
- height:2.4rem;
616
- width:auto;
617
- margin-right:20px;
618
- }
619
-
620
- .cl-drop-horizontal .cl-drop-down{
621
- flex:1;
622
- position:unset;
623
- border-bottom-left-radius: 0;
624
- }
625
-
626
- .cl-drop-horizontal .cl-drop-down .drop-down-item-card{
627
- width:100%;
628
- height:unset;
629
- justify-content:unset;
630
- flex-direction:row;
631
- align-items: center;
632
- padding: 0.8rem 1.2rem 0.8rem;
633
- cursor:pointer;
634
- }
635
-
636
- .cl-drop-horizontal .drop-down-item-bottom-button{
637
- display:none;
638
- }
639
-
640
- .cl-drop-screen{
641
- width:100%;
642
- display:flex;
643
- margin-top:0.81rem;
644
- align-items: flex-start;
645
- }
646
-
647
- .cl-drop-screen .cl-drop-down .drop-down-item-card .drop-down-item-bottom-img{
648
- height:2.4rem;
649
- width:auto;
650
- margin-right:20px;
651
- }
652
-
653
- .cl-drop-screen .drop-man-img{
654
- height:340px;
655
- margin-right: 4rem;
656
- margin-left: 3rem;
657
- }
658
-
659
- .cl-drop-screen .cl-drop-down{
660
- flex:1;
661
- position:unset;
662
- border-bottom-left-radius: 0;
663
- }
664
-
665
- .cl-drop-screen .cl-drop-down .drop-down-item-card{
666
- width:calc(33% - 0.65rem);
667
- }
668
-
669
- .cl-drop-down {
670
- background: #FFFFFF;
671
- border-radius: 10px;
672
- box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05);
673
- z-index: 1;
674
- width: 100%;
675
- min-height: 50px;
676
- position: absolute;
677
- bottom: -14.7rem;
678
- padding:1.3rem;
679
- }
680
-
681
- .drop-down-title {
682
- font-weight: 500;
683
- font-size: 18px;
684
- color: #000000;
685
- line-height: 1.1;
686
- text-align: left;
687
- }
688
- .drop-down-list {
689
- display:flex;
690
- gap:1.3rem;
691
- margin-top:2rem;
692
- }
693
- .drop-down-item-card {
694
- width: 33%;
695
- padding: 1.2rem 1.2rem 0.3rem;
696
- height:7.5rem;
697
- font-weight: 400;
698
- font-size: 14px;
699
- color: #FFFFFF;
700
- line-height: 14px;
701
- text-align: left;
702
- border-radius:10px;
703
- background: url("https://trans-from-yuntu-resourse.oss-cn-beijing.aliyuncs.com/smartSchool/appCreator/ai/drop-down-item-card-bg.png");
704
- background-size: cover;
705
- background-position: center;
706
- background-repeat: no-repeat;
707
-
708
- display:flex;
709
- justify-content: space-between;
710
- flex-direction: column;
711
- }
712
- .drop-down-item-title {
713
- font-weight: 400;
714
- font-size: 16px;
715
- color: #000000;
716
- line-height: 20px;
717
- text-align: left;
718
- width: 100%;
719
- margin-bottom:0 !important;
720
- }
721
- .drop-down-item-bottom{
722
- display:flex;
723
- align-items: center;
724
- justify-content: space-between;
725
- flex-direction: row;
726
- // margin-top:1rem;
727
- align-items: center;
728
- }
729
-
730
- .drop-down-item-bottom-button{
731
- border-radius: 16px;
732
- line-height: 20px;
733
- text-align: left;
734
- width: 2rem;
735
- padding: 0.2rem 0.4rem 0.2rem 0.2rem;
736
- cursor: pointer;
737
- display: flex;
738
- justify-content: center;
739
- align-items: center
740
- }
741
-
742
- .drop-down-item-bottom-img{
743
- width:4rem;
744
- height:3.5rem;
745
- }
746
-
747
- @media screen and (max-width: 1000px){
748
- .drop-down-item-bottom-img {
749
- display:none;
750
- }
751
- .drop-down-item-bottom {
752
-
753
- margin-bottom:1rem;
754
- }
755
- }
756
-
757
- .cl-messages_container {
758
- position: relative;
759
- display: flex;
760
- height: 100%;
761
- flex-direction: column;
762
- overflow: scroll;
763
- overflow-x: clip;
764
- --tw-bg-opacity: 1;
765
- padding-left: 1rem;
766
- padding-right: 1rem;
767
- padding-top: 0.5rem;
768
- padding-bottom: 0.5rem;
769
- -ms-overflow-style: none;
770
- scrollbar-width: none;
771
- }
772
-
773
- .cl-messages_container::-webkit-scrollbar {
774
- display: none;
775
- }
776
-
777
- .cl-input_container {
778
- position: relative;
779
- display: flex;
780
- flex-direction: column;
781
- width: 100%;
782
- align-items: center;
783
- --tw-border-opacity: 1;
784
- --tw-bg-opacity: 1;
785
- border-top-right-radius: 50px;
786
- border-bottom-right-radius: 50px;
787
- }
788
-
789
- .cl-chat-message {
790
- display: flex;
791
- width: 100%;
792
- padding-top: 0.5rem;
793
- padding-bottom: 0.5rem;
794
- padding-left: 0.5rem;
795
- padding-right: 0.5rem;
796
- }
797
-
798
- @-webkit-keyframes pulse {
799
- 50% {
800
- opacity: .5;
801
- }
802
- }
803
-
804
- @keyframes pulse {
805
- 50% {
806
- opacity: .5;
807
- }
808
- }
809
-
810
- .cl-animate-pulse {
811
- -webkit-animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
812
- animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
813
- }
814
-
815
- .cl-justify-start {
816
- justify-content: flex-start;
817
- }
818
-
819
- .cl-justify-end {
820
- justify-content: flex-end;
821
- }
822
-
823
- .cl-input-element {
824
- height: 100%;
825
- width: 100%;
826
- padding-left: 1.25rem;
827
- padding-right: 1.25rem;
828
- padding-top: 0.25rem;
829
- padding-bottom: 0.25rem;
830
- font-weight: 300;
831
- background-color: #FFFFFF;
832
- color: rgb(17 24 39);
833
- border-top-left-radius: 50px;
834
- border-bottom-left-radius: 50px;
835
- transition: height 0.2s ease;
836
- }
837
- .cl-input-element::-webkit-scrollbar{
838
- width: 0 !important;
839
- }
840
-
841
- .cl-input-element::placeholder {
842
- line-height:45px;
843
- }
844
-
845
- .cl-input-element:focus {
846
- outline: 2px solid transparent;
847
- outline-offset: 2px;
848
- }
849
-
850
- .cl-input-element:focus::placeholder {
851
- line-height:unset;
852
- }
853
-
854
- .cl-user_message {
855
- width: -webkit-fit-content;
856
- width: -moz-fit-content;
857
- width: fit-content;
858
- -webkit-column-break-before: all;
859
- break-before: all;
860
- border-radius: 0.75rem;
861
- border-top-right-radius: 0.125rem;
862
- --tw-bg-opacity: 1;
863
- background-color: rgb(59 130 246 / var(--tw-bg-opacity));
864
- padding-left: 1rem;
865
- padding-right: 1rem;
866
- padding-top: 0.5rem;
867
- padding-bottom: 0.5rem;
868
- text-align: left;
869
- --tw-text-opacity: 1;
870
- color: rgb(255 255 255 / var(--tw-text-opacity));
871
- white-space: pre-line;
872
- }
873
-
874
- .cl-error_message {
875
- width: -webkit-fit-content;
876
- width: -moz-fit-content;
877
- width: fit-content;
878
- max-width: 90%;
879
- -webkit-column-break-before: all;
880
- break-before: all;
881
- border-radius: 0.75rem;
882
- border-top-left-radius: 0.125rem;
883
- --tw-bg-opacity: 1;
884
- background-color: rgb(248 113 113 / var(--tw-bg-opacity));
885
- padding-left: 1rem;
886
- padding-right: 1rem;
887
- padding-top: 0.5rem;
888
- padding-bottom: 0.5rem;
889
- text-align: left;
890
- --tw-text-opacity: 1;
891
- color: rgb(255 255 255 / var(--tw-text-opacity));
892
- }
893
-
894
- .cl-bot_message {
895
- width: -webkit-fit-content;
896
- width: -moz-fit-content;
897
- width: fit-content;
898
-
899
- -webkit-column-break-before: all;
900
- break-before: all;
901
- border-radius: 0.75rem;
902
- border-top-left-radius: 0.125rem;
903
- --tw-bg-opacity: 1;
904
- background-color: #FFFFFF;
905
- padding-left: 1rem;
906
- padding-right: 1rem;
907
- padding-top: 0.5rem;
908
- padding-bottom: 0.5rem;
909
- text-align: left;
910
- --tw-text-opacity: 1;
911
- color: rgb(31 41 55 / var(--tw-text-opacity));
912
- }
913
-
914
- .origin-bottom {
915
- -webkit-transform-origin: bottom;
916
- transform-origin: bottom;
917
- }
918
-
919
- .origin-bottom-left {
920
- -webkit-transform-origin: bottom left;
921
- transform-origin: bottom left;
922
- }
923
-
924
- .origin-bottom-right {
925
- -webkit-transform-origin: bottom right;
926
- transform-origin: bottom right;
927
- }
928
-
929
- .origin-center {
930
- -webkit-transform-origin: center;
931
- transform-origin: center;
932
- }
933
-
934
- .origin-top {
935
- -webkit-transform-origin: top;
936
- transform-origin: top;
937
- }
938
-
939
- .origin-top-left {
940
- -webkit-transform-origin: top left;
941
- transform-origin: top left;
942
- }
943
-
944
- .origin-top-right {
945
- -webkit-transform-origin: top right;
946
- transform-origin: top right;
947
- }
948
-
949
- .shadow {
950
- --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
951
- --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
952
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
953
- }
954
- input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
955
- color: rgb(156 163 175);
956
- opacity: 1; /* Firefox */
957
- }
958
-
959
- input:-ms-input-placeholder { /* Internet Explorer 10-11 */
960
- color: rgb(156 163 175);
961
- }
962
-
963
- input::-ms-input-placeholder { /* Microsoft Edge */
964
- color: rgb(156 163 175);
965
- }
966
- `;
967
-
968
- const markdownBody = `
969
-
970
- .markdown-body {
971
- --base-size-4: 0.25rem;
972
- --base-size-8: 0.5rem;
973
- --base-size-16: 1rem;
974
- --base-text-weight-normal: 400;
975
- --base-text-weight-medium: 500;
976
- --base-text-weight-semibold: 600;
977
- --fontStack-monospace: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
978
- }
979
-
980
- @media (prefers-color-scheme: dark) {
981
- .markdown-body,
982
- [data-theme="dark"] {
983
- /*dark*/
984
- color-scheme: dark;
985
- --focus-outlineColor: #1f6feb;
986
- --fgColor-default: #e6edf3;
987
- --fgColor-muted: #8d96a0;
988
- --fgColor-accent: #4493f8;
989
- --fgColor-success: #3fb950;
990
- --fgColor-attention: #d29922;
991
- --fgColor-danger: #f85149;
992
- --fgColor-done: #ab7df8;
993
- --bgColor-default: #0d1117;
994
- --bgColor-muted: #161b22;
995
- --bgColor-neutral-muted: #6e768166;
996
- --bgColor-attention-muted: #bb800926;
997
- --borderColor-default: #30363d;
998
- --borderColor-muted: #30363db3;
999
- --borderColor-neutral-muted: #6e768166;
1000
- --borderColor-accent-emphasis: #1f6feb;
1001
- --borderColor-success-emphasis: #238636;
1002
- --borderColor-attention-emphasis: #9e6a03;
1003
- --borderColor-danger-emphasis: #da3633;
1004
- --borderColor-done-emphasis: #8957e5;
1005
- --color-prettylights-syntax-comment: #8b949e;
1006
- --color-prettylights-syntax-constant: #79c0ff;
1007
- --color-prettylights-syntax-constant-other-reference-link: #a5d6ff;
1008
- --color-prettylights-syntax-entity: #d2a8ff;
1009
- --color-prettylights-syntax-storage-modifier-import: #c9d1d9;
1010
- --color-prettylights-syntax-entity-tag: #7ee787;
1011
- --color-prettylights-syntax-keyword: #ff7b72;
1012
- --color-prettylights-syntax-string: #a5d6ff;
1013
- --color-prettylights-syntax-variable: #ffa657;
1014
- --color-prettylights-syntax-brackethighlighter-unmatched: #f85149;
1015
- --color-prettylights-syntax-brackethighlighter-angle: #8b949e;
1016
- --color-prettylights-syntax-invalid-illegal-text: #f0f6fc;
1017
- --color-prettylights-syntax-invalid-illegal-bg: #8e1519;
1018
- --color-prettylights-syntax-carriage-return-text: #f0f6fc;
1019
- --color-prettylights-syntax-carriage-return-bg: #b62324;
1020
- --color-prettylights-syntax-string-regexp: #7ee787;
1021
- --color-prettylights-syntax-markup-list: #f2cc60;
1022
- --color-prettylights-syntax-markup-heading: #1f6feb;
1023
- --color-prettylights-syntax-markup-italic: #c9d1d9;
1024
- --color-prettylights-syntax-markup-bold: #c9d1d9;
1025
- --color-prettylights-syntax-markup-deleted-text: #ffdcd7;
1026
- --color-prettylights-syntax-markup-deleted-bg: #67060c;
1027
- --color-prettylights-syntax-markup-inserted-text: #aff5b4;
1028
- --color-prettylights-syntax-markup-inserted-bg: #033a16;
1029
- --color-prettylights-syntax-markup-changed-text: #ffdfb6;
1030
- --color-prettylights-syntax-markup-changed-bg: #5a1e02;
1031
- --color-prettylights-syntax-markup-ignored-text: #c9d1d9;
1032
- --color-prettylights-syntax-markup-ignored-bg: #1158c7;
1033
- --color-prettylights-syntax-meta-diff-range: #d2a8ff;
1034
- --color-prettylights-syntax-sublimelinter-gutter-mark: #484f58;
1035
- }
1036
- }
1037
-
1038
- @media (prefers-color-scheme: light) {
1039
- .markdown-body,
1040
- [data-theme="light"] {
1041
- /*light*/
1042
- color-scheme: light;
1043
- --focus-outlineColor: #0969da;
1044
- --fgColor-default: #1f2328;
1045
- --fgColor-muted: #636c76;
1046
- --fgColor-accent: #0969da;
1047
- --fgColor-success: #1a7f37;
1048
- --fgColor-attention: #9a6700;
1049
- --fgColor-danger: #d1242f;
1050
- --fgColor-done: #8250df;
1051
- --bgColor-default: #ffffff;
1052
- --bgColor-muted: #f6f8fa;
1053
- --bgColor-neutral-muted: #afb8c133;
1054
- --bgColor-attention-muted: #fff8c5;
1055
- --borderColor-default: #d0d7de;
1056
- --borderColor-muted: #d0d7deb3;
1057
- --borderColor-neutral-muted: #afb8c133;
1058
- --borderColor-accent-emphasis: #0969da;
1059
- --borderColor-success-emphasis: #1a7f37;
1060
- --borderColor-attention-emphasis: #bf8700;
1061
- --borderColor-danger-emphasis: #cf222e;
1062
- --borderColor-done-emphasis: #8250df;
1063
- --color-prettylights-syntax-comment: #57606a;
1064
- --color-prettylights-syntax-constant: #0550ae;
1065
- --color-prettylights-syntax-constant-other-reference-link: #0a3069;
1066
- --color-prettylights-syntax-entity: #6639ba;
1067
- --color-prettylights-syntax-storage-modifier-import: #24292f;
1068
- --color-prettylights-syntax-entity-tag: #0550ae;
1069
- --color-prettylights-syntax-keyword: #cf222e;
1070
- --color-prettylights-syntax-string: #0a3069;
1071
- --color-prettylights-syntax-variable: #953800;
1072
- --color-prettylights-syntax-brackethighlighter-unmatched: #82071e;
1073
- --color-prettylights-syntax-brackethighlighter-angle: #57606a;
1074
- --color-prettylights-syntax-invalid-illegal-text: #f6f8fa;
1075
- --color-prettylights-syntax-invalid-illegal-bg: #82071e;
1076
- --color-prettylights-syntax-carriage-return-text: #f6f8fa;
1077
- --color-prettylights-syntax-carriage-return-bg: #cf222e;
1078
- --color-prettylights-syntax-string-regexp: #116329;
1079
- --color-prettylights-syntax-markup-list: #3b2300;
1080
- --color-prettylights-syntax-markup-heading: #0550ae;
1081
- --color-prettylights-syntax-markup-italic: #24292f;
1082
- --color-prettylights-syntax-markup-bold: #24292f;
1083
- --color-prettylights-syntax-markup-deleted-text: #82071e;
1084
- --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
1085
- --color-prettylights-syntax-markup-inserted-text: #116329;
1086
- --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
1087
- --color-prettylights-syntax-markup-changed-text: #953800;
1088
- --color-prettylights-syntax-markup-changed-bg: #ffd8b5;
1089
- --color-prettylights-syntax-markup-ignored-text: #eaeef2;
1090
- --color-prettylights-syntax-markup-ignored-bg: #0550ae;
1091
- --color-prettylights-syntax-meta-diff-range: #8250df;
1092
- --color-prettylights-syntax-sublimelinter-gutter-mark: #8c959f;
1093
- }
1094
- }
1095
-
1096
- .markdown-body {
1097
- -ms-text-size-adjust: 100%;
1098
- -webkit-text-size-adjust: 100%;
1099
- margin: 0;
1100
- font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
1101
- font-size: 16px;
1102
- line-height: 1.5;
1103
- word-wrap: break-word;
1104
- scroll-behavior: auto;
1105
- }
1106
-
1107
- .markdown-body .octicon {
1108
- display: inline-block;
1109
- fill: currentColor;
1110
- vertical-align: text-bottom;
1111
- }
1112
-
1113
- .markdown-body h1:hover .anchor .octicon-link:before,
1114
- .markdown-body h2:hover .anchor .octicon-link:before,
1115
- .markdown-body h3:hover .anchor .octicon-link:before,
1116
- .markdown-body h4:hover .anchor .octicon-link:before,
1117
- .markdown-body h5:hover .anchor .octicon-link:before,
1118
- .markdown-body h6:hover .anchor .octicon-link:before {
1119
- width: 16px;
1120
- height: 16px;
1121
- content: ' ';
1122
- display: inline-block;
1123
- background-color: currentColor;
1124
- -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg>");
1125
- mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg>");
1126
- }
1127
-
1128
- .markdown-body details,
1129
- .markdown-body figcaption,
1130
- .markdown-body figure {
1131
- display: block;
1132
- }
1133
-
1134
- .markdown-body summary {
1135
- display: list-item;
1136
- }
1137
-
1138
- .markdown-body [hidden] {
1139
- display: none !important;
1140
- }
1141
-
1142
- .markdown-body a {
1143
- background-color: transparent;
1144
- color: var(--fgColor-accent);
1145
- text-decoration: none;
1146
- }
1147
-
1148
- .markdown-body abbr[title] {
1149
- border-bottom: none;
1150
- -webkit-text-decoration: underline dotted;
1151
- text-decoration: underline dotted;
1152
- }
1153
-
1154
- .markdown-body b,
1155
- .markdown-body strong {
1156
- font-weight: var(--base-text-weight-semibold, 600);
1157
- }
1158
-
1159
- .markdown-body dfn {
1160
- font-style: italic;
1161
- }
1162
-
1163
- .markdown-body h1 {
1164
- margin: .67em 0;
1165
- font-weight: var(--base-text-weight-semibold, 600);
1166
- padding-bottom: .3em;
1167
- font-size: 2em;
1168
- border-bottom: 1px solid var(--borderColor-muted);
1169
- }
1170
-
1171
- .markdown-body mark {
1172
- background-color: var(--bgColor-attention-muted);
1173
- color: var(--fgColor-default);
1174
- }
1175
-
1176
- .markdown-body small {
1177
- font-size: 90%;
1178
- }
1179
-
1180
- .markdown-body sub,
1181
- .markdown-body sup {
1182
- font-size: 75%;
1183
- line-height: 0;
1184
- position: relative;
1185
- vertical-align: baseline;
1186
- }
1187
-
1188
- .markdown-body sub {
1189
- bottom: -0.25em;
1190
- }
1191
-
1192
- .markdown-body sup {
1193
- top: -0.5em;
1194
- }
1195
-
1196
- .markdown-body img {
1197
- border-style: none;
1198
- max-width: 100%;
1199
- box-sizing: content-box;
1200
- }
1201
-
1202
- .markdown-body code,
1203
- .markdown-body kbd,
1204
- .markdown-body pre,
1205
- .markdown-body samp {
1206
- font-family: monospace;
1207
- font-size: 1em;
1208
- }
1209
-
1210
- .markdown-body figure {
1211
- margin: 1em 40px;
1212
- }
1213
-
1214
- .markdown-body hr {
1215
- box-sizing: content-box;
1216
- overflow: hidden;
1217
- background: transparent;
1218
- border-bottom: 1px solid var(--borderColor-muted);
1219
- height: .25em;
1220
- padding: 0;
1221
- margin: 24px 0;
1222
- background-color: var(--borderColor-default);
1223
- border: 0;
1224
- }
1225
-
1226
- .markdown-body input {
1227
- font: inherit;
1228
- margin: 0;
1229
- overflow: visible;
1230
- font-family: inherit;
1231
- font-size: inherit;
1232
- line-height: inherit;
1233
- }
1234
-
1235
- .markdown-body [type=button],
1236
- .markdown-body [type=reset],
1237
- .markdown-body [type=submit] {
1238
- -webkit-appearance: button;
1239
- appearance: button;
1240
- }
1241
-
1242
- .markdown-body [type=checkbox],
1243
- .markdown-body [type=radio] {
1244
- box-sizing: border-box;
1245
- padding: 0;
1246
- }
1247
-
1248
- .markdown-body [type=number]::-webkit-inner-spin-button,
1249
- .markdown-body [type=number]::-webkit-outer-spin-button {
1250
- height: auto;
1251
- }
1252
-
1253
- .markdown-body [type=search]::-webkit-search-cancel-button,
1254
- .markdown-body [type=search]::-webkit-search-decoration {
1255
- -webkit-appearance: none;
1256
- appearance: none;
1257
- }
1258
-
1259
- .markdown-body ::-webkit-input-placeholder {
1260
- color: inherit;
1261
- opacity: .54;
1262
- }
1263
-
1264
- .markdown-body ::-webkit-file-upload-button {
1265
- -webkit-appearance: button;
1266
- appearance: button;
1267
- font: inherit;
1268
- }
1269
-
1270
- .markdown-body a:hover {
1271
- text-decoration: underline;
1272
- }
1273
-
1274
- .markdown-body ::placeholder {
1275
- color: var(--fgColor-muted);
1276
- opacity: 1;
1277
- }
1278
-
1279
- .markdown-body hr::before {
1280
- display: table;
1281
- content: "";
1282
- }
1283
-
1284
- .markdown-body hr::after {
1285
- display: table;
1286
- clear: both;
1287
- content: "";
1288
- }
1289
-
1290
- .markdown-body table {
1291
- border-spacing: 0;
1292
- border-collapse: collapse;
1293
- display: block;
1294
- width: max-content;
1295
- max-width: 100%;
1296
- overflow: auto;
1297
- }
1298
-
1299
- .markdown-body td,
1300
- .markdown-body th {
1301
- padding: 0;
1302
- }
1303
-
1304
- .markdown-body details summary {
1305
- cursor: pointer;
1306
- }
1307
-
1308
- .markdown-body details:not([open])>*:not(summary) {
1309
- display: none;
1310
- }
1311
-
1312
- .markdown-body a:focus,
1313
- .markdown-body [role=button]:focus,
1314
- .markdown-body input[type=radio]:focus,
1315
- .markdown-body input[type=checkbox]:focus {
1316
- outline: 2px solid var(--focus-outlineColor);
1317
- outline-offset: -2px;
1318
- box-shadow: none;
1319
- }
1320
-
1321
- .markdown-body a:focus:not(:focus-visible),
1322
- .markdown-body [role=button]:focus:not(:focus-visible),
1323
- .markdown-body input[type=radio]:focus:not(:focus-visible),
1324
- .markdown-body input[type=checkbox]:focus:not(:focus-visible) {
1325
- outline: solid 1px transparent;
1326
- }
1327
-
1328
- .markdown-body a:focus-visible,
1329
- .markdown-body [role=button]:focus-visible,
1330
- .markdown-body input[type=radio]:focus-visible,
1331
- .markdown-body input[type=checkbox]:focus-visible {
1332
- outline: 2px solid var(--focus-outlineColor);
1333
- outline-offset: -2px;
1334
- box-shadow: none;
1335
- }
1336
-
1337
- .markdown-body a:not([class]):focus,
1338
- .markdown-body a:not([class]):focus-visible,
1339
- .markdown-body input[type=radio]:focus,
1340
- .markdown-body input[type=radio]:focus-visible,
1341
- .markdown-body input[type=checkbox]:focus,
1342
- .markdown-body input[type=checkbox]:focus-visible {
1343
- outline-offset: 0;
1344
- }
1345
-
1346
- .markdown-body kbd {
1347
- display: inline-block;
1348
- padding: 3px 5px;
1349
- font: 11px var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);
1350
- line-height: 10px;
1351
- color: var(--fgColor-default);
1352
- vertical-align: middle;
1353
- background-color: var(--bgColor-muted);
1354
- border: solid 1px var(--borderColor-neutral-muted);
1355
- border-bottom-color: var(--borderColor-neutral-muted);
1356
- border-radius: 6px;
1357
- box-shadow: inset 0 -1px 0 var(--borderColor-neutral-muted);
1358
- }
1359
-
1360
- .markdown-body h1,
1361
- .markdown-body h2,
1362
- .markdown-body h3,
1363
- .markdown-body h4,
1364
- .markdown-body h5,
1365
- .markdown-body h6 {
1366
- margin-top: 24px;
1367
- margin-bottom: 16px;
1368
- font-weight: var(--base-text-weight-semibold, 600);
1369
- line-height: 1.25;
1370
- }
1371
-
1372
- .markdown-body h2 {
1373
- font-weight: var(--base-text-weight-semibold, 600);
1374
- padding-bottom: .3em;
1375
- font-size: 1.5em;
1376
- border-bottom: 1px solid var(--borderColor-muted);
1377
- }
1378
-
1379
- .markdown-body h3 {
1380
- font-weight: var(--base-text-weight-semibold, 600);
1381
- font-size: 1.25em;
1382
- }
1383
-
1384
- .markdown-body h4 {
1385
- font-weight: var(--base-text-weight-semibold, 600);
1386
- font-size: 1em;
1387
- }
1388
-
1389
- .markdown-body h5 {
1390
- font-weight: var(--base-text-weight-semibold, 600);
1391
- font-size: .875em;
1392
- }
1393
-
1394
- .markdown-body h6 {
1395
- font-weight: var(--base-text-weight-semibold, 600);
1396
- font-size: .85em;
1397
- color: var(--fgColor-muted);
1398
- }
1399
-
1400
- .markdown-body p {
1401
- margin-top: 0;
1402
- margin-bottom: 10px;
1403
- }
1404
-
1405
- .markdown-body blockquote {
1406
- margin: 0;
1407
- padding: 0 1em;
1408
- color: var(--fgColor-muted);
1409
- }
1410
-
1411
- .markdown-body ul,
1412
- .markdown-body ol {
1413
- margin-top: 0;
1414
- margin-bottom: 0;
1415
- padding-left: 2em;
1416
- }
1417
-
1418
- .markdown-body ol ol,
1419
- .markdown-body ul ol {
1420
- list-style-type: lower-roman;
1421
- }
1422
-
1423
- .markdown-body ul ul ol,
1424
- .markdown-body ul ol ol,
1425
- .markdown-body ol ul ol,
1426
- .markdown-body ol ol ol {
1427
- list-style-type: lower-alpha;
1428
- }
1429
-
1430
- .markdown-body dd {
1431
- margin-left: 0;
1432
- }
1433
-
1434
- .markdown-body tt,
1435
- .markdown-body code,
1436
- .markdown-body samp {
1437
- font-family: var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);
1438
- font-size: 12px;
1439
- }
1440
-
1441
- .markdown-body pre {
1442
- margin-top: 0;
1443
- margin-bottom: 0;
1444
- font-family: var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);
1445
- font-size: 12px;
1446
- word-wrap: normal;
1447
- }
1448
-
1449
- .markdown-body .octicon {
1450
- display: inline-block;
1451
- overflow: visible !important;
1452
- vertical-align: text-bottom;
1453
- fill: currentColor;
1454
- }
1455
-
1456
- .markdown-body input::-webkit-outer-spin-button,
1457
- .markdown-body input::-webkit-inner-spin-button {
1458
- margin: 0;
1459
- -webkit-appearance: none;
1460
- appearance: none;
1461
- }
1462
-
1463
- .markdown-body .mr-2 {
1464
- margin-right: var(--base-size-8, 8px) !important;
1465
- }
1466
-
1467
- .markdown-body::before {
1468
- display: table;
1469
- content: "";
1470
- }
1471
-
1472
- .markdown-body::after {
1473
- display: table;
1474
- clear: both;
1475
- content: "";
1476
- }
1477
-
1478
- .markdown-body>*:first-child {
1479
- margin-top: 0 !important;
1480
- }
1481
-
1482
- .markdown-body>*:last-child {
1483
- margin-bottom: 0 !important;
1484
- }
1485
-
1486
- .markdown-body a:not([href]) {
1487
- color: inherit;
1488
- text-decoration: none;
1489
- }
1490
-
1491
- .markdown-body .absent {
1492
- color: var(--fgColor-danger);
1493
- }
1494
-
1495
- .markdown-body .anchor {
1496
- float: left;
1497
- padding-right: 4px;
1498
- margin-left: -20px;
1499
- line-height: 1;
1500
- }
1501
-
1502
- .markdown-body .anchor:focus {
1503
- outline: none;
1504
- }
1505
-
1506
- .markdown-body p,
1507
- .markdown-body blockquote,
1508
- .markdown-body ul,
1509
- .markdown-body ol,
1510
- .markdown-body dl,
1511
- .markdown-body table,
1512
- .markdown-body pre,
1513
- .markdown-body details {
1514
- margin-top: 0;
1515
- margin-bottom: 16px;
1516
- }
1517
-
1518
- .markdown-body blockquote>:first-child {
1519
- margin-top: 0;
1520
- }
1521
-
1522
- .markdown-body blockquote>:last-child {
1523
- margin-bottom: 0;
1524
- }
1525
-
1526
- .markdown-body h1 .octicon-link,
1527
- .markdown-body h2 .octicon-link,
1528
- .markdown-body h3 .octicon-link,
1529
- .markdown-body h4 .octicon-link,
1530
- .markdown-body h5 .octicon-link,
1531
- .markdown-body h6 .octicon-link {
1532
- color: var(--fgColor-default);
1533
- vertical-align: middle;
1534
- visibility: hidden;
1535
- }
1536
-
1537
- .markdown-body h1:hover .anchor,
1538
- .markdown-body h2:hover .anchor,
1539
- .markdown-body h3:hover .anchor,
1540
- .markdown-body h4:hover .anchor,
1541
- .markdown-body h5:hover .anchor,
1542
- .markdown-body h6:hover .anchor {
1543
- text-decoration: none;
1544
- }
1545
-
1546
- .markdown-body h1:hover .anchor .octicon-link,
1547
- .markdown-body h2:hover .anchor .octicon-link,
1548
- .markdown-body h3:hover .anchor .octicon-link,
1549
- .markdown-body h4:hover .anchor .octicon-link,
1550
- .markdown-body h5:hover .anchor .octicon-link,
1551
- .markdown-body h6:hover .anchor .octicon-link {
1552
- visibility: visible;
1553
- }
1554
-
1555
- .markdown-body h1 tt,
1556
- .markdown-body h1 code,
1557
- .markdown-body h2 tt,
1558
- .markdown-body h2 code,
1559
- .markdown-body h3 tt,
1560
- .markdown-body h3 code,
1561
- .markdown-body h4 tt,
1562
- .markdown-body h4 code,
1563
- .markdown-body h5 tt,
1564
- .markdown-body h5 code,
1565
- .markdown-body h6 tt,
1566
- .markdown-body h6 code {
1567
- padding: 0 .2em;
1568
- font-size: inherit;
1569
- }
1570
-
1571
- .markdown-body summary h1,
1572
- .markdown-body summary h2,
1573
- .markdown-body summary h3,
1574
- .markdown-body summary h4,
1575
- .markdown-body summary h5,
1576
- .markdown-body summary h6 {
1577
- display: inline-block;
1578
- }
1579
-
1580
- .markdown-body summary h1 .anchor,
1581
- .markdown-body summary h2 .anchor,
1582
- .markdown-body summary h3 .anchor,
1583
- .markdown-body summary h4 .anchor,
1584
- .markdown-body summary h5 .anchor,
1585
- .markdown-body summary h6 .anchor {
1586
- margin-left: -40px;
1587
- }
1588
-
1589
- .markdown-body summary h1,
1590
- .markdown-body summary h2 {
1591
- padding-bottom: 0;
1592
- border-bottom: 0;
1593
- }
1594
-
1595
- .markdown-body ul.no-list,
1596
- .markdown-body ol.no-list {
1597
- padding: 0;
1598
- list-style-type: none;
1599
- }
1600
-
1601
- .markdown-body ol[type="a s"] {
1602
- list-style-type: lower-alpha;
1603
- }
1604
-
1605
- .markdown-body ol[type="A s"] {
1606
- list-style-type: upper-alpha;
1607
- }
1608
-
1609
- .markdown-body ol[type="i s"] {
1610
- list-style-type: lower-roman;
1611
- }
1612
-
1613
- .markdown-body ol[type="I s"] {
1614
- list-style-type: upper-roman;
1615
- }
1616
-
1617
- .markdown-body ol[type="1"] {
1618
- list-style-type: decimal;
1619
- }
1620
-
1621
- .markdown-body div>ol:not([type]) {
1622
- list-style-type: decimal;
1623
- }
1624
-
1625
- .markdown-body ul ul,
1626
- .markdown-body ul ol,
1627
- .markdown-body ol ol,
1628
- .markdown-body ol ul {
1629
- margin-top: 0;
1630
- margin-bottom: 0;
1631
- }
1632
-
1633
- .markdown-body li>p {
1634
- margin-top: 16px;
1635
- }
1636
-
1637
- .markdown-body li+li {
1638
- margin-top: .25em;
1639
- }
1640
-
1641
- .markdown-body dl {
1642
- padding: 0;
1643
- }
1644
-
1645
- .markdown-body dl dt {
1646
- padding: 0;
1647
- margin-top: 16px;
1648
- font-size: 1em;
1649
- font-style: italic;
1650
- font-weight: var(--base-text-weight-semibold, 600);
1651
- }
1652
-
1653
- .markdown-body dl dd {
1654
- padding: 0 16px;
1655
- margin-bottom: 16px;
1656
- }
1657
-
1658
- .markdown-body table th {
1659
- font-weight: var(--base-text-weight-semibold, 600);
1660
- }
1661
-
1662
- .markdown-body table th,
1663
- .markdown-body table td {
1664
- padding: 6px 13px;
1665
- border: 1px solid var(--borderColor-default);
1666
- }
1667
-
1668
- .markdown-body table td>:last-child {
1669
- margin-bottom: 0;
1670
- }
1671
-
1672
- .markdown-body table tr {
1673
- border-top: 1px solid var(--borderColor-muted);
1674
- }
1675
-
1676
- .markdown-body table img {
1677
- background-color: transparent;
1678
- }
1679
-
1680
- .markdown-body img[align=right] {
1681
- padding-left: 20px;
1682
- }
1683
-
1684
- .markdown-body img[align=left] {
1685
- padding-right: 20px;
1686
- }
1687
-
1688
- .markdown-body .emoji {
1689
- max-width: none;
1690
- vertical-align: text-top;
1691
- background-color: transparent;
1692
- }
1693
-
1694
- .markdown-body span.frame {
1695
- display: block;
1696
- overflow: hidden;
1697
- }
1698
-
1699
- .markdown-body span.frame>span {
1700
- display: block;
1701
- float: left;
1702
- width: auto;
1703
- padding: 7px;
1704
- margin: 13px 0 0;
1705
- overflow: hidden;
1706
- border: 1px solid var(--borderColor-default);
1707
- }
1708
-
1709
- .markdown-body span.frame span img {
1710
- display: block;
1711
- float: left;
1712
- }
1713
-
1714
- .markdown-body span.frame span span {
1715
- display: block;
1716
- padding: 5px 0 0;
1717
- clear: both;
1718
- color: var(--fgColor-default);
1719
- }
1720
-
1721
- .markdown-body span.align-center {
1722
- display: block;
1723
- overflow: hidden;
1724
- clear: both;
1725
- }
1726
-
1727
- .markdown-body span.align-center>span {
1728
- display: block;
1729
- margin: 13px auto 0;
1730
- overflow: hidden;
1731
- text-align: center;
1732
- }
1733
-
1734
- .markdown-body span.align-center span img {
1735
- margin: 0 auto;
1736
- text-align: center;
1737
- }
1738
-
1739
- .markdown-body span.align-right {
1740
- display: block;
1741
- overflow: hidden;
1742
- clear: both;
1743
- }
1744
-
1745
- .markdown-body span.align-right>span {
1746
- display: block;
1747
- margin: 13px 0 0;
1748
- overflow: hidden;
1749
- text-align: right;
1750
- }
1751
-
1752
- .markdown-body span.align-right span img {
1753
- margin: 0;
1754
- text-align: right;
1755
- }
1756
-
1757
- .markdown-body span.float-left {
1758
- display: block;
1759
- float: left;
1760
- margin-right: 13px;
1761
- overflow: hidden;
1762
- }
1763
-
1764
- .markdown-body span.float-left span {
1765
- margin: 13px 0 0;
1766
- }
1767
-
1768
- .markdown-body span.float-right {
1769
- display: block;
1770
- float: right;
1771
- margin-left: 13px;
1772
- overflow: hidden;
1773
- }
1774
-
1775
- .markdown-body span.float-right>span {
1776
- display: block;
1777
- margin: 13px auto 0;
1778
- overflow: hidden;
1779
- text-align: right;
1780
- }
1781
-
1782
- .markdown-body code,
1783
- .markdown-body tt {
1784
- padding: .2em .4em;
1785
- margin: 0;
1786
- font-size: 85%;
1787
- white-space: break-spaces;
1788
- background-color: var(--bgColor-neutral-muted);
1789
- border-radius: 6px;
1790
- }
1791
-
1792
- .markdown-body code br,
1793
- .markdown-body tt br {
1794
- display: none;
1795
- }
1796
-
1797
- .markdown-body del code {
1798
- text-decoration: inherit;
1799
- }
1800
-
1801
- .markdown-body samp {
1802
- font-size: 85%;
1803
- }
1804
-
1805
- .markdown-body pre code {
1806
- font-size: 100%;
1807
- }
1808
-
1809
- .markdown-body pre>code {
1810
- padding: 0;
1811
- margin: 0;
1812
- word-break: normal;
1813
- white-space: pre;
1814
- background: transparent;
1815
- border: 0;
1816
- }
1817
-
1818
- .markdown-body .highlight {
1819
- margin-bottom: 16px;
1820
- }
1821
-
1822
- .markdown-body .highlight pre {
1823
- margin-bottom: 0;
1824
- word-break: normal;
1825
- }
1826
-
1827
- .markdown-body .highlight pre,
1828
- .markdown-body pre {
1829
- padding: 16px;
1830
- overflow: auto;
1831
- font-size: 85%;
1832
- line-height: 1.45;
1833
- color: #000000 !important;
1834
- background-color: #ffffff !important;
1835
- <!-- color: var(&#45;&#45;fgColor-default);-->
1836
- <!-- background-color: var(&#45;&#45;bgColor-muted);-->
1837
- border-radius: 6px;
1838
- }
1839
-
1840
- .markdown-body pre code,
1841
- .markdown-body pre tt {
1842
- display: inline;
1843
- max-width: auto;
1844
- padding: 0;
1845
- margin: 0;
1846
- overflow: visible;
1847
- line-height: inherit;
1848
- word-wrap: normal;
1849
- background-color: transparent;
1850
- border: 0;
1851
- }
1852
-
1853
- .markdown-body .csv-data td,
1854
- .markdown-body .csv-data th {
1855
- padding: 5px;
1856
- overflow: hidden;
1857
- font-size: 12px;
1858
- line-height: 1;
1859
- text-align: left;
1860
- white-space: nowrap;
1861
- }
1862
-
1863
- .markdown-body .csv-data .blob-num {
1864
- padding: 10px 8px 9px;
1865
- text-align: right;
1866
- border: 0;
1867
- }
1868
-
1869
- .markdown-body .csv-data tr {
1870
- border-top: 0;
1871
- }
1872
-
1873
- .markdown-body .csv-data th {
1874
- font-weight: var(--base-text-weight-semibold, 600);
1875
- background: var(--bgColor-muted);
1876
- border-top: 0;
1877
- }
1878
-
1879
- .markdown-body [data-footnote-ref]::before {
1880
- content: "[";
1881
- }
1882
-
1883
- .markdown-body [data-footnote-ref]::after {
1884
- content: "]";
1885
- }
1886
-
1887
- .markdown-body .footnotes {
1888
- font-size: 12px;
1889
- color: var(--fgColor-muted);
1890
- border-top: 1px solid var(--borderColor-default);
1891
- }
1892
-
1893
- .markdown-body .footnotes ol {
1894
- padding-left: 16px;
1895
- }
1896
-
1897
- .markdown-body .footnotes ol ul {
1898
- display: inline-block;
1899
- padding-left: 16px;
1900
- margin-top: 16px;
1901
- }
1902
-
1903
- .markdown-body .footnotes li {
1904
- position: relative;
1905
- }
1906
-
1907
- .markdown-body .footnotes li:target::before {
1908
- position: absolute;
1909
- top: -8px;
1910
- right: -8px;
1911
- bottom: -8px;
1912
- left: -24px;
1913
- pointer-events: none;
1914
- content: "";
1915
- border: 2px solid var(--borderColor-accent-emphasis);
1916
- border-radius: 6px;
1917
- }
1918
-
1919
- .markdown-body .footnotes li:target {
1920
- color: var(--fgColor-default);
1921
- }
1922
-
1923
- .markdown-body .footnotes .data-footnote-backref g-emoji {
1924
- font-family: monospace;
1925
- }
1926
-
1927
- .markdown-body .pl-c {
1928
- color: var(--color-prettylights-syntax-comment);
1929
- }
1930
-
1931
- .markdown-body .pl-c1,
1932
- .markdown-body .pl-s .pl-v {
1933
- color: var(--color-prettylights-syntax-constant);
1934
- }
1935
-
1936
- .markdown-body .pl-e,
1937
- .markdown-body .pl-en {
1938
- color: var(--color-prettylights-syntax-entity);
1939
- }
1940
-
1941
- .markdown-body .pl-smi,
1942
- .markdown-body .pl-s .pl-s1 {
1943
- color: var(--color-prettylights-syntax-storage-modifier-import);
1944
- }
1945
-
1946
- .markdown-body .pl-ent {
1947
- color: var(--color-prettylights-syntax-entity-tag);
1948
- }
1949
-
1950
- .markdown-body .pl-k {
1951
- color: var(--color-prettylights-syntax-keyword);
1952
- }
1953
-
1954
- .markdown-body .pl-s,
1955
- .markdown-body .pl-pds,
1956
- .markdown-body .pl-s .pl-pse .pl-s1,
1957
- .markdown-body .pl-sr,
1958
- .markdown-body .pl-sr .pl-cce,
1959
- .markdown-body .pl-sr .pl-sre,
1960
- .markdown-body .pl-sr .pl-sra {
1961
- color: var(--color-prettylights-syntax-string);
1962
- }
1963
-
1964
- .markdown-body .pl-v,
1965
- .markdown-body .pl-smw {
1966
- color: var(--color-prettylights-syntax-variable);
1967
- }
1968
-
1969
- .markdown-body .pl-bu {
1970
- color: var(--color-prettylights-syntax-brackethighlighter-unmatched);
1971
- }
1972
-
1973
- .markdown-body .pl-ii {
1974
- color: var(--color-prettylights-syntax-invalid-illegal-text);
1975
- background-color: var(--color-prettylights-syntax-invalid-illegal-bg);
1976
- }
1977
-
1978
- .markdown-body .pl-c2 {
1979
- color: var(--color-prettylights-syntax-carriage-return-text);
1980
- background-color: var(--color-prettylights-syntax-carriage-return-bg);
1981
- }
1982
-
1983
- .markdown-body .pl-sr .pl-cce {
1984
- font-weight: bold;
1985
- color: var(--color-prettylights-syntax-string-regexp);
1986
- }
1987
-
1988
- .markdown-body .pl-ml {
1989
- color: var(--color-prettylights-syntax-markup-list);
1990
- }
1991
-
1992
- .markdown-body .pl-mh,
1993
- .markdown-body .pl-mh .pl-en,
1994
- .markdown-body .pl-ms {
1995
- font-weight: bold;
1996
- color: var(--color-prettylights-syntax-markup-heading);
1997
- }
1998
-
1999
- .markdown-body .pl-mi {
2000
- font-style: italic;
2001
- color: var(--color-prettylights-syntax-markup-italic);
2002
- }
2003
-
2004
- .markdown-body .pl-mb {
2005
- font-weight: bold;
2006
- color: var(--color-prettylights-syntax-markup-bold);
2007
- }
2008
-
2009
- .markdown-body .pl-md {
2010
- color: var(--color-prettylights-syntax-markup-deleted-text);
2011
- background-color: var(--color-prettylights-syntax-markup-deleted-bg);
2012
- }
2013
-
2014
- .markdown-body .pl-mi1 {
2015
- color: var(--color-prettylights-syntax-markup-inserted-text);
2016
- background-color: var(--color-prettylights-syntax-markup-inserted-bg);
2017
- }
2018
-
2019
- .markdown-body .pl-mc {
2020
- color: var(--color-prettylights-syntax-markup-changed-text);
2021
- background-color: var(--color-prettylights-syntax-markup-changed-bg);
2022
- }
2023
-
2024
- .markdown-body .pl-mi2 {
2025
- color: var(--color-prettylights-syntax-markup-ignored-text);
2026
- background-color: var(--color-prettylights-syntax-markup-ignored-bg);
2027
- }
2028
-
2029
- .markdown-body .pl-mdr {
2030
- font-weight: bold;
2031
- color: var(--color-prettylights-syntax-meta-diff-range);
2032
- }
2033
-
2034
- .markdown-body .pl-ba {
2035
- color: var(--color-prettylights-syntax-brackethighlighter-angle);
2036
- }
2037
-
2038
- .markdown-body .pl-sg {
2039
- color: var(--color-prettylights-syntax-sublimelinter-gutter-mark);
2040
- }
2041
-
2042
- .markdown-body .pl-corl {
2043
- text-decoration: underline;
2044
- color: var(--color-prettylights-syntax-constant-other-reference-link);
2045
- }
2046
-
2047
- .markdown-body [role=button]:focus:not(:focus-visible),
2048
- .markdown-body [role=tabpanel][tabindex="0"]:focus:not(:focus-visible),
2049
- .markdown-body button:focus:not(:focus-visible),
2050
- .markdown-body summary:focus:not(:focus-visible),
2051
- .markdown-body a:focus:not(:focus-visible) {
2052
- outline: none;
2053
- box-shadow: none;
2054
- }
2055
-
2056
- .markdown-body [tabindex="0"]:focus:not(:focus-visible),
2057
- .markdown-body details-dialog:focus:not(:focus-visible) {
2058
- outline: none;
2059
- }
2060
-
2061
- .markdown-body g-emoji {
2062
- display: inline-block;
2063
- min-width: 1ch;
2064
- font-family: "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
2065
- font-size: 1em;
2066
- font-style: normal !important;
2067
- font-weight: var(--base-text-weight-normal, 400);
2068
- line-height: 1;
2069
- vertical-align: -0.075em;
2070
- }
2071
-
2072
- .markdown-body g-emoji img {
2073
- width: 1em;
2074
- height: 1em;
2075
- }
2076
-
2077
- .markdown-body .task-list-item {
2078
- list-style-type: none;
2079
- }
2080
-
2081
- .markdown-body .task-list-item label {
2082
- font-weight: var(--base-text-weight-normal, 400);
2083
- }
2084
-
2085
- .markdown-body .task-list-item.enabled label {
2086
- cursor: pointer;
2087
- }
2088
-
2089
- .markdown-body .task-list-item+.task-list-item {
2090
- margin-top: var(--base-size-4);
2091
- }
2092
-
2093
- .markdown-body .task-list-item .handle {
2094
- display: none;
2095
- }
2096
-
2097
- .markdown-body .task-list-item-checkbox {
2098
- margin: 0 .2em .25em -1.4em;
2099
- vertical-align: middle;
2100
- }
2101
-
2102
- .markdown-body .contains-task-list:dir(rtl) .task-list-item-checkbox {
2103
- margin: 0 -1.6em .25em .2em;
2104
- }
2105
-
2106
- .markdown-body .contains-task-list {
2107
- position: relative;
2108
- }
2109
-
2110
- .markdown-body .contains-task-list:hover .task-list-item-convert-container,
2111
- .markdown-body .contains-task-list:focus-within .task-list-item-convert-container {
2112
- display: block;
2113
- width: auto;
2114
- height: 24px;
2115
- overflow: visible;
2116
- clip: auto;
2117
- }
2118
-
2119
- .markdown-body ::-webkit-calendar-picker-indicator {
2120
- filter: invert(50%);
2121
- }
2122
-
2123
- .markdown-body .markdown-alert {
2124
- padding: var(--base-size-8) var(--base-size-16);
2125
- margin-bottom: var(--base-size-16);
2126
- color: inherit;
2127
- border-left: .25em solid var(--borderColor-default);
2128
- }
2129
-
2130
- .markdown-body .markdown-alert>:first-child {
2131
- margin-top: 0;
2132
- }
2133
-
2134
- .markdown-body .markdown-alert>:last-child {
2135
- margin-bottom: 0;
2136
- }
2137
-
2138
- .markdown-body .markdown-alert .markdown-alert-title {
2139
- display: flex;
2140
- font-weight: var(--base-text-weight-medium, 500);
2141
- align-items: center;
2142
- line-height: 1;
2143
- }
2144
-
2145
- .markdown-body .markdown-alert.markdown-alert-note {
2146
- border-left-color: var(--borderColor-accent-emphasis);
2147
- }
2148
-
2149
- .markdown-body .markdown-alert.markdown-alert-note .markdown-alert-title {
2150
- color: var(--fgColor-accent);
2151
- }
2152
-
2153
- .markdown-body .markdown-alert.markdown-alert-important {
2154
- border-left-color: var(--borderColor-done-emphasis);
2155
- }
2156
-
2157
- .markdown-body .markdown-alert.markdown-alert-important .markdown-alert-title {
2158
- color: var(--fgColor-done);
2159
- }
2160
-
2161
- .markdown-body .markdown-alert.markdown-alert-warning {
2162
- border-left-color: var(--borderColor-attention-emphasis);
2163
- }
2164
-
2165
- .markdown-body .markdown-alert.markdown-alert-warning .markdown-alert-title {
2166
- color: var(--fgColor-attention);
2167
- }
2168
-
2169
- .markdown-body .markdown-alert.markdown-alert-tip {
2170
- border-left-color: var(--borderColor-success-emphasis);
2171
- }
2172
-
2173
- .markdown-body .markdown-alert.markdown-alert-tip .markdown-alert-title {
2174
- color: var(--fgColor-success);
2175
- }
2176
-
2177
- .markdown-body .markdown-alert.markdown-alert-caution {
2178
- border-left-color: var(--borderColor-danger-emphasis);
2179
- }
2180
-
2181
- .markdown-body .markdown-alert.markdown-alert-caution .markdown-alert-title {
2182
- color: var(--fgColor-danger);
2183
- }
2184
-
2185
- .markdown-body>*:first-child>.heading-element:first-child {
2186
- margin-top: 0 !important;
2187
- }`;
2188
-
2189
- const yt_style = `
2190
- .msg_userMessageBox {
2191
- width: fit-content;
2192
- max-width: 90%;
2193
- display: flex;
2194
- flex-direction: column;
2195
- align-items: flex-end;
2196
- }
2197
-
2198
- .msg_userMessageBox .msg_messageImgBox {
2199
- width: 100%;
2200
- display: flex;
2201
- flex-wrap: wrap;
2202
- justify-content: flex-end;
2203
- }
2204
-
2205
- .msg_userMessageBox .msg_messageImgBox .msg_messageImg {
2206
- border-radius: 5px;
2207
- }
2208
-
2209
- .msg_userMessageBox .msg_messageImgBox .msg_fileBox {
2210
- flex-shrink: 0;
2211
- pointer-events: auto;
2212
- position: relative;
2213
- width: 137px;
2214
- background-color: #f0f0f0;
2215
- border-radius: 10px;
2216
- margin: 3px 5px;
2217
- padding: 5px;
2218
- display: flex;
2219
- }
2220
-
2221
- .msg_userMessageBox .msg_messageImgBox .msg_fileBox:hover .msg_fileRemove {
2222
- display: block;
2223
- }
2224
-
2225
- .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileInfoBox {
2226
- margin-left: 10px;
2227
- overflow: hidden;
2228
- display: flex;
2229
- align-items: center;
2230
- }
2231
-
2232
- .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileInfoBox .msg_fileInfoFileName {
2233
- overflow: hidden;
2234
- text-overflow: ellipsis;
2235
- white-space: nowrap;
2236
- width: 72px;
2237
- color: #242424;
2238
- user-select: none;
2239
- }
2240
-
2241
- .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileInfoBox .msg_fileInfoMeta {
2242
- user-select: none;
2243
- color: #a8a8a8;
2244
- }
2245
-
2246
- .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileRemove {
2247
- display: none;
2248
- position: absolute;
2249
- cursor: pointer;
2250
- top: -2px;
2251
- right: 0;
2252
- z-index: 99999;
2253
- }
2254
-
2255
- .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileRemove img {
2256
- width: 20px;
2257
- }
2258
-
2259
- .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_upImg {
2260
- border-radius: 3px;
2261
- z-index: 510;
2262
- }
2263
-
2264
- .msg_operateBox {
2265
- display: flex;
2266
- margin-top: 5px;
2267
- user-select: none;
2268
- }
2269
-
2270
- .msg_operateBox img {
2271
- -webkit-user-drag: none;
2272
- margin-right: 3px;
2273
- cursor: pointer;
2274
- width: 16px;
2275
- }
2276
-
2277
- .plh_textBox {
2278
- display: flex;
2279
- justify-content: center;
2280
- align-content: center;
2281
- }
2282
-
2283
- .plh_textBox .plh_text {
2284
- font-weight: bold;
2285
- }
2286
-
2287
- .w_send_file_box {
2288
- height: 23px;
2289
- display: flex;
2290
- background: transparent;
2291
- align-items: center;
2292
- justify-content: center;
2293
- border-radius: 24px;
2294
- font-size: 12px;
2295
- color: #666666;
2296
- cursor: pointer;
2297
- }
2298
-
2299
- .w_file_preview {
2300
- width: 100%;
2301
- height: fit-content;
2302
- background-color: transparent;
2303
- z-index: 500;
2304
- display: flex;
2305
- justify-content: flex-start;
2306
- align-items: center;
2307
- padding: 0 5px;
2308
- overflow-x: hidden;
2309
- }
2310
-
2311
- .w_file_preview .w_directionBg {
2312
- position: absolute;
2313
- cursor: pointer;
2314
- width: 18px;
2315
- height: 18px;
2316
- background: #FFFFFF;
2317
- box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
2318
- border-radius: 5px;
2319
- border: 1px solid #F0F0F0;
2320
- z-index: 999999;
2321
- display: flex;
2322
- justify-content: center;
2323
- align-items: center;
2324
- }
2325
-
2326
- .w_file_preview .w_directionBg img {
2327
- width: 12px;
2328
- }
2329
-
2330
- .w_file_preview .w_toLeftBox {
2331
- position: absolute;
2332
- left: 0;
2333
- top: 6px;
2334
- height: 60px;
2335
- width: 80px;
2336
- background: linear-gradient(90deg, #FFFFFF 0%, #FFFFFF 25%, rgba(255,255,255,0) 100%);
2337
- z-index: 99999;
2338
- }
2339
-
2340
- .w_file_preview .w_toLeftBox .w_toLeft {
2341
- position: absolute;
2342
- cursor: pointer;
2343
- width: 18px;
2344
- height: 18px;
2345
- background: #FFFFFF;
2346
- box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
2347
- border-radius: 5px;
2348
- border: 1px solid #F0F0F0;
2349
- z-index: 999999;
2350
- display: flex;
2351
- justify-content: center;
2352
- align-items: center;
2353
- top: 25px;
2354
- left: 5px;
2355
- }
2356
-
2357
- .w_file_preview .w_toRightBox {
2358
- position: absolute;
2359
- right: 0;
2360
- top: 6px;
2361
- height: 60px;
2362
- width: 80px;
2363
- background: linear-gradient(-90deg, #FFFFFF 0%, #FFFFFF 25%, rgba(255, 255, 255, 0) 100%);
2364
- z-index: 99999;
2365
- }
2366
-
2367
- .w_file_preview .w_toRightBox .w_toRight {
2368
- position: absolute;
2369
- cursor: pointer;
2370
- width: 18px;
2371
- height: 18px;
2372
- background: #FFFFFF;
2373
- box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
2374
- border-radius: 5px;
2375
- border: 1px solid #F0F0F0;
2376
- z-index: 999999;
2377
- display: flex;
2378
- justify-content: center;
2379
- align-items: center;
2380
- top: 25px;
2381
- right: 5px;
2382
- }
2383
-
2384
- .w_file_preview .w_fileBox {
2385
- position: relative;
2386
- min-width: fit-content;
2387
- background-color: #f0f0f0;
2388
- border-radius: 10px;
2389
- margin: 10px 5px;
2390
- padding: 5px;
2391
- display: flex;
2392
- }
2393
-
2394
- .w_file_preview .w_fileBox:hover .w_fileRemove {
2395
- display: block;
2396
- }
2397
-
2398
- .w_file_preview .w_fileBox .w_fileInfoBox {
2399
- width: fit-content;
2400
- margin-left: 10px;
2401
- }
2402
-
2403
- .w_file_preview .w_fileBox .w_fileInfoBox .w_fileInfoFileName {
2404
- overflow: hidden;
2405
- text-overflow: ellipsis;
2406
- white-space: nowrap;
2407
- width: 110px;
2408
- color: #242424;
2409
- user-select: none;
2410
- }
2411
-
2412
- .w_file_preview .w_fileBox .w_fileInfoBox .w_fileInfoMeta {
2413
- width: fit-content;
2414
- user-select: none;
2415
- color: #a8a8a8;
2416
- white-space: nowrap;
2417
- }
2418
-
2419
- .w_file_preview .w_fileBox .w_fileRemove {
2420
- display: none;
2421
- position: absolute;
2422
- cursor: pointer;
2423
- top: -2px;
2424
- right: 0;
2425
- z-index: 99999;
2426
- }
2427
-
2428
- .w_file_preview .w_fileBox .w_fileRemove img {
2429
- width: 20px;
2430
- }
2431
-
2432
- .w_file_preview .w_fileBox .w_upImg {
2433
- border-radius: 3px;
2434
- z-index: 510;
2435
- }
2436
-
2437
- .w_tagListClass {
2438
- width: 100%;
2439
- height: fit-content;
2440
- display: flex;
2441
- align-items: center;
2442
- padding: 8px 0 8px 10px;
2443
- flex-wrap: wrap;
2444
- gap: 8px;
2445
- }
2446
- .w_tagListClass::-webkit-scrollbar {
2447
- height: 0px;
2448
- display: none;
2449
- background: transparent;
2450
- }
2451
- .w_tagListClass .w_tagItemBox {
2452
- padding: 8px 12px;
2453
- display: flex;
2454
- align-items: center;
2455
- justify-content: center;
2456
- width: fit-content;
2457
- height: 30px;
2458
- background: #00000000;
2459
- border-radius: 15px;
2460
- border: 1px solid #4B4FFF;
2461
- cursor: pointer;
2462
-
2463
- }
2464
- .w_tagListClass .w_tagItemBox:hover, .w_tagListClass .w_tagItemBox:active {
2465
- background: linear-gradient( 270deg, #828EFE 0%, #4B4FFF 100%);
2466
- }
2467
- .w_tagListClass .w_tagItemBox:hover .w_tagImgh,.w_tagListClass .w_tagItemBox:active .w_tagImgh {
2468
- filter: brightness(100);
2469
- }
2470
-
2471
- .w_tagListClass .w_tagItemBox:hover .w_tagItemText, .w_tagListClass .w_tagItemBox:active .w_tagItemText {
2472
- color: #fff;
2473
- }
2474
- .w_tagListClass .w_tagItemBox .w_tagImgh{
2475
- width: 16px;
2476
- height: 16px;
2477
- }
2478
- .w_tagListClass .w_tagItemBox .w_tagItemText {
2479
- width: fit-content;
2480
- padding-top: 2px;
2481
- color: #1552FF;
2482
- font-size: 14px;
2483
- }
2484
- .w_tagListClass .w_tagItemBox .w_tagImg {
2485
- margin-left: 6px;
2486
- width: 12px;
2487
- height: 12px;
2488
- background-repeat: no-repeat;
2489
- background-size: cover;
2490
- }
2491
-
2492
- .w_inputBox {
2493
- width: calc(100% - 16px);
2494
- margin: 0 auto 8px;
2495
- display: flex;
2496
- align-items: center;
2497
- box-shadow: 0px 2px 15px 0px rgba(0,48,187,0.1);
2498
- border-radius: 30px;
2499
- background: #FFFFFF;
2500
- transition: height 0.2s ease;
2501
- }
2502
- .w_inputBox textarea {
2503
- resize: none;
2504
- min-height: 48px;
2505
- max-height: 96px;
2506
- border: 0;
2507
- box-shadow: none !important;
2508
- color: #333;
2509
- outline: 0;
2510
- width: 100%;
2511
-
2512
- box-sizing: border-box;
2513
- overflow-y: auto; /* 允许垂直滚动 */
2514
- scrollbar-width: none; /* Firefox */
2515
- -ms-overflow-style: none; /* IE and Edge */
2516
- border-top-left-radius: 50px;
2517
- border-bottom-left-radius: 50px;
2518
- }
2519
-
2520
- .w_inputBox textarea::-webkit-scrollbar {
2521
- display: none;
2522
- }
2523
-
2524
- .w_send_voice_box {
2525
- height: 23px;
2526
- display: flex;
2527
- background: transparent;
2528
- align-items: center;
2529
- justify-content: center;
2530
- border-radius: 24px;
2531
- font-size: 12px;
2532
- color: #666666;
2533
- cursor: pointer;
2534
- margin-right: 10px;
2535
- }
2536
-
2537
- .w_send_voice_box .w_recordIng {
2538
- padding: 4px;
2539
- background: #1552FF;
2540
- border-radius: 8px;
2541
- }
2542
- `
2543
-
2544
- return (
2545
- <div style={{ position: 'relative',height:'100%' }}>
2546
- <style dangerouslySetInnerHTML={{ __html: styles + markdownBody + yt_style }}></style>
2547
- <ChatWindow
2548
- is_enable_call={is_enable_call}
2549
- tags={tags}
2550
- getHistoryList={getHistoryList}
2551
- userInfo={userInfo}
2552
- clearMessage={clearMessage}
2553
- api_key={api_key}
2554
- input_type={input_type}
2555
- output_type={output_type}
2556
- output_component={output_component}
2557
- open={open}
2558
- height={height}
2559
- width={width}
2560
- send_icon_style={send_icon_style}
2561
- bot_message_style={bot_message_style}
2562
- user_message_style={user_message_style}
2563
- chat_window_style={chat_window_style}
2564
- error_message_style={error_message_style}
2565
- send_button_style={send_button_style}
2566
- placeholder={placeholder}
2567
- input_style={input_style}
2568
- online={online}
2569
- online_message={online_message}
2570
- offline_message={offline_message}
2571
- placeholder_sending={placeholder_sending}
2572
- window_title={window_title}
2573
- input_container_style={input_container_style}
2574
- tweaks={tweaks}
2575
- flowId={flow_id}
2576
- hostUrl={host_url}
2577
- updateLastMessage={updateLastMessage}
2578
- addMessage={addMessage}
2579
- messages={messages}
2580
- triggerRef={triggerRef}
2581
- position={chat_position}
2582
- sessionId={sessionId}
2583
- additional_headers={additional_headers}
2584
- setDropDownList={setDropDownList}
2585
- dropDownList={dropDownList}
2586
- baseConfig={baseConfig}
2587
- isShowVoiceButton={isShowVoiceButton}
2588
- isShowUploadButton={isShowUploadButton}
2589
- dropManUrl={dropManUrl}
2590
- modalWidth={modalWidth}
2591
- isMobile={isMobile}
2592
- isShowChatHeader={isShowChatHeader}
2593
- />
2594
- </div>
2595
- );
2596
- }
1
+ // @ts-nocheck
2
+ import { useRef, useState } from 'react';
3
+ import ChatWindow from './chatWindow';
4
+ import { ChatMessageType } from './chatWindow/types/chatWidget';
5
+
6
+ export default function ChatWidget({
7
+ is_enable_call,
8
+ tags,
9
+ getHistoryList,
10
+ userInfo,
11
+ api_key,
12
+ output_type = 'chat',
13
+ input_type = 'chat',
14
+ output_component,
15
+ host_url,
16
+ flow_id,
17
+ tweaks,
18
+ send_icon_style,
19
+ bot_message_style,
20
+ user_message_style,
21
+ chat_window_style,
22
+ height,
23
+ width,
24
+ error_message_style,
25
+ send_button_style,
26
+ online,
27
+ online_message,
28
+ offline_message,
29
+ window_title,
30
+ chat_position,
31
+ placeholder,
32
+ input_style,
33
+ placeholder_sending,
34
+ input_container_style,
35
+ additional_headers,
36
+ session_id,
37
+ start_open = false,
38
+ setDropDownList,
39
+ dropDownList,
40
+ baseConfig,
41
+ isShowVoiceButton,
42
+ isShowUploadButton,
43
+ dropManUrl,
44
+ modalWidth,
45
+ isMobile = false,
46
+ isShowChatHeader = true,
47
+ }: {
48
+ is_enable_call:boolean,
49
+ tags: [];
50
+ getHistoryList: Function;
51
+ userInfo: object;
52
+ api_key?: string;
53
+ input_value: string;
54
+ output_type: string;
55
+ input_type: string;
56
+ output_component?: string;
57
+ send_icon_style?: React.CSSProperties;
58
+ chat_position?: string;
59
+ bot_message_style?: React.CSSProperties;
60
+ user_message_style?: React.CSSProperties;
61
+ chat_window_style?: React.CSSProperties;
62
+ online?: boolean;
63
+ online_message?: string;
64
+ offline_message?: string;
65
+ height?: string;
66
+ width?: number;
67
+ window_title?: string;
68
+ error_message_style?: React.CSSProperties;
69
+ send_button_style?: React.CSSProperties;
70
+ placeholder_sending?: string;
71
+ placeholder?: string;
72
+ input_style?: React.CSSProperties;
73
+ input_container_style?: React.CSSProperties;
74
+ host_url: string;
75
+ flow_id: string;
76
+ tweaks?: { [key: string]: any };
77
+ additional_headers?: { [key: string]: string };
78
+ session_id?: string;
79
+ start_open?: boolean;
80
+ baseConfig:object;
81
+ isShowVoiceButton:boolean;
82
+ isShowUploadButton:boolean;
83
+ dropManUrl: string;
84
+ modalWidth: number;
85
+ isMobile: boolean;
86
+ isShowChatHeader: boolean;
87
+ }) {
88
+ const [open, setOpen] = useState(start_open);
89
+ const [messages, setMessages] = useState<ChatMessageType[]>([]);
90
+ const sessionId = session_id;
91
+
92
+ function updateLastMessage(message: ChatMessageType) {
93
+ setMessages((prev) => {
94
+ prev[prev.length - 1] = message;
95
+ return [...prev];
96
+ });
97
+ }
98
+
99
+ function addMessage(message: ChatMessageType) {
100
+ setMessages((prev) => [...prev, message]);
101
+ }
102
+
103
+ function clearMessage() {
104
+ setMessages([]);
105
+ }
106
+
107
+ const triggerRef = useRef<HTMLButtonElement>(null);
108
+
109
+ const styles = `
110
+
111
+ *,
112
+ ::before,
113
+ ::after {
114
+ box-sizing: border-box;
115
+ border-width: 0;
116
+ border-style: solid;
117
+ border-color: #e5e7eb;
118
+ }
119
+
120
+ abbr:where([title]) {
121
+ -webkit-text-decoration: underline dotted;
122
+ text-decoration: underline dotted;
123
+ }
124
+
125
+ b,
126
+ strong {
127
+ font-weight: bolder;
128
+ }
129
+
130
+ code,
131
+ kbd,
132
+ samp,
133
+ pre {
134
+ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
135
+ /* 1 */
136
+ font-size: 1em;
137
+ /* 2 */
138
+ }
139
+
140
+ small {
141
+ font-size: 80%;
142
+ }
143
+
144
+ sub,
145
+ sup {
146
+ font-size: 75%;
147
+ line-height: 0;
148
+ position: relative;
149
+ vertical-align: baseline;
150
+ }
151
+
152
+ sub {
153
+ bottom: -0.25em;
154
+ }
155
+
156
+ sup {
157
+ top: -0.5em;
158
+ }
159
+
160
+ button,
161
+ input,
162
+ optgroup,
163
+ select,
164
+ textarea {
165
+ font-family: inherit;
166
+ /* 1 */
167
+ font-size: 100%;
168
+ /* 1 */
169
+ font-weight: inherit;
170
+ /* 1 */
171
+ line-height: inherit;
172
+ /* 1 */
173
+ color: inherit;
174
+ /* 1 */
175
+ margin: 0;
176
+ /* 2 */
177
+ padding: 0;
178
+ /* 3 */
179
+ }
180
+
181
+ /*
182
+ Remove the inheritance of text transform in Edge and Firefox.
183
+ */
184
+
185
+ button,
186
+ select {
187
+ text-transform: none;
188
+ }
189
+
190
+ /*
191
+ 1. Correct the inability to style clickable types in iOS and Safari.
192
+ 2. Remove default button styles.
193
+ */
194
+
195
+ button,
196
+ [type='button'],
197
+ [type='reset'],
198
+ [type='submit'] {
199
+ -webkit-appearance: button;
200
+ /* 1 */
201
+ // background-color: transparent;
202
+ /* 2 */
203
+ background-image: none;
204
+ /* 2 */
205
+ }
206
+
207
+ /*
208
+ Use the modern Firefox focus style for all focusable elements.
209
+ */
210
+
211
+ :-moz-focusring {
212
+ outline: auto;
213
+ }
214
+
215
+ /*
216
+ Remove the additional ':invalid' styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
217
+ */
218
+
219
+ :-moz-ui-invalid {
220
+ box-shadow: none;
221
+ }
222
+
223
+ /*
224
+ Add the correct vertical alignment in Chrome and Firefox.
225
+ */
226
+
227
+ progress {
228
+ vertical-align: baseline;
229
+ }
230
+
231
+ /*
232
+ Correct the cursor style of increment and decrement buttons in Safari.
233
+ */
234
+
235
+ ::-webkit-inner-spin-button,
236
+ ::-webkit-outer-spin-button {
237
+ height: auto;
238
+ }
239
+
240
+ /*
241
+ 1. Correct the odd appearance in Chrome and Safari.
242
+ 2. Correct the outline style in Safari.
243
+ */
244
+
245
+ [type='search'] {
246
+ -webkit-appearance: textfield;
247
+ /* 1 */
248
+ outline-offset: -2px;
249
+ /* 2 */
250
+ }
251
+
252
+ /*
253
+ Remove the inner padding in Chrome and Safari on macOS.
254
+ */
255
+
256
+ ::-webkit-search-decoration {
257
+ -webkit-appearance: none;
258
+ }
259
+
260
+ /*
261
+ 1. Correct the inability to style clickable types in iOS and Safari.
262
+ 2. Change font properties to 'inherit' in Safari.
263
+ */
264
+
265
+ ::-webkit-file-upload-button {
266
+ -webkit-appearance: button;
267
+ /* 1 */
268
+ font: inherit;
269
+ /* 2 */
270
+ }
271
+
272
+ /*
273
+ Add the correct display in Chrome and Safari.
274
+ */
275
+
276
+ summary {
277
+ display: list-item;
278
+ }
279
+
280
+ /*
281
+ Removes the default spacing and border for appropriate elements.
282
+ */
283
+
284
+ fieldset {
285
+ margin: 0;
286
+ padding: 0;
287
+ }
288
+
289
+ legend {
290
+ padding: 0;
291
+ }
292
+
293
+
294
+ /*
295
+ Prevent resizing textareas horizontally by default.
296
+ */
297
+
298
+ textarea {
299
+ resize: vertical;
300
+ }
301
+
302
+ /*
303
+ 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
304
+ 2. Set the default placeholder color to the user's configured gray 400 color.
305
+ */
306
+
307
+ input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
308
+ opacity: 1;
309
+ /* 1 */
310
+ color: #9ca3af;
311
+ /* 2 */
312
+ }
313
+
314
+ input::placeholder,
315
+ textarea::placeholder {
316
+ opacity: 1;
317
+ /* 1 */
318
+ color: #9ca3af;
319
+ /* 2 */
320
+ }
321
+
322
+ /*
323
+ Set the default cursor for buttons.
324
+ */
325
+
326
+ button,
327
+ [role="button"] {
328
+ cursor: pointer;
329
+ }
330
+
331
+ /*
332
+ Make sure disabled buttons don't get the pointer cursor.
333
+ */
334
+
335
+ :disabled {
336
+ cursor: default;
337
+ }
338
+
339
+ /*
340
+ 1. Make replaced elements 'display: block' by default. (https://github.com/mozdevs/cssremedy/issues/14)
341
+ 2. Add 'vertical-align: middle' to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
342
+ This can trigger a poorly considered lint error in some tools but is included by design.
343
+ */
344
+
345
+
346
+ /*
347
+ Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
348
+ */
349
+
350
+ img,
351
+ video {
352
+ max-width: 100%;
353
+ height: auto;
354
+ }
355
+
356
+ /* Make elements with the HTML hidden attribute stay hidden by default */
357
+
358
+ [hidden] {
359
+ display: none;
360
+ }
361
+
362
+ .cl-window {
363
+ border-radius: 1rem;
364
+ padding-top: 1.8rem;
365
+ padding-bottom: 1.2rem;
366
+ }
367
+
368
+ .cl-middle-container{
369
+ height:100%;
370
+ display: flex;
371
+ flex-direction: column;
372
+ overflow: hidden;
373
+ border-left:0.5px solid #3850FF2E;
374
+ border-right:0.5px solid #3850FF2E;
375
+ padding-left:1.6rem;
376
+ padding-right:1.6rem;
377
+ }
378
+
379
+
380
+ .cl-scale-100 {
381
+ --tw-scale-x: 1;
382
+ --tw-scale-y: 1;
383
+ -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
384
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
385
+ }
386
+
387
+ .cl-scale-0 {
388
+ --tw-scale-x: 0;
389
+ --tw-scale-y: 0;
390
+ -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
391
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
392
+ }
393
+
394
+
395
+ .cl-chat-window {
396
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
397
+ "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
398
+ sans-serif;
399
+ position: absolute;
400
+ transition-property: all;
401
+ transition-duration: 300ms;
402
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
403
+ }
404
+
405
+ .cl-online-message {
406
+ height: 0.5rem;
407
+ width: 0.5rem;
408
+ border-radius: 9999px;
409
+ --tw-bg-opacity: 1;
410
+ background-color: rgb(34 197 94 / var(--tw-bg-opacity));
411
+ }
412
+
413
+ .cl-offline-message {
414
+ height: 0.5rem;
415
+ width: 0.5rem;
416
+ border-radius: 9999px;
417
+ --tw-bg-opacity: 1;
418
+ background-color: rgb(239 68 68 / var(--tw-bg-opacity));
419
+ }
420
+
421
+ .cl-send-icon {
422
+ margin-right: 1.25rem;
423
+ height: 1.5rem;
424
+ width: 1.5rem;
425
+ }
426
+
427
+ .cl-notsending-message {
428
+ stroke: #3b82f6;
429
+ }
430
+
431
+ .cl-notsending-message:hover {
432
+ stroke: #60a5fa;
433
+ }
434
+
435
+ .cl-sending-message {
436
+ stroke: #9ca3af;
437
+ }
438
+
439
+ .cl-header-subtitle {
440
+ display: flex;
441
+ align-items: center;
442
+ gap: 0.5rem;
443
+ font-size: 0.875rem;
444
+ line-height: 1.25rem;
445
+ font-weight: 300;
446
+ color: rgb(107 114 128);
447
+ }
448
+
449
+ .cl-header {
450
+ position:relative;
451
+ display: flex;
452
+ flex-direction: column;
453
+ --tw-bg-opacity: 1;
454
+ font-size: 1.125rem;
455
+ line-height: 1.75rem;
456
+ font-weight: 400;
457
+ color: rgb(17 24 39);
458
+ }
459
+
460
+ .cl-header .header-title{
461
+ display: flex;
462
+ align-items: center;
463
+ margin-bottom: 16px;
464
+ font-size: 22px;
465
+ font-weight: 600;
466
+ }
467
+
468
+ .cl-header .diamond {
469
+ position: relative;
470
+ display: inline-block;
471
+ width: 20px;
472
+ height: 20px;
473
+ }
474
+
475
+ .cl-header .diamond::before {
476
+ content: '';
477
+ position: absolute;
478
+ top: 5px;
479
+ left: 0;
480
+ width: 10px;
481
+ height: 10px;
482
+ background-color: blue;
483
+ transform: rotate(45deg);
484
+ border-radius: 3px;
485
+ }
486
+
487
+ .cl-tips-wrapper {
488
+ width:100%;
489
+ display:flex;
490
+ margin-top:0.81rem;
491
+ flex-direction: row;
492
+ position: relative;
493
+ padding-bottom: 100px;
494
+ z-index: 1;
495
+ }
496
+
497
+ .cl-tips-wrapper .drop-man-img {
498
+ width: 35%;
499
+ }
500
+ .cl-tips-wrapper .drop-down-title {
501
+ margin-top: 45px;
502
+ font-family: PingFangSC, PingFang SC;
503
+ font-weight: 500;
504
+ font-size: 18px;
505
+ color: #333333;
506
+ line-height: 28px;
507
+ text-align: left;
508
+ font-style: normal;
509
+ > div {
510
+ margin-top: 15px;
511
+ font-size: 12px;
512
+ color: # 999;
513
+ }
514
+ }
515
+
516
+ .cl-tips-wrapper .cl-drop-down-mobile {
517
+ position: absolute;
518
+ width:100%;
519
+ top: 120px;
520
+ }
521
+
522
+ .cl-tips-wrapper .drop-down-list-mobile {
523
+ display: flex;
524
+ flex-direction: column;
525
+ margin-top: 2rem;
526
+ width:100%;
527
+ align-items: end;
528
+ }
529
+
530
+ .drop-down-item-card-mobile {
531
+ width: 85%;
532
+ height: 3.4rem;
533
+ padding: 0 0.6rem 0;
534
+ border-radius:20px;
535
+ border-top-left-radius: 0;
536
+ background: url("https://trans-from-yuntu-resourse.oss-cn-beijing.aliyuncs.com/smartSchool/appCreator/ai/drop-down-item-card-bg.png");
537
+ background-size: cover;
538
+ background-position: center;
539
+ background-repeat: no-repeat;
540
+ margin-bottom: 20px;
541
+
542
+ display:flex;
543
+ align-items: center;
544
+ }
545
+ .drop-down-item-title-mobile {
546
+ font-family: PingFangSC, PingFang SC;
547
+ font-weight: 400;
548
+ font-size: 13px;
549
+ color: #000000;
550
+ line-height: 17px;
551
+ text-align: left;
552
+ font-style: normal;
553
+ width: 100%;
554
+ margin-bottom:0 !important;
555
+ }
556
+
557
+ .drop-down-item-bottom-img-mobile{
558
+ width:3.5rem;
559
+ height:2.5rem;
560
+ }
561
+
562
+ .cl-drop-man{
563
+ width:100%;
564
+ display:flex;
565
+ margin-top:0.81rem;
566
+ }
567
+ .cl-drop-man .drop-man-img{
568
+ height:340px;
569
+ margin-right: 4rem;
570
+ margin-left: 3rem;
571
+ }
572
+
573
+ .cl-drop-man .cl-drop-down .drop-down-item-card .drop-down-item-bottom-img{
574
+ height:3.4rem;
575
+ margin-right:20px;
576
+ }
577
+
578
+ .cl-drop-man .drop-down-list{
579
+ width:auto;
580
+ display:flex;
581
+ flex-direction:row;
582
+ flex-wrap:wrap;
583
+ }
584
+
585
+ .cl-drop-man .cl-drop-down .drop-down-item-card{
586
+ width:calc(50% - 0.65rem);
587
+ }
588
+
589
+ .cl-drop-man .cl-drop-down{
590
+ flex:1;
591
+ position:unset;
592
+ border-bottom-left-radius: 0;
593
+ }
594
+
595
+ .cl-drop-horizontal{
596
+ width:100%;
597
+ display:flex;
598
+ margin-top:0.81rem;
599
+ }
600
+
601
+ .cl-drop-horizontal .drop-man-img{
602
+ height:340px;
603
+ margin-right: 4rem;
604
+ margin-left: 3rem;
605
+ }
606
+
607
+ .cl-drop-horizontal .drop-down-list{
608
+ width:auto;
609
+ display:flex;
610
+ flex-direction:row;
611
+ flex-wrap:wrap;
612
+ }
613
+
614
+ .cl-drop-horizontal .cl-drop-down .drop-down-item-card .drop-down-item-bottom-img{
615
+ height:2.4rem;
616
+ width:auto;
617
+ margin-right:20px;
618
+ }
619
+
620
+ .cl-drop-horizontal .cl-drop-down{
621
+ flex:1;
622
+ position:unset;
623
+ border-bottom-left-radius: 0;
624
+ }
625
+
626
+ .cl-drop-horizontal .cl-drop-down .drop-down-item-card{
627
+ width:100%;
628
+ height:unset;
629
+ justify-content:unset;
630
+ flex-direction:row;
631
+ align-items: center;
632
+ padding: 0.8rem 1.2rem 0.8rem;
633
+ cursor:pointer;
634
+ }
635
+
636
+ .cl-drop-horizontal .drop-down-item-bottom-button{
637
+ display:none;
638
+ }
639
+
640
+ .cl-drop-screen{
641
+ width:100%;
642
+ display:flex;
643
+ margin-top:0.81rem;
644
+ align-items: flex-start;
645
+ }
646
+
647
+ .cl-drop-screen .cl-drop-down .drop-down-item-card .drop-down-item-bottom-img{
648
+ height:2.4rem;
649
+ width:auto;
650
+ margin-right:20px;
651
+ }
652
+
653
+ .cl-drop-screen .drop-man-img{
654
+ height:340px;
655
+ margin-right: 4rem;
656
+ margin-left: 3rem;
657
+ }
658
+
659
+ .cl-drop-screen .cl-drop-down{
660
+ flex:1;
661
+ position:unset;
662
+ border-bottom-left-radius: 0;
663
+ }
664
+
665
+ .cl-drop-screen .cl-drop-down .drop-down-item-card{
666
+ width:calc(33% - 0.65rem);
667
+ }
668
+
669
+ .cl-drop-down {
670
+ background: #FFFFFF;
671
+ border-radius: 10px;
672
+ box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05);
673
+ z-index: 1;
674
+ width: 100%;
675
+ min-height: 50px;
676
+ position: absolute;
677
+ bottom: -14.7rem;
678
+ padding:1.3rem;
679
+ }
680
+
681
+ .drop-down-title {
682
+ font-weight: 500;
683
+ font-size: 18px;
684
+ color: #000000;
685
+ line-height: 1.1;
686
+ text-align: left;
687
+ }
688
+ .drop-down-list {
689
+ display:flex;
690
+ gap:1.3rem;
691
+ margin-top:2rem;
692
+ }
693
+ .drop-down-item-card {
694
+ width: 33%;
695
+ padding: 1.2rem 1.2rem 0.3rem;
696
+ height:7.5rem;
697
+ font-weight: 400;
698
+ font-size: 14px;
699
+ color: #FFFFFF;
700
+ line-height: 14px;
701
+ text-align: left;
702
+ border-radius:10px;
703
+ background: url("https://trans-from-yuntu-resourse.oss-cn-beijing.aliyuncs.com/smartSchool/appCreator/ai/drop-down-item-card-bg.png");
704
+ background-size: cover;
705
+ background-position: center;
706
+ background-repeat: no-repeat;
707
+
708
+ display:flex;
709
+ justify-content: space-between;
710
+ flex-direction: column;
711
+ }
712
+ .drop-down-item-title {
713
+ font-weight: 400;
714
+ font-size: 16px;
715
+ color: #000000;
716
+ line-height: 20px;
717
+ text-align: left;
718
+ width: 100%;
719
+ margin-bottom:0 !important;
720
+ }
721
+ .drop-down-item-bottom{
722
+ display:flex;
723
+ align-items: center;
724
+ justify-content: space-between;
725
+ flex-direction: row;
726
+ // margin-top:1rem;
727
+ align-items: center;
728
+ }
729
+
730
+ .drop-down-item-bottom-button{
731
+ border-radius: 16px;
732
+ line-height: 20px;
733
+ text-align: left;
734
+ width: 2rem;
735
+ padding: 0.2rem 0.4rem 0.2rem 0.2rem;
736
+ cursor: pointer;
737
+ display: flex;
738
+ justify-content: center;
739
+ align-items: center
740
+ }
741
+
742
+ .drop-down-item-bottom-img{
743
+ width:4rem;
744
+ height:3.5rem;
745
+ }
746
+
747
+ @media screen and (max-width: 1000px){
748
+ .drop-down-item-bottom-img {
749
+ display:none;
750
+ }
751
+ .drop-down-item-bottom {
752
+
753
+ margin-bottom:1rem;
754
+ }
755
+ }
756
+
757
+ .cl-messages_container {
758
+ position: relative;
759
+ display: flex;
760
+ height: 100%;
761
+ flex-direction: column;
762
+ overflow: scroll;
763
+ overflow-x: clip;
764
+ --tw-bg-opacity: 1;
765
+ padding-left: 1rem;
766
+ padding-right: 1rem;
767
+ padding-top: 0.5rem;
768
+ padding-bottom: 0.5rem;
769
+ -ms-overflow-style: none;
770
+ scrollbar-width: none;
771
+ }
772
+
773
+ .cl-messages_container::-webkit-scrollbar {
774
+ display: none;
775
+ }
776
+
777
+ .cl-input_container {
778
+ position: relative;
779
+ display: flex;
780
+ flex-direction: column;
781
+ width: 100%;
782
+ align-items: center;
783
+ --tw-border-opacity: 1;
784
+ --tw-bg-opacity: 1;
785
+ border-top-right-radius: 50px;
786
+ border-bottom-right-radius: 50px;
787
+ }
788
+
789
+ .cl-chat-message {
790
+ display: flex;
791
+ width: 100%;
792
+ padding-top: 0.5rem;
793
+ padding-bottom: 0.5rem;
794
+ padding-left: 0.5rem;
795
+ padding-right: 0.5rem;
796
+ }
797
+
798
+ @-webkit-keyframes pulse {
799
+ 50% {
800
+ opacity: .5;
801
+ }
802
+ }
803
+
804
+ @keyframes pulse {
805
+ 50% {
806
+ opacity: .5;
807
+ }
808
+ }
809
+
810
+ .cl-animate-pulse {
811
+ -webkit-animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
812
+ animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
813
+ }
814
+
815
+ .cl-justify-start {
816
+ justify-content: flex-start;
817
+ }
818
+
819
+ .cl-justify-end {
820
+ justify-content: flex-end;
821
+ }
822
+
823
+ .cl-input-element {
824
+ height: 100%;
825
+ width: 100%;
826
+ padding-left: 1.25rem;
827
+ padding-right: 1.25rem;
828
+ padding-top: 0.25rem;
829
+ padding-bottom: 0.25rem;
830
+ font-weight: 300;
831
+ background-color: #FFFFFF;
832
+ color: rgb(17 24 39);
833
+ border-top-left-radius: 50px;
834
+ border-bottom-left-radius: 50px;
835
+ transition: height 0.2s ease;
836
+ }
837
+ .cl-input-element::-webkit-scrollbar{
838
+ width: 0 !important;
839
+ }
840
+
841
+ .cl-input-element::placeholder {
842
+ line-height:45px;
843
+ }
844
+
845
+ .cl-input-element:focus {
846
+ outline: 2px solid transparent;
847
+ outline-offset: 2px;
848
+ }
849
+
850
+ .cl-input-element:focus::placeholder {
851
+ line-height:unset;
852
+ }
853
+
854
+ .cl-user_message {
855
+ width: -webkit-fit-content;
856
+ width: -moz-fit-content;
857
+ width: fit-content;
858
+ -webkit-column-break-before: all;
859
+ break-before: all;
860
+ border-radius: 0.75rem;
861
+ border-top-right-radius: 0.125rem;
862
+ --tw-bg-opacity: 1;
863
+ background-color: rgb(59 130 246 / var(--tw-bg-opacity));
864
+ padding-left: 1rem;
865
+ padding-right: 1rem;
866
+ padding-top: 0.5rem;
867
+ padding-bottom: 0.5rem;
868
+ text-align: left;
869
+ --tw-text-opacity: 1;
870
+ color: rgb(255 255 255 / var(--tw-text-opacity));
871
+ white-space: pre-line;
872
+ }
873
+
874
+ .cl-error_message {
875
+ width: -webkit-fit-content;
876
+ width: -moz-fit-content;
877
+ width: fit-content;
878
+ max-width: 90%;
879
+ -webkit-column-break-before: all;
880
+ break-before: all;
881
+ border-radius: 0.75rem;
882
+ border-top-left-radius: 0.125rem;
883
+ --tw-bg-opacity: 1;
884
+ background-color: rgb(248 113 113 / var(--tw-bg-opacity));
885
+ padding-left: 1rem;
886
+ padding-right: 1rem;
887
+ padding-top: 0.5rem;
888
+ padding-bottom: 0.5rem;
889
+ text-align: left;
890
+ --tw-text-opacity: 1;
891
+ color: rgb(255 255 255 / var(--tw-text-opacity));
892
+ }
893
+
894
+ .cl-bot_message {
895
+ width: -webkit-fit-content;
896
+ width: -moz-fit-content;
897
+ width: fit-content;
898
+
899
+ -webkit-column-break-before: all;
900
+ break-before: all;
901
+ border-radius: 0.75rem;
902
+ border-top-left-radius: 0.125rem;
903
+ --tw-bg-opacity: 1;
904
+ background-color: #FFFFFF;
905
+ padding-left: 1rem;
906
+ padding-right: 1rem;
907
+ padding-top: 0.5rem;
908
+ padding-bottom: 0.5rem;
909
+ text-align: left;
910
+ --tw-text-opacity: 1;
911
+ color: rgb(31 41 55 / var(--tw-text-opacity));
912
+ }
913
+
914
+ .origin-bottom {
915
+ -webkit-transform-origin: bottom;
916
+ transform-origin: bottom;
917
+ }
918
+
919
+ .origin-bottom-left {
920
+ -webkit-transform-origin: bottom left;
921
+ transform-origin: bottom left;
922
+ }
923
+
924
+ .origin-bottom-right {
925
+ -webkit-transform-origin: bottom right;
926
+ transform-origin: bottom right;
927
+ }
928
+
929
+ .origin-center {
930
+ -webkit-transform-origin: center;
931
+ transform-origin: center;
932
+ }
933
+
934
+ .origin-top {
935
+ -webkit-transform-origin: top;
936
+ transform-origin: top;
937
+ }
938
+
939
+ .origin-top-left {
940
+ -webkit-transform-origin: top left;
941
+ transform-origin: top left;
942
+ }
943
+
944
+ .origin-top-right {
945
+ -webkit-transform-origin: top right;
946
+ transform-origin: top right;
947
+ }
948
+
949
+ .shadow {
950
+ --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
951
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
952
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
953
+ }
954
+ input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
955
+ color: rgb(156 163 175);
956
+ opacity: 1; /* Firefox */
957
+ }
958
+
959
+ input:-ms-input-placeholder { /* Internet Explorer 10-11 */
960
+ color: rgb(156 163 175);
961
+ }
962
+
963
+ input::-ms-input-placeholder { /* Microsoft Edge */
964
+ color: rgb(156 163 175);
965
+ }
966
+ `;
967
+
968
+ const markdownBody = `
969
+
970
+ .markdown-body {
971
+ --base-size-4: 0.25rem;
972
+ --base-size-8: 0.5rem;
973
+ --base-size-16: 1rem;
974
+ --base-text-weight-normal: 400;
975
+ --base-text-weight-medium: 500;
976
+ --base-text-weight-semibold: 600;
977
+ --fontStack-monospace: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
978
+ }
979
+
980
+ @media (prefers-color-scheme: dark) {
981
+ .markdown-body,
982
+ [data-theme="dark"] {
983
+ /*dark*/
984
+ color-scheme: dark;
985
+ --focus-outlineColor: #1f6feb;
986
+ --fgColor-default: #e6edf3;
987
+ --fgColor-muted: #8d96a0;
988
+ --fgColor-accent: #4493f8;
989
+ --fgColor-success: #3fb950;
990
+ --fgColor-attention: #d29922;
991
+ --fgColor-danger: #f85149;
992
+ --fgColor-done: #ab7df8;
993
+ --bgColor-default: #0d1117;
994
+ --bgColor-muted: #161b22;
995
+ --bgColor-neutral-muted: #6e768166;
996
+ --bgColor-attention-muted: #bb800926;
997
+ --borderColor-default: #30363d;
998
+ --borderColor-muted: #30363db3;
999
+ --borderColor-neutral-muted: #6e768166;
1000
+ --borderColor-accent-emphasis: #1f6feb;
1001
+ --borderColor-success-emphasis: #238636;
1002
+ --borderColor-attention-emphasis: #9e6a03;
1003
+ --borderColor-danger-emphasis: #da3633;
1004
+ --borderColor-done-emphasis: #8957e5;
1005
+ --color-prettylights-syntax-comment: #8b949e;
1006
+ --color-prettylights-syntax-constant: #79c0ff;
1007
+ --color-prettylights-syntax-constant-other-reference-link: #a5d6ff;
1008
+ --color-prettylights-syntax-entity: #d2a8ff;
1009
+ --color-prettylights-syntax-storage-modifier-import: #c9d1d9;
1010
+ --color-prettylights-syntax-entity-tag: #7ee787;
1011
+ --color-prettylights-syntax-keyword: #ff7b72;
1012
+ --color-prettylights-syntax-string: #a5d6ff;
1013
+ --color-prettylights-syntax-variable: #ffa657;
1014
+ --color-prettylights-syntax-brackethighlighter-unmatched: #f85149;
1015
+ --color-prettylights-syntax-brackethighlighter-angle: #8b949e;
1016
+ --color-prettylights-syntax-invalid-illegal-text: #f0f6fc;
1017
+ --color-prettylights-syntax-invalid-illegal-bg: #8e1519;
1018
+ --color-prettylights-syntax-carriage-return-text: #f0f6fc;
1019
+ --color-prettylights-syntax-carriage-return-bg: #b62324;
1020
+ --color-prettylights-syntax-string-regexp: #7ee787;
1021
+ --color-prettylights-syntax-markup-list: #f2cc60;
1022
+ --color-prettylights-syntax-markup-heading: #1f6feb;
1023
+ --color-prettylights-syntax-markup-italic: #c9d1d9;
1024
+ --color-prettylights-syntax-markup-bold: #c9d1d9;
1025
+ --color-prettylights-syntax-markup-deleted-text: #ffdcd7;
1026
+ --color-prettylights-syntax-markup-deleted-bg: #67060c;
1027
+ --color-prettylights-syntax-markup-inserted-text: #aff5b4;
1028
+ --color-prettylights-syntax-markup-inserted-bg: #033a16;
1029
+ --color-prettylights-syntax-markup-changed-text: #ffdfb6;
1030
+ --color-prettylights-syntax-markup-changed-bg: #5a1e02;
1031
+ --color-prettylights-syntax-markup-ignored-text: #c9d1d9;
1032
+ --color-prettylights-syntax-markup-ignored-bg: #1158c7;
1033
+ --color-prettylights-syntax-meta-diff-range: #d2a8ff;
1034
+ --color-prettylights-syntax-sublimelinter-gutter-mark: #484f58;
1035
+ }
1036
+ }
1037
+
1038
+ @media (prefers-color-scheme: light) {
1039
+ .markdown-body,
1040
+ [data-theme="light"] {
1041
+ /*light*/
1042
+ color-scheme: light;
1043
+ --focus-outlineColor: #0969da;
1044
+ --fgColor-default: #1f2328;
1045
+ --fgColor-muted: #636c76;
1046
+ --fgColor-accent: #0969da;
1047
+ --fgColor-success: #1a7f37;
1048
+ --fgColor-attention: #9a6700;
1049
+ --fgColor-danger: #d1242f;
1050
+ --fgColor-done: #8250df;
1051
+ --bgColor-default: #ffffff;
1052
+ --bgColor-muted: #f6f8fa;
1053
+ --bgColor-neutral-muted: #afb8c133;
1054
+ --bgColor-attention-muted: #fff8c5;
1055
+ --borderColor-default: #d0d7de;
1056
+ --borderColor-muted: #d0d7deb3;
1057
+ --borderColor-neutral-muted: #afb8c133;
1058
+ --borderColor-accent-emphasis: #0969da;
1059
+ --borderColor-success-emphasis: #1a7f37;
1060
+ --borderColor-attention-emphasis: #bf8700;
1061
+ --borderColor-danger-emphasis: #cf222e;
1062
+ --borderColor-done-emphasis: #8250df;
1063
+ --color-prettylights-syntax-comment: #57606a;
1064
+ --color-prettylights-syntax-constant: #0550ae;
1065
+ --color-prettylights-syntax-constant-other-reference-link: #0a3069;
1066
+ --color-prettylights-syntax-entity: #6639ba;
1067
+ --color-prettylights-syntax-storage-modifier-import: #24292f;
1068
+ --color-prettylights-syntax-entity-tag: #0550ae;
1069
+ --color-prettylights-syntax-keyword: #cf222e;
1070
+ --color-prettylights-syntax-string: #0a3069;
1071
+ --color-prettylights-syntax-variable: #953800;
1072
+ --color-prettylights-syntax-brackethighlighter-unmatched: #82071e;
1073
+ --color-prettylights-syntax-brackethighlighter-angle: #57606a;
1074
+ --color-prettylights-syntax-invalid-illegal-text: #f6f8fa;
1075
+ --color-prettylights-syntax-invalid-illegal-bg: #82071e;
1076
+ --color-prettylights-syntax-carriage-return-text: #f6f8fa;
1077
+ --color-prettylights-syntax-carriage-return-bg: #cf222e;
1078
+ --color-prettylights-syntax-string-regexp: #116329;
1079
+ --color-prettylights-syntax-markup-list: #3b2300;
1080
+ --color-prettylights-syntax-markup-heading: #0550ae;
1081
+ --color-prettylights-syntax-markup-italic: #24292f;
1082
+ --color-prettylights-syntax-markup-bold: #24292f;
1083
+ --color-prettylights-syntax-markup-deleted-text: #82071e;
1084
+ --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
1085
+ --color-prettylights-syntax-markup-inserted-text: #116329;
1086
+ --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
1087
+ --color-prettylights-syntax-markup-changed-text: #953800;
1088
+ --color-prettylights-syntax-markup-changed-bg: #ffd8b5;
1089
+ --color-prettylights-syntax-markup-ignored-text: #eaeef2;
1090
+ --color-prettylights-syntax-markup-ignored-bg: #0550ae;
1091
+ --color-prettylights-syntax-meta-diff-range: #8250df;
1092
+ --color-prettylights-syntax-sublimelinter-gutter-mark: #8c959f;
1093
+ }
1094
+ }
1095
+
1096
+ .markdown-body {
1097
+ -ms-text-size-adjust: 100%;
1098
+ -webkit-text-size-adjust: 100%;
1099
+ margin: 0;
1100
+ font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
1101
+ font-size: 16px;
1102
+ line-height: 1.5;
1103
+ word-wrap: break-word;
1104
+ scroll-behavior: auto;
1105
+ }
1106
+
1107
+ .markdown-body .octicon {
1108
+ display: inline-block;
1109
+ fill: currentColor;
1110
+ vertical-align: text-bottom;
1111
+ }
1112
+
1113
+ .markdown-body h1:hover .anchor .octicon-link:before,
1114
+ .markdown-body h2:hover .anchor .octicon-link:before,
1115
+ .markdown-body h3:hover .anchor .octicon-link:before,
1116
+ .markdown-body h4:hover .anchor .octicon-link:before,
1117
+ .markdown-body h5:hover .anchor .octicon-link:before,
1118
+ .markdown-body h6:hover .anchor .octicon-link:before {
1119
+ width: 16px;
1120
+ height: 16px;
1121
+ content: ' ';
1122
+ display: inline-block;
1123
+ background-color: currentColor;
1124
+ -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg>");
1125
+ mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg>");
1126
+ }
1127
+
1128
+ .markdown-body details,
1129
+ .markdown-body figcaption,
1130
+ .markdown-body figure {
1131
+ display: block;
1132
+ }
1133
+
1134
+ .markdown-body summary {
1135
+ display: list-item;
1136
+ }
1137
+
1138
+ .markdown-body [hidden] {
1139
+ display: none !important;
1140
+ }
1141
+
1142
+ .markdown-body a {
1143
+ background-color: transparent;
1144
+ color: var(--fgColor-accent);
1145
+ text-decoration: none;
1146
+ }
1147
+
1148
+ .markdown-body abbr[title] {
1149
+ border-bottom: none;
1150
+ -webkit-text-decoration: underline dotted;
1151
+ text-decoration: underline dotted;
1152
+ }
1153
+
1154
+ .markdown-body b,
1155
+ .markdown-body strong {
1156
+ font-weight: var(--base-text-weight-semibold, 600);
1157
+ }
1158
+
1159
+ .markdown-body dfn {
1160
+ font-style: italic;
1161
+ }
1162
+
1163
+ .markdown-body h1 {
1164
+ margin: .67em 0;
1165
+ font-weight: var(--base-text-weight-semibold, 600);
1166
+ padding-bottom: .3em;
1167
+ font-size: 2em;
1168
+ border-bottom: 1px solid var(--borderColor-muted);
1169
+ }
1170
+
1171
+ .markdown-body mark {
1172
+ background-color: var(--bgColor-attention-muted);
1173
+ color: var(--fgColor-default);
1174
+ }
1175
+
1176
+ .markdown-body small {
1177
+ font-size: 90%;
1178
+ }
1179
+
1180
+ .markdown-body sub,
1181
+ .markdown-body sup {
1182
+ font-size: 75%;
1183
+ line-height: 0;
1184
+ position: relative;
1185
+ vertical-align: baseline;
1186
+ }
1187
+
1188
+ .markdown-body sub {
1189
+ bottom: -0.25em;
1190
+ }
1191
+
1192
+ .markdown-body sup {
1193
+ top: -0.5em;
1194
+ }
1195
+
1196
+ .markdown-body img {
1197
+ border-style: none;
1198
+ max-width: 100%;
1199
+ box-sizing: content-box;
1200
+ }
1201
+
1202
+ .markdown-body code,
1203
+ .markdown-body kbd,
1204
+ .markdown-body pre,
1205
+ .markdown-body samp {
1206
+ font-family: monospace;
1207
+ font-size: 1em;
1208
+ }
1209
+
1210
+ .markdown-body figure {
1211
+ margin: 1em 40px;
1212
+ }
1213
+
1214
+ .markdown-body hr {
1215
+ box-sizing: content-box;
1216
+ overflow: hidden;
1217
+ background: transparent;
1218
+ border-bottom: 1px solid var(--borderColor-muted);
1219
+ height: .25em;
1220
+ padding: 0;
1221
+ margin: 24px 0;
1222
+ background-color: var(--borderColor-default);
1223
+ border: 0;
1224
+ }
1225
+
1226
+ .markdown-body input {
1227
+ font: inherit;
1228
+ margin: 0;
1229
+ overflow: visible;
1230
+ font-family: inherit;
1231
+ font-size: inherit;
1232
+ line-height: inherit;
1233
+ }
1234
+
1235
+ .markdown-body [type=button],
1236
+ .markdown-body [type=reset],
1237
+ .markdown-body [type=submit] {
1238
+ -webkit-appearance: button;
1239
+ appearance: button;
1240
+ }
1241
+
1242
+ .markdown-body [type=checkbox],
1243
+ .markdown-body [type=radio] {
1244
+ box-sizing: border-box;
1245
+ padding: 0;
1246
+ }
1247
+
1248
+ .markdown-body [type=number]::-webkit-inner-spin-button,
1249
+ .markdown-body [type=number]::-webkit-outer-spin-button {
1250
+ height: auto;
1251
+ }
1252
+
1253
+ .markdown-body [type=search]::-webkit-search-cancel-button,
1254
+ .markdown-body [type=search]::-webkit-search-decoration {
1255
+ -webkit-appearance: none;
1256
+ appearance: none;
1257
+ }
1258
+
1259
+ .markdown-body ::-webkit-input-placeholder {
1260
+ color: inherit;
1261
+ opacity: .54;
1262
+ }
1263
+
1264
+ .markdown-body ::-webkit-file-upload-button {
1265
+ -webkit-appearance: button;
1266
+ appearance: button;
1267
+ font: inherit;
1268
+ }
1269
+
1270
+ .markdown-body a:hover {
1271
+ text-decoration: underline;
1272
+ }
1273
+
1274
+ .markdown-body ::placeholder {
1275
+ color: var(--fgColor-muted);
1276
+ opacity: 1;
1277
+ }
1278
+
1279
+ .markdown-body hr::before {
1280
+ display: table;
1281
+ content: "";
1282
+ }
1283
+
1284
+ .markdown-body hr::after {
1285
+ display: table;
1286
+ clear: both;
1287
+ content: "";
1288
+ }
1289
+
1290
+ .markdown-body table {
1291
+ border-spacing: 0;
1292
+ border-collapse: collapse;
1293
+ display: block;
1294
+ width: max-content;
1295
+ max-width: 100%;
1296
+ overflow: auto;
1297
+ }
1298
+
1299
+ .markdown-body td,
1300
+ .markdown-body th {
1301
+ padding: 0;
1302
+ }
1303
+
1304
+ .markdown-body details summary {
1305
+ cursor: pointer;
1306
+ }
1307
+
1308
+ .markdown-body details:not([open])>*:not(summary) {
1309
+ display: none;
1310
+ }
1311
+
1312
+ .markdown-body a:focus,
1313
+ .markdown-body [role=button]:focus,
1314
+ .markdown-body input[type=radio]:focus,
1315
+ .markdown-body input[type=checkbox]:focus {
1316
+ outline: 2px solid var(--focus-outlineColor);
1317
+ outline-offset: -2px;
1318
+ box-shadow: none;
1319
+ }
1320
+
1321
+ .markdown-body a:focus:not(:focus-visible),
1322
+ .markdown-body [role=button]:focus:not(:focus-visible),
1323
+ .markdown-body input[type=radio]:focus:not(:focus-visible),
1324
+ .markdown-body input[type=checkbox]:focus:not(:focus-visible) {
1325
+ outline: solid 1px transparent;
1326
+ }
1327
+
1328
+ .markdown-body a:focus-visible,
1329
+ .markdown-body [role=button]:focus-visible,
1330
+ .markdown-body input[type=radio]:focus-visible,
1331
+ .markdown-body input[type=checkbox]:focus-visible {
1332
+ outline: 2px solid var(--focus-outlineColor);
1333
+ outline-offset: -2px;
1334
+ box-shadow: none;
1335
+ }
1336
+
1337
+ .markdown-body a:not([class]):focus,
1338
+ .markdown-body a:not([class]):focus-visible,
1339
+ .markdown-body input[type=radio]:focus,
1340
+ .markdown-body input[type=radio]:focus-visible,
1341
+ .markdown-body input[type=checkbox]:focus,
1342
+ .markdown-body input[type=checkbox]:focus-visible {
1343
+ outline-offset: 0;
1344
+ }
1345
+
1346
+ .markdown-body kbd {
1347
+ display: inline-block;
1348
+ padding: 3px 5px;
1349
+ font: 11px var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);
1350
+ line-height: 10px;
1351
+ color: var(--fgColor-default);
1352
+ vertical-align: middle;
1353
+ background-color: var(--bgColor-muted);
1354
+ border: solid 1px var(--borderColor-neutral-muted);
1355
+ border-bottom-color: var(--borderColor-neutral-muted);
1356
+ border-radius: 6px;
1357
+ box-shadow: inset 0 -1px 0 var(--borderColor-neutral-muted);
1358
+ }
1359
+
1360
+ .markdown-body h1,
1361
+ .markdown-body h2,
1362
+ .markdown-body h3,
1363
+ .markdown-body h4,
1364
+ .markdown-body h5,
1365
+ .markdown-body h6 {
1366
+ margin-top: 24px;
1367
+ margin-bottom: 16px;
1368
+ font-weight: var(--base-text-weight-semibold, 600);
1369
+ line-height: 1.25;
1370
+ }
1371
+
1372
+ .markdown-body h2 {
1373
+ font-weight: var(--base-text-weight-semibold, 600);
1374
+ padding-bottom: .3em;
1375
+ font-size: 1.5em;
1376
+ border-bottom: 1px solid var(--borderColor-muted);
1377
+ }
1378
+
1379
+ .markdown-body h3 {
1380
+ font-weight: var(--base-text-weight-semibold, 600);
1381
+ font-size: 1.25em;
1382
+ }
1383
+
1384
+ .markdown-body h4 {
1385
+ font-weight: var(--base-text-weight-semibold, 600);
1386
+ font-size: 1em;
1387
+ }
1388
+
1389
+ .markdown-body h5 {
1390
+ font-weight: var(--base-text-weight-semibold, 600);
1391
+ font-size: .875em;
1392
+ }
1393
+
1394
+ .markdown-body h6 {
1395
+ font-weight: var(--base-text-weight-semibold, 600);
1396
+ font-size: .85em;
1397
+ color: var(--fgColor-muted);
1398
+ }
1399
+
1400
+ .markdown-body p {
1401
+ margin-top: 0;
1402
+ margin-bottom: 10px;
1403
+ }
1404
+
1405
+ .markdown-body blockquote {
1406
+ margin: 0;
1407
+ padding: 0 1em;
1408
+ color: var(--fgColor-muted);
1409
+ }
1410
+
1411
+ .markdown-body ul,
1412
+ .markdown-body ol {
1413
+ margin-top: 0;
1414
+ margin-bottom: 0;
1415
+ padding-left: 2em;
1416
+ }
1417
+
1418
+ .markdown-body ol ol,
1419
+ .markdown-body ul ol {
1420
+ list-style-type: lower-roman;
1421
+ }
1422
+
1423
+ .markdown-body ul ul ol,
1424
+ .markdown-body ul ol ol,
1425
+ .markdown-body ol ul ol,
1426
+ .markdown-body ol ol ol {
1427
+ list-style-type: lower-alpha;
1428
+ }
1429
+
1430
+ .markdown-body dd {
1431
+ margin-left: 0;
1432
+ }
1433
+
1434
+ .markdown-body tt,
1435
+ .markdown-body code,
1436
+ .markdown-body samp {
1437
+ font-family: var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);
1438
+ font-size: 12px;
1439
+ }
1440
+
1441
+ .markdown-body pre {
1442
+ margin-top: 0;
1443
+ margin-bottom: 0;
1444
+ font-family: var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);
1445
+ font-size: 12px;
1446
+ word-wrap: normal;
1447
+ }
1448
+
1449
+ .markdown-body .octicon {
1450
+ display: inline-block;
1451
+ overflow: visible !important;
1452
+ vertical-align: text-bottom;
1453
+ fill: currentColor;
1454
+ }
1455
+
1456
+ .markdown-body input::-webkit-outer-spin-button,
1457
+ .markdown-body input::-webkit-inner-spin-button {
1458
+ margin: 0;
1459
+ -webkit-appearance: none;
1460
+ appearance: none;
1461
+ }
1462
+
1463
+ .markdown-body .mr-2 {
1464
+ margin-right: var(--base-size-8, 8px) !important;
1465
+ }
1466
+
1467
+ .markdown-body::before {
1468
+ display: table;
1469
+ content: "";
1470
+ }
1471
+
1472
+ .markdown-body::after {
1473
+ display: table;
1474
+ clear: both;
1475
+ content: "";
1476
+ }
1477
+
1478
+ .markdown-body>*:first-child {
1479
+ margin-top: 0 !important;
1480
+ }
1481
+
1482
+ .markdown-body>*:last-child {
1483
+ margin-bottom: 0 !important;
1484
+ }
1485
+
1486
+ .markdown-body a:not([href]) {
1487
+ color: inherit;
1488
+ text-decoration: none;
1489
+ }
1490
+
1491
+ .markdown-body .absent {
1492
+ color: var(--fgColor-danger);
1493
+ }
1494
+
1495
+ .markdown-body .anchor {
1496
+ float: left;
1497
+ padding-right: 4px;
1498
+ margin-left: -20px;
1499
+ line-height: 1;
1500
+ }
1501
+
1502
+ .markdown-body .anchor:focus {
1503
+ outline: none;
1504
+ }
1505
+
1506
+ .markdown-body p,
1507
+ .markdown-body blockquote,
1508
+ .markdown-body ul,
1509
+ .markdown-body ol,
1510
+ .markdown-body dl,
1511
+ .markdown-body table,
1512
+ .markdown-body pre,
1513
+ .markdown-body details {
1514
+ margin-top: 0;
1515
+ margin-bottom: 16px;
1516
+ }
1517
+
1518
+ .markdown-body blockquote>:first-child {
1519
+ margin-top: 0;
1520
+ }
1521
+
1522
+ .markdown-body blockquote>:last-child {
1523
+ margin-bottom: 0;
1524
+ }
1525
+
1526
+ .markdown-body h1 .octicon-link,
1527
+ .markdown-body h2 .octicon-link,
1528
+ .markdown-body h3 .octicon-link,
1529
+ .markdown-body h4 .octicon-link,
1530
+ .markdown-body h5 .octicon-link,
1531
+ .markdown-body h6 .octicon-link {
1532
+ color: var(--fgColor-default);
1533
+ vertical-align: middle;
1534
+ visibility: hidden;
1535
+ }
1536
+
1537
+ .markdown-body h1:hover .anchor,
1538
+ .markdown-body h2:hover .anchor,
1539
+ .markdown-body h3:hover .anchor,
1540
+ .markdown-body h4:hover .anchor,
1541
+ .markdown-body h5:hover .anchor,
1542
+ .markdown-body h6:hover .anchor {
1543
+ text-decoration: none;
1544
+ }
1545
+
1546
+ .markdown-body h1:hover .anchor .octicon-link,
1547
+ .markdown-body h2:hover .anchor .octicon-link,
1548
+ .markdown-body h3:hover .anchor .octicon-link,
1549
+ .markdown-body h4:hover .anchor .octicon-link,
1550
+ .markdown-body h5:hover .anchor .octicon-link,
1551
+ .markdown-body h6:hover .anchor .octicon-link {
1552
+ visibility: visible;
1553
+ }
1554
+
1555
+ .markdown-body h1 tt,
1556
+ .markdown-body h1 code,
1557
+ .markdown-body h2 tt,
1558
+ .markdown-body h2 code,
1559
+ .markdown-body h3 tt,
1560
+ .markdown-body h3 code,
1561
+ .markdown-body h4 tt,
1562
+ .markdown-body h4 code,
1563
+ .markdown-body h5 tt,
1564
+ .markdown-body h5 code,
1565
+ .markdown-body h6 tt,
1566
+ .markdown-body h6 code {
1567
+ padding: 0 .2em;
1568
+ font-size: inherit;
1569
+ }
1570
+
1571
+ .markdown-body summary h1,
1572
+ .markdown-body summary h2,
1573
+ .markdown-body summary h3,
1574
+ .markdown-body summary h4,
1575
+ .markdown-body summary h5,
1576
+ .markdown-body summary h6 {
1577
+ display: inline-block;
1578
+ }
1579
+
1580
+ .markdown-body summary h1 .anchor,
1581
+ .markdown-body summary h2 .anchor,
1582
+ .markdown-body summary h3 .anchor,
1583
+ .markdown-body summary h4 .anchor,
1584
+ .markdown-body summary h5 .anchor,
1585
+ .markdown-body summary h6 .anchor {
1586
+ margin-left: -40px;
1587
+ }
1588
+
1589
+ .markdown-body summary h1,
1590
+ .markdown-body summary h2 {
1591
+ padding-bottom: 0;
1592
+ border-bottom: 0;
1593
+ }
1594
+
1595
+ .markdown-body ul.no-list,
1596
+ .markdown-body ol.no-list {
1597
+ padding: 0;
1598
+ list-style-type: none;
1599
+ }
1600
+
1601
+ .markdown-body ol[type="a s"] {
1602
+ list-style-type: lower-alpha;
1603
+ }
1604
+
1605
+ .markdown-body ol[type="A s"] {
1606
+ list-style-type: upper-alpha;
1607
+ }
1608
+
1609
+ .markdown-body ol[type="i s"] {
1610
+ list-style-type: lower-roman;
1611
+ }
1612
+
1613
+ .markdown-body ol[type="I s"] {
1614
+ list-style-type: upper-roman;
1615
+ }
1616
+
1617
+ .markdown-body ol[type="1"] {
1618
+ list-style-type: decimal;
1619
+ }
1620
+
1621
+ .markdown-body div>ol:not([type]) {
1622
+ list-style-type: decimal;
1623
+ }
1624
+
1625
+ .markdown-body ul ul,
1626
+ .markdown-body ul ol,
1627
+ .markdown-body ol ol,
1628
+ .markdown-body ol ul {
1629
+ margin-top: 0;
1630
+ margin-bottom: 0;
1631
+ }
1632
+
1633
+ .markdown-body li>p {
1634
+ margin-top: 16px;
1635
+ }
1636
+
1637
+ .markdown-body li+li {
1638
+ margin-top: .25em;
1639
+ }
1640
+
1641
+ .markdown-body dl {
1642
+ padding: 0;
1643
+ }
1644
+
1645
+ .markdown-body dl dt {
1646
+ padding: 0;
1647
+ margin-top: 16px;
1648
+ font-size: 1em;
1649
+ font-style: italic;
1650
+ font-weight: var(--base-text-weight-semibold, 600);
1651
+ }
1652
+
1653
+ .markdown-body dl dd {
1654
+ padding: 0 16px;
1655
+ margin-bottom: 16px;
1656
+ }
1657
+
1658
+ .markdown-body table th {
1659
+ font-weight: var(--base-text-weight-semibold, 600);
1660
+ }
1661
+
1662
+ .markdown-body table th,
1663
+ .markdown-body table td {
1664
+ padding: 6px 13px;
1665
+ border: 1px solid var(--borderColor-default);
1666
+ }
1667
+
1668
+ .markdown-body table td>:last-child {
1669
+ margin-bottom: 0;
1670
+ }
1671
+
1672
+ .markdown-body table tr {
1673
+ border-top: 1px solid var(--borderColor-muted);
1674
+ }
1675
+
1676
+ .markdown-body table img {
1677
+ background-color: transparent;
1678
+ }
1679
+
1680
+ .markdown-body img[align=right] {
1681
+ padding-left: 20px;
1682
+ }
1683
+
1684
+ .markdown-body img[align=left] {
1685
+ padding-right: 20px;
1686
+ }
1687
+
1688
+ .markdown-body .emoji {
1689
+ max-width: none;
1690
+ vertical-align: text-top;
1691
+ background-color: transparent;
1692
+ }
1693
+
1694
+ .markdown-body span.frame {
1695
+ display: block;
1696
+ overflow: hidden;
1697
+ }
1698
+
1699
+ .markdown-body span.frame>span {
1700
+ display: block;
1701
+ float: left;
1702
+ width: auto;
1703
+ padding: 7px;
1704
+ margin: 13px 0 0;
1705
+ overflow: hidden;
1706
+ border: 1px solid var(--borderColor-default);
1707
+ }
1708
+
1709
+ .markdown-body span.frame span img {
1710
+ display: block;
1711
+ float: left;
1712
+ }
1713
+
1714
+ .markdown-body span.frame span span {
1715
+ display: block;
1716
+ padding: 5px 0 0;
1717
+ clear: both;
1718
+ color: var(--fgColor-default);
1719
+ }
1720
+
1721
+ .markdown-body span.align-center {
1722
+ display: block;
1723
+ overflow: hidden;
1724
+ clear: both;
1725
+ }
1726
+
1727
+ .markdown-body span.align-center>span {
1728
+ display: block;
1729
+ margin: 13px auto 0;
1730
+ overflow: hidden;
1731
+ text-align: center;
1732
+ }
1733
+
1734
+ .markdown-body span.align-center span img {
1735
+ margin: 0 auto;
1736
+ text-align: center;
1737
+ }
1738
+
1739
+ .markdown-body span.align-right {
1740
+ display: block;
1741
+ overflow: hidden;
1742
+ clear: both;
1743
+ }
1744
+
1745
+ .markdown-body span.align-right>span {
1746
+ display: block;
1747
+ margin: 13px 0 0;
1748
+ overflow: hidden;
1749
+ text-align: right;
1750
+ }
1751
+
1752
+ .markdown-body span.align-right span img {
1753
+ margin: 0;
1754
+ text-align: right;
1755
+ }
1756
+
1757
+ .markdown-body span.float-left {
1758
+ display: block;
1759
+ float: left;
1760
+ margin-right: 13px;
1761
+ overflow: hidden;
1762
+ }
1763
+
1764
+ .markdown-body span.float-left span {
1765
+ margin: 13px 0 0;
1766
+ }
1767
+
1768
+ .markdown-body span.float-right {
1769
+ display: block;
1770
+ float: right;
1771
+ margin-left: 13px;
1772
+ overflow: hidden;
1773
+ }
1774
+
1775
+ .markdown-body span.float-right>span {
1776
+ display: block;
1777
+ margin: 13px auto 0;
1778
+ overflow: hidden;
1779
+ text-align: right;
1780
+ }
1781
+
1782
+ .markdown-body code,
1783
+ .markdown-body tt {
1784
+ padding: .2em .4em;
1785
+ margin: 0;
1786
+ font-size: 85%;
1787
+ white-space: break-spaces;
1788
+ background-color: var(--bgColor-neutral-muted);
1789
+ border-radius: 6px;
1790
+ }
1791
+
1792
+ .markdown-body code br,
1793
+ .markdown-body tt br {
1794
+ display: none;
1795
+ }
1796
+
1797
+ .markdown-body del code {
1798
+ text-decoration: inherit;
1799
+ }
1800
+
1801
+ .markdown-body samp {
1802
+ font-size: 85%;
1803
+ }
1804
+
1805
+ .markdown-body pre code {
1806
+ font-size: 100%;
1807
+ }
1808
+
1809
+ .markdown-body pre>code {
1810
+ padding: 0;
1811
+ margin: 0;
1812
+ word-break: normal;
1813
+ white-space: pre;
1814
+ background: transparent;
1815
+ border: 0;
1816
+ }
1817
+
1818
+ .markdown-body .highlight {
1819
+ margin-bottom: 16px;
1820
+ }
1821
+
1822
+ .markdown-body .highlight pre {
1823
+ margin-bottom: 0;
1824
+ word-break: normal;
1825
+ }
1826
+
1827
+ .markdown-body .highlight pre,
1828
+ .markdown-body pre {
1829
+ padding: 16px;
1830
+ overflow: auto;
1831
+ font-size: 85%;
1832
+ line-height: 1.45;
1833
+ color: #000000 !important;
1834
+ background-color: #ffffff !important;
1835
+ <!-- color: var(&#45;&#45;fgColor-default);-->
1836
+ <!-- background-color: var(&#45;&#45;bgColor-muted);-->
1837
+ border-radius: 6px;
1838
+ }
1839
+
1840
+ .markdown-body pre code,
1841
+ .markdown-body pre tt {
1842
+ display: inline;
1843
+ max-width: auto;
1844
+ padding: 0;
1845
+ margin: 0;
1846
+ overflow: visible;
1847
+ line-height: inherit;
1848
+ word-wrap: normal;
1849
+ background-color: transparent;
1850
+ border: 0;
1851
+ }
1852
+
1853
+ .markdown-body .csv-data td,
1854
+ .markdown-body .csv-data th {
1855
+ padding: 5px;
1856
+ overflow: hidden;
1857
+ font-size: 12px;
1858
+ line-height: 1;
1859
+ text-align: left;
1860
+ white-space: nowrap;
1861
+ }
1862
+
1863
+ .markdown-body .csv-data .blob-num {
1864
+ padding: 10px 8px 9px;
1865
+ text-align: right;
1866
+ border: 0;
1867
+ }
1868
+
1869
+ .markdown-body .csv-data tr {
1870
+ border-top: 0;
1871
+ }
1872
+
1873
+ .markdown-body .csv-data th {
1874
+ font-weight: var(--base-text-weight-semibold, 600);
1875
+ background: var(--bgColor-muted);
1876
+ border-top: 0;
1877
+ }
1878
+
1879
+ .markdown-body [data-footnote-ref]::before {
1880
+ content: "[";
1881
+ }
1882
+
1883
+ .markdown-body [data-footnote-ref]::after {
1884
+ content: "]";
1885
+ }
1886
+
1887
+ .markdown-body .footnotes {
1888
+ font-size: 12px;
1889
+ color: var(--fgColor-muted);
1890
+ border-top: 1px solid var(--borderColor-default);
1891
+ }
1892
+
1893
+ .markdown-body .footnotes ol {
1894
+ padding-left: 16px;
1895
+ }
1896
+
1897
+ .markdown-body .footnotes ol ul {
1898
+ display: inline-block;
1899
+ padding-left: 16px;
1900
+ margin-top: 16px;
1901
+ }
1902
+
1903
+ .markdown-body .footnotes li {
1904
+ position: relative;
1905
+ }
1906
+
1907
+ .markdown-body .footnotes li:target::before {
1908
+ position: absolute;
1909
+ top: -8px;
1910
+ right: -8px;
1911
+ bottom: -8px;
1912
+ left: -24px;
1913
+ pointer-events: none;
1914
+ content: "";
1915
+ border: 2px solid var(--borderColor-accent-emphasis);
1916
+ border-radius: 6px;
1917
+ }
1918
+
1919
+ .markdown-body .footnotes li:target {
1920
+ color: var(--fgColor-default);
1921
+ }
1922
+
1923
+ .markdown-body .footnotes .data-footnote-backref g-emoji {
1924
+ font-family: monospace;
1925
+ }
1926
+
1927
+ .markdown-body .pl-c {
1928
+ color: var(--color-prettylights-syntax-comment);
1929
+ }
1930
+
1931
+ .markdown-body .pl-c1,
1932
+ .markdown-body .pl-s .pl-v {
1933
+ color: var(--color-prettylights-syntax-constant);
1934
+ }
1935
+
1936
+ .markdown-body .pl-e,
1937
+ .markdown-body .pl-en {
1938
+ color: var(--color-prettylights-syntax-entity);
1939
+ }
1940
+
1941
+ .markdown-body .pl-smi,
1942
+ .markdown-body .pl-s .pl-s1 {
1943
+ color: var(--color-prettylights-syntax-storage-modifier-import);
1944
+ }
1945
+
1946
+ .markdown-body .pl-ent {
1947
+ color: var(--color-prettylights-syntax-entity-tag);
1948
+ }
1949
+
1950
+ .markdown-body .pl-k {
1951
+ color: var(--color-prettylights-syntax-keyword);
1952
+ }
1953
+
1954
+ .markdown-body .pl-s,
1955
+ .markdown-body .pl-pds,
1956
+ .markdown-body .pl-s .pl-pse .pl-s1,
1957
+ .markdown-body .pl-sr,
1958
+ .markdown-body .pl-sr .pl-cce,
1959
+ .markdown-body .pl-sr .pl-sre,
1960
+ .markdown-body .pl-sr .pl-sra {
1961
+ color: var(--color-prettylights-syntax-string);
1962
+ }
1963
+
1964
+ .markdown-body .pl-v,
1965
+ .markdown-body .pl-smw {
1966
+ color: var(--color-prettylights-syntax-variable);
1967
+ }
1968
+
1969
+ .markdown-body .pl-bu {
1970
+ color: var(--color-prettylights-syntax-brackethighlighter-unmatched);
1971
+ }
1972
+
1973
+ .markdown-body .pl-ii {
1974
+ color: var(--color-prettylights-syntax-invalid-illegal-text);
1975
+ background-color: var(--color-prettylights-syntax-invalid-illegal-bg);
1976
+ }
1977
+
1978
+ .markdown-body .pl-c2 {
1979
+ color: var(--color-prettylights-syntax-carriage-return-text);
1980
+ background-color: var(--color-prettylights-syntax-carriage-return-bg);
1981
+ }
1982
+
1983
+ .markdown-body .pl-sr .pl-cce {
1984
+ font-weight: bold;
1985
+ color: var(--color-prettylights-syntax-string-regexp);
1986
+ }
1987
+
1988
+ .markdown-body .pl-ml {
1989
+ color: var(--color-prettylights-syntax-markup-list);
1990
+ }
1991
+
1992
+ .markdown-body .pl-mh,
1993
+ .markdown-body .pl-mh .pl-en,
1994
+ .markdown-body .pl-ms {
1995
+ font-weight: bold;
1996
+ color: var(--color-prettylights-syntax-markup-heading);
1997
+ }
1998
+
1999
+ .markdown-body .pl-mi {
2000
+ font-style: italic;
2001
+ color: var(--color-prettylights-syntax-markup-italic);
2002
+ }
2003
+
2004
+ .markdown-body .pl-mb {
2005
+ font-weight: bold;
2006
+ color: var(--color-prettylights-syntax-markup-bold);
2007
+ }
2008
+
2009
+ .markdown-body .pl-md {
2010
+ color: var(--color-prettylights-syntax-markup-deleted-text);
2011
+ background-color: var(--color-prettylights-syntax-markup-deleted-bg);
2012
+ }
2013
+
2014
+ .markdown-body .pl-mi1 {
2015
+ color: var(--color-prettylights-syntax-markup-inserted-text);
2016
+ background-color: var(--color-prettylights-syntax-markup-inserted-bg);
2017
+ }
2018
+
2019
+ .markdown-body .pl-mc {
2020
+ color: var(--color-prettylights-syntax-markup-changed-text);
2021
+ background-color: var(--color-prettylights-syntax-markup-changed-bg);
2022
+ }
2023
+
2024
+ .markdown-body .pl-mi2 {
2025
+ color: var(--color-prettylights-syntax-markup-ignored-text);
2026
+ background-color: var(--color-prettylights-syntax-markup-ignored-bg);
2027
+ }
2028
+
2029
+ .markdown-body .pl-mdr {
2030
+ font-weight: bold;
2031
+ color: var(--color-prettylights-syntax-meta-diff-range);
2032
+ }
2033
+
2034
+ .markdown-body .pl-ba {
2035
+ color: var(--color-prettylights-syntax-brackethighlighter-angle);
2036
+ }
2037
+
2038
+ .markdown-body .pl-sg {
2039
+ color: var(--color-prettylights-syntax-sublimelinter-gutter-mark);
2040
+ }
2041
+
2042
+ .markdown-body .pl-corl {
2043
+ text-decoration: underline;
2044
+ color: var(--color-prettylights-syntax-constant-other-reference-link);
2045
+ }
2046
+
2047
+ .markdown-body [role=button]:focus:not(:focus-visible),
2048
+ .markdown-body [role=tabpanel][tabindex="0"]:focus:not(:focus-visible),
2049
+ .markdown-body button:focus:not(:focus-visible),
2050
+ .markdown-body summary:focus:not(:focus-visible),
2051
+ .markdown-body a:focus:not(:focus-visible) {
2052
+ outline: none;
2053
+ box-shadow: none;
2054
+ }
2055
+
2056
+ .markdown-body [tabindex="0"]:focus:not(:focus-visible),
2057
+ .markdown-body details-dialog:focus:not(:focus-visible) {
2058
+ outline: none;
2059
+ }
2060
+
2061
+ .markdown-body g-emoji {
2062
+ display: inline-block;
2063
+ min-width: 1ch;
2064
+ font-family: "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
2065
+ font-size: 1em;
2066
+ font-style: normal !important;
2067
+ font-weight: var(--base-text-weight-normal, 400);
2068
+ line-height: 1;
2069
+ vertical-align: -0.075em;
2070
+ }
2071
+
2072
+ .markdown-body g-emoji img {
2073
+ width: 1em;
2074
+ height: 1em;
2075
+ }
2076
+
2077
+ .markdown-body .task-list-item {
2078
+ list-style-type: none;
2079
+ }
2080
+
2081
+ .markdown-body .task-list-item label {
2082
+ font-weight: var(--base-text-weight-normal, 400);
2083
+ }
2084
+
2085
+ .markdown-body .task-list-item.enabled label {
2086
+ cursor: pointer;
2087
+ }
2088
+
2089
+ .markdown-body .task-list-item+.task-list-item {
2090
+ margin-top: var(--base-size-4);
2091
+ }
2092
+
2093
+ .markdown-body .task-list-item .handle {
2094
+ display: none;
2095
+ }
2096
+
2097
+ .markdown-body .task-list-item-checkbox {
2098
+ margin: 0 .2em .25em -1.4em;
2099
+ vertical-align: middle;
2100
+ }
2101
+
2102
+ .markdown-body .contains-task-list:dir(rtl) .task-list-item-checkbox {
2103
+ margin: 0 -1.6em .25em .2em;
2104
+ }
2105
+
2106
+ .markdown-body .contains-task-list {
2107
+ position: relative;
2108
+ }
2109
+
2110
+ .markdown-body .contains-task-list:hover .task-list-item-convert-container,
2111
+ .markdown-body .contains-task-list:focus-within .task-list-item-convert-container {
2112
+ display: block;
2113
+ width: auto;
2114
+ height: 24px;
2115
+ overflow: visible;
2116
+ clip: auto;
2117
+ }
2118
+
2119
+ .markdown-body ::-webkit-calendar-picker-indicator {
2120
+ filter: invert(50%);
2121
+ }
2122
+
2123
+ .markdown-body .markdown-alert {
2124
+ padding: var(--base-size-8) var(--base-size-16);
2125
+ margin-bottom: var(--base-size-16);
2126
+ color: inherit;
2127
+ border-left: .25em solid var(--borderColor-default);
2128
+ }
2129
+
2130
+ .markdown-body .markdown-alert>:first-child {
2131
+ margin-top: 0;
2132
+ }
2133
+
2134
+ .markdown-body .markdown-alert>:last-child {
2135
+ margin-bottom: 0;
2136
+ }
2137
+
2138
+ .markdown-body .markdown-alert .markdown-alert-title {
2139
+ display: flex;
2140
+ font-weight: var(--base-text-weight-medium, 500);
2141
+ align-items: center;
2142
+ line-height: 1;
2143
+ }
2144
+
2145
+ .markdown-body .markdown-alert.markdown-alert-note {
2146
+ border-left-color: var(--borderColor-accent-emphasis);
2147
+ }
2148
+
2149
+ .markdown-body .markdown-alert.markdown-alert-note .markdown-alert-title {
2150
+ color: var(--fgColor-accent);
2151
+ }
2152
+
2153
+ .markdown-body .markdown-alert.markdown-alert-important {
2154
+ border-left-color: var(--borderColor-done-emphasis);
2155
+ }
2156
+
2157
+ .markdown-body .markdown-alert.markdown-alert-important .markdown-alert-title {
2158
+ color: var(--fgColor-done);
2159
+ }
2160
+
2161
+ .markdown-body .markdown-alert.markdown-alert-warning {
2162
+ border-left-color: var(--borderColor-attention-emphasis);
2163
+ }
2164
+
2165
+ .markdown-body .markdown-alert.markdown-alert-warning .markdown-alert-title {
2166
+ color: var(--fgColor-attention);
2167
+ }
2168
+
2169
+ .markdown-body .markdown-alert.markdown-alert-tip {
2170
+ border-left-color: var(--borderColor-success-emphasis);
2171
+ }
2172
+
2173
+ .markdown-body .markdown-alert.markdown-alert-tip .markdown-alert-title {
2174
+ color: var(--fgColor-success);
2175
+ }
2176
+
2177
+ .markdown-body .markdown-alert.markdown-alert-caution {
2178
+ border-left-color: var(--borderColor-danger-emphasis);
2179
+ }
2180
+
2181
+ .markdown-body .markdown-alert.markdown-alert-caution .markdown-alert-title {
2182
+ color: var(--fgColor-danger);
2183
+ }
2184
+
2185
+ .markdown-body>*:first-child>.heading-element:first-child {
2186
+ margin-top: 0 !important;
2187
+ }`;
2188
+
2189
+ const yt_style = `
2190
+ .msg_userMessageBox {
2191
+ width: fit-content;
2192
+ max-width: 90%;
2193
+ display: flex;
2194
+ flex-direction: column;
2195
+ align-items: flex-end;
2196
+ }
2197
+
2198
+ .msg_userMessageBox .msg_messageImgBox {
2199
+ width: 100%;
2200
+ display: flex;
2201
+ flex-wrap: wrap;
2202
+ justify-content: flex-end;
2203
+ }
2204
+
2205
+ .msg_userMessageBox .msg_messageImgBox .msg_messageImg {
2206
+ border-radius: 5px;
2207
+ }
2208
+
2209
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox {
2210
+ flex-shrink: 0;
2211
+ pointer-events: auto;
2212
+ position: relative;
2213
+ width: 137px;
2214
+ background-color: #f0f0f0;
2215
+ border-radius: 10px;
2216
+ margin: 3px 5px;
2217
+ padding: 5px;
2218
+ display: flex;
2219
+ }
2220
+
2221
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox:hover .msg_fileRemove {
2222
+ display: block;
2223
+ }
2224
+
2225
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileInfoBox {
2226
+ margin-left: 10px;
2227
+ overflow: hidden;
2228
+ display: flex;
2229
+ align-items: center;
2230
+ }
2231
+
2232
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileInfoBox .msg_fileInfoFileName {
2233
+ overflow: hidden;
2234
+ text-overflow: ellipsis;
2235
+ white-space: nowrap;
2236
+ width: 72px;
2237
+ color: #242424;
2238
+ user-select: none;
2239
+ }
2240
+
2241
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileInfoBox .msg_fileInfoMeta {
2242
+ user-select: none;
2243
+ color: #a8a8a8;
2244
+ }
2245
+
2246
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileRemove {
2247
+ display: none;
2248
+ position: absolute;
2249
+ cursor: pointer;
2250
+ top: -2px;
2251
+ right: 0;
2252
+ z-index: 99999;
2253
+ }
2254
+
2255
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileRemove img {
2256
+ width: 20px;
2257
+ }
2258
+
2259
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_upImg {
2260
+ border-radius: 3px;
2261
+ z-index: 510;
2262
+ }
2263
+
2264
+ .msg_operateBox {
2265
+ display: flex;
2266
+ margin-top: 5px;
2267
+ user-select: none;
2268
+ }
2269
+
2270
+ .msg_operateBox img {
2271
+ -webkit-user-drag: none;
2272
+ margin-right: 3px;
2273
+ cursor: pointer;
2274
+ width: 16px;
2275
+ }
2276
+
2277
+ .plh_textBox {
2278
+ display: flex;
2279
+ justify-content: center;
2280
+ align-content: center;
2281
+ }
2282
+
2283
+ .plh_textBox .plh_text {
2284
+ font-weight: bold;
2285
+ }
2286
+
2287
+ .w_send_file_box {
2288
+ height: 23px;
2289
+ display: flex;
2290
+ background: transparent;
2291
+ align-items: center;
2292
+ justify-content: center;
2293
+ border-radius: 24px;
2294
+ font-size: 12px;
2295
+ color: #666666;
2296
+ cursor: pointer;
2297
+ }
2298
+
2299
+ .w_file_preview {
2300
+ width: 100%;
2301
+ height: fit-content;
2302
+ background-color: transparent;
2303
+ z-index: 500;
2304
+ display: flex;
2305
+ justify-content: flex-start;
2306
+ align-items: center;
2307
+ padding: 0 5px;
2308
+ overflow-x: hidden;
2309
+ }
2310
+
2311
+ .w_file_preview .w_directionBg {
2312
+ position: absolute;
2313
+ cursor: pointer;
2314
+ width: 18px;
2315
+ height: 18px;
2316
+ background: #FFFFFF;
2317
+ box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
2318
+ border-radius: 5px;
2319
+ border: 1px solid #F0F0F0;
2320
+ z-index: 999999;
2321
+ display: flex;
2322
+ justify-content: center;
2323
+ align-items: center;
2324
+ }
2325
+
2326
+ .w_file_preview .w_directionBg img {
2327
+ width: 12px;
2328
+ }
2329
+
2330
+ .w_file_preview .w_toLeftBox {
2331
+ position: absolute;
2332
+ left: 0;
2333
+ top: 6px;
2334
+ height: 60px;
2335
+ width: 80px;
2336
+ background: linear-gradient(90deg, #FFFFFF 0%, #FFFFFF 25%, rgba(255,255,255,0) 100%);
2337
+ z-index: 99999;
2338
+ }
2339
+
2340
+ .w_file_preview .w_toLeftBox .w_toLeft {
2341
+ position: absolute;
2342
+ cursor: pointer;
2343
+ width: 18px;
2344
+ height: 18px;
2345
+ background: #FFFFFF;
2346
+ box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
2347
+ border-radius: 5px;
2348
+ border: 1px solid #F0F0F0;
2349
+ z-index: 999999;
2350
+ display: flex;
2351
+ justify-content: center;
2352
+ align-items: center;
2353
+ top: 25px;
2354
+ left: 5px;
2355
+ }
2356
+
2357
+ .w_file_preview .w_toRightBox {
2358
+ position: absolute;
2359
+ right: 0;
2360
+ top: 6px;
2361
+ height: 60px;
2362
+ width: 80px;
2363
+ background: linear-gradient(-90deg, #FFFFFF 0%, #FFFFFF 25%, rgba(255, 255, 255, 0) 100%);
2364
+ z-index: 99999;
2365
+ }
2366
+
2367
+ .w_file_preview .w_toRightBox .w_toRight {
2368
+ position: absolute;
2369
+ cursor: pointer;
2370
+ width: 18px;
2371
+ height: 18px;
2372
+ background: #FFFFFF;
2373
+ box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
2374
+ border-radius: 5px;
2375
+ border: 1px solid #F0F0F0;
2376
+ z-index: 999999;
2377
+ display: flex;
2378
+ justify-content: center;
2379
+ align-items: center;
2380
+ top: 25px;
2381
+ right: 5px;
2382
+ }
2383
+
2384
+ .w_file_preview .w_fileBox {
2385
+ position: relative;
2386
+ min-width: fit-content;
2387
+ background-color: #f0f0f0;
2388
+ border-radius: 10px;
2389
+ margin: 10px 5px;
2390
+ padding: 5px;
2391
+ display: flex;
2392
+ }
2393
+
2394
+ .w_file_preview .w_fileBox:hover .w_fileRemove {
2395
+ display: block;
2396
+ }
2397
+
2398
+ .w_file_preview .w_fileBox .w_fileInfoBox {
2399
+ width: fit-content;
2400
+ margin-left: 10px;
2401
+ }
2402
+
2403
+ .w_file_preview .w_fileBox .w_fileInfoBox .w_fileInfoFileName {
2404
+ overflow: hidden;
2405
+ text-overflow: ellipsis;
2406
+ white-space: nowrap;
2407
+ width: 110px;
2408
+ color: #242424;
2409
+ user-select: none;
2410
+ }
2411
+
2412
+ .w_file_preview .w_fileBox .w_fileInfoBox .w_fileInfoMeta {
2413
+ width: fit-content;
2414
+ user-select: none;
2415
+ color: #a8a8a8;
2416
+ white-space: nowrap;
2417
+ }
2418
+
2419
+ .w_file_preview .w_fileBox .w_fileRemove {
2420
+ display: none;
2421
+ position: absolute;
2422
+ cursor: pointer;
2423
+ top: -2px;
2424
+ right: 0;
2425
+ z-index: 99999;
2426
+ }
2427
+
2428
+ .w_file_preview .w_fileBox .w_fileRemove img {
2429
+ width: 20px;
2430
+ }
2431
+
2432
+ .w_file_preview .w_fileBox .w_upImg {
2433
+ border-radius: 3px;
2434
+ z-index: 510;
2435
+ }
2436
+
2437
+ .w_tagListClass {
2438
+ width: 100%;
2439
+ height: fit-content;
2440
+ display: flex;
2441
+ align-items: center;
2442
+ padding: 8px 0 8px 10px;
2443
+ flex-wrap: wrap;
2444
+ gap: 8px;
2445
+ }
2446
+ .w_tagListClass::-webkit-scrollbar {
2447
+ height: 0px;
2448
+ display: none;
2449
+ background: transparent;
2450
+ }
2451
+ .w_tagListClass .w_tagItemBox {
2452
+ padding: 8px 12px;
2453
+ display: flex;
2454
+ align-items: center;
2455
+ justify-content: center;
2456
+ width: fit-content;
2457
+ height: 30px;
2458
+ background: #00000000;
2459
+ border-radius: 15px;
2460
+ border: 1px solid #4B4FFF;
2461
+ cursor: pointer;
2462
+
2463
+ }
2464
+ .w_tagListClass .w_tagItemBox:hover, .w_tagListClass .w_tagItemBox:active {
2465
+ background: linear-gradient( 270deg, #828EFE 0%, #4B4FFF 100%);
2466
+ }
2467
+ .w_tagListClass .w_tagItemBox:hover .w_tagImgh,.w_tagListClass .w_tagItemBox:active .w_tagImgh {
2468
+ filter: brightness(100);
2469
+ }
2470
+
2471
+ .w_tagListClass .w_tagItemBox:hover .w_tagItemText, .w_tagListClass .w_tagItemBox:active .w_tagItemText {
2472
+ color: #fff;
2473
+ }
2474
+ .w_tagListClass .w_tagItemBox .w_tagImgh{
2475
+ width: 16px;
2476
+ height: 16px;
2477
+ }
2478
+ .w_tagListClass .w_tagItemBox .w_tagItemText {
2479
+ width: fit-content;
2480
+ padding-top: 2px;
2481
+ color: #1552FF;
2482
+ font-size: 14px;
2483
+ }
2484
+ .w_tagListClass .w_tagItemBox .w_tagImg {
2485
+ margin-left: 6px;
2486
+ width: 12px;
2487
+ height: 12px;
2488
+ background-repeat: no-repeat;
2489
+ background-size: cover;
2490
+ }
2491
+
2492
+ .w_inputBox {
2493
+ width: calc(100% - 16px);
2494
+ margin: 0 auto 8px;
2495
+ display: flex;
2496
+ align-items: center;
2497
+ box-shadow: 0px 2px 15px 0px rgba(0,48,187,0.1);
2498
+ border-radius: 30px;
2499
+ background: #FFFFFF;
2500
+ transition: height 0.2s ease;
2501
+ }
2502
+ .w_inputBox textarea {
2503
+ resize: none;
2504
+ min-height: 48px;
2505
+ max-height: 96px;
2506
+ border: 0;
2507
+ box-shadow: none !important;
2508
+ color: #333;
2509
+ outline: 0;
2510
+ width: 100%;
2511
+
2512
+ box-sizing: border-box;
2513
+ overflow-y: auto; /* 允许垂直滚动 */
2514
+ scrollbar-width: none; /* Firefox */
2515
+ -ms-overflow-style: none; /* IE and Edge */
2516
+ border-top-left-radius: 50px;
2517
+ border-bottom-left-radius: 50px;
2518
+ }
2519
+
2520
+ .w_inputBox textarea::-webkit-scrollbar {
2521
+ display: none;
2522
+ }
2523
+
2524
+ .w_send_voice_box {
2525
+ height: 23px;
2526
+ display: flex;
2527
+ background: transparent;
2528
+ align-items: center;
2529
+ justify-content: center;
2530
+ border-radius: 24px;
2531
+ font-size: 12px;
2532
+ color: #666666;
2533
+ cursor: pointer;
2534
+ margin-right: 10px;
2535
+ }
2536
+
2537
+ .w_send_voice_box .w_recordIng {
2538
+ padding: 4px;
2539
+ background: #1552FF;
2540
+ border-radius: 8px;
2541
+ }
2542
+ `
2543
+
2544
+ return (
2545
+ <div style={{ position: 'relative',height:'100%' }}>
2546
+ <style dangerouslySetInnerHTML={{ __html: styles + markdownBody + yt_style }}></style>
2547
+ <ChatWindow
2548
+ is_enable_call={is_enable_call}
2549
+ tags={tags}
2550
+ getHistoryList={getHistoryList}
2551
+ userInfo={userInfo}
2552
+ clearMessage={clearMessage}
2553
+ api_key={api_key}
2554
+ input_type={input_type}
2555
+ output_type={output_type}
2556
+ output_component={output_component}
2557
+ open={open}
2558
+ height={height}
2559
+ width={width}
2560
+ send_icon_style={send_icon_style}
2561
+ bot_message_style={bot_message_style}
2562
+ user_message_style={user_message_style}
2563
+ chat_window_style={chat_window_style}
2564
+ error_message_style={error_message_style}
2565
+ send_button_style={send_button_style}
2566
+ placeholder={placeholder}
2567
+ input_style={input_style}
2568
+ online={online}
2569
+ online_message={online_message}
2570
+ offline_message={offline_message}
2571
+ placeholder_sending={placeholder_sending}
2572
+ window_title={window_title}
2573
+ input_container_style={input_container_style}
2574
+ tweaks={tweaks}
2575
+ flowId={flow_id}
2576
+ hostUrl={host_url}
2577
+ updateLastMessage={updateLastMessage}
2578
+ addMessage={addMessage}
2579
+ messages={messages}
2580
+ triggerRef={triggerRef}
2581
+ position={chat_position}
2582
+ sessionId={sessionId}
2583
+ additional_headers={additional_headers}
2584
+ setDropDownList={setDropDownList}
2585
+ dropDownList={dropDownList}
2586
+ baseConfig={baseConfig}
2587
+ isShowVoiceButton={isShowVoiceButton}
2588
+ isShowUploadButton={isShowUploadButton}
2589
+ dropManUrl={dropManUrl}
2590
+ modalWidth={modalWidth}
2591
+ isMobile={isMobile}
2592
+ isShowChatHeader={isShowChatHeader}
2593
+ />
2594
+ </div>
2595
+ );
2596
+ }