yt-chat-components 1.2.3 → 1.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/.idea/sonarlint/issuestore/7/0/7030d0b2f71b999ff89a343de08c414af32fc93a +0 -0
  2. package/.idea/sonarlint/issuestore/8/e/8ec9a00bfd09b3190ac6b22251dbb1aa95a0579d +0 -0
  3. package/.idea/sonarlint/issuestore/9/c/9cfff9a6d27bd6c255aa751213163c7901fb8ce7 +0 -0
  4. package/.idea/sonarlint/issuestore/index.pb +7 -0
  5. package/build/asset-manifest.json +3 -3
  6. package/build/index.html +1 -1
  7. package/build/static/css/main.8ee59d98.css +2 -0
  8. package/build/static/css/main.8ee59d98.css.map +1 -0
  9. package/build/static/js/main.371ede49.js.map +1 -1
  10. package/package.json +80 -79
  11. package/public/index.html +108 -108
  12. package/src/YtChatView/chatWidget/chatWindow/callInterface/index.module.css +50 -50
  13. package/src/YtChatView/chatWidget/chatWindow/callInterface/index.tsx +549 -549
  14. package/src/YtChatView/chatWidget/chatWindow/callInterface/style.ts +44 -44
  15. package/src/YtChatView/chatWidget/chatWindow/chatMessage/index.tsx +501 -501
  16. package/src/YtChatView/chatWidget/chatWindow/chatPlaceholder/index.tsx +23 -23
  17. package/src/YtChatView/chatWidget/chatWindow/controllers/index.ts +249 -249
  18. package/src/YtChatView/chatWidget/chatWindow/index.module.css +196 -196
  19. package/src/YtChatView/chatWidget/chatWindow/index.tsx +1182 -1186
  20. package/src/YtChatView/chatWidget/chatWindow/types/chatWidget/index.ts +50 -50
  21. package/src/YtChatView/chatWidget/index.tsx +2598 -2596
  22. package/src/YtChatView/logoBtn/index.css +3 -3
  23. package/src/YtChatView/logoBtn/index.jsx +103 -103
  24. package/src/YtChatView/logoSplitBtn/index.css +3 -3
  25. package/src/YtChatView/logoSplitBtn/index.jsx +105 -105
  26. package/src/YtChatView/mobileChat/index.jsx +945 -945
  27. package/src/YtChatView/mobileChat/index.module.css +253 -253
  28. package/src/YtChatView/previewDialog/index.jsx +601 -601
  29. package/src/YtChatView/previewDialog/index.module.css +253 -253
  30. package/src/chatWidget/chatWindow/index.tsx +426 -426
  31. package/src/chatWidget/index.tsx +2195 -2195
  32. package/src/index.tsx +10 -10
  33. package/webpack.config.js +50 -50
  34. package/build/static/css/main.e41b943a.css +0 -2
  35. package/build/static/css/main.e41b943a.css.map +0 -1
package/src/YtChatView/chatWidget/index.tsx CHANGED
@@ -1,2596 +1,2598 @@
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
+ cursor: pointer;
708
+
709
+ display:flex;
710
+ justify-content: space-between;
711
+ flex-direction: column;
712
+ }
713
+ .drop-down-item-title {
714
+ font-weight: 400;
715
+ font-size: 16px;
716
+ color: #000000;
717
+ line-height: 20px;
718
+ text-align: left;
719
+ width: 100%;
720
+ margin-bottom:0 !important;
721
+ }
722
+ .drop-down-item-bottom{
723
+ display:flex;
724
+ align-items: center;
725
+ justify-content: space-between;
726
+ flex-direction: row;
727
+ // margin-top:1rem;
728
+ align-items: center;
729
+ }
730
+
731
+ .drop-down-item-bottom-button{
732
+ border-radius: 16px;
733
+ line-height: 20px;
734
+ text-align: left;
735
+ width: 2rem;
736
+ padding: 0.2rem 0.4rem 0.2rem 0.2rem;
737
+ cursor: pointer;
738
+ display: flex;
739
+ justify-content: center;
740
+ align-items: center
741
+ }
742
+
743
+ .drop-down-item-bottom-img{
744
+ width:4rem;
745
+ height:3.5rem;
746
+ }
747
+
748
+ @media screen and (max-width: 1000px){
749
+ .drop-down-item-bottom-img {
750
+ display:none;
751
+ }
752
+ .drop-down-item-bottom {
753
+
754
+ margin-bottom:1rem;
755
+ }
756
+ }
757
+
758
+ .cl-messages_container {
759
+ position: relative;
760
+ display: flex;
761
+ height: 100%;
762
+ flex-direction: column;
763
+ overflow: scroll;
764
+ overflow-x: clip;
765
+ --tw-bg-opacity: 1;
766
+ padding-left: 1rem;
767
+ padding-right: 1rem;
768
+ padding-top: 0.5rem;
769
+ padding-bottom: 0.5rem;
770
+ -ms-overflow-style: none;
771
+ scrollbar-width: none;
772
+ }
773
+
774
+ .cl-messages_container::-webkit-scrollbar {
775
+ display: none;
776
+ }
777
+
778
+ .cl-input_container {
779
+ position: relative;
780
+ display: flex;
781
+ flex-direction: column;
782
+ width: 100%;
783
+ align-items: center;
784
+ --tw-border-opacity: 1;
785
+ --tw-bg-opacity: 1;
786
+ border-top-right-radius: 50px;
787
+ border-bottom-right-radius: 50px;
788
+ }
789
+
790
+ .cl-chat-message {
791
+ display: flex;
792
+ width: 100%;
793
+ padding-top: 0.5rem;
794
+ padding-bottom: 0.5rem;
795
+ padding-left: 0.5rem;
796
+ padding-right: 0.5rem;
797
+ }
798
+
799
+ @-webkit-keyframes pulse {
800
+ 50% {
801
+ opacity: .5;
802
+ }
803
+ }
804
+
805
+ @keyframes pulse {
806
+ 50% {
807
+ opacity: .5;
808
+ }
809
+ }
810
+
811
+ .cl-animate-pulse {
812
+ -webkit-animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
813
+ animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
814
+ }
815
+
816
+ .cl-justify-start {
817
+ justify-content: flex-start;
818
+ }
819
+
820
+ .cl-justify-end {
821
+ justify-content: flex-end;
822
+ }
823
+
824
+ .cl-input-element {
825
+ height: 100%;
826
+ width: 100%;
827
+ padding-left: 1.25rem;
828
+ padding-right: 1.25rem;
829
+ padding-top: 0.25rem;
830
+ padding-bottom: 0.25rem;
831
+ font-weight: 300;
832
+ background-color: #FFFFFF;
833
+ color: rgb(17 24 39);
834
+ border-top-left-radius: 50px;
835
+ border-bottom-left-radius: 50px;
836
+ transition: height 0.2s ease;
837
+ }
838
+ .cl-input-element::-webkit-scrollbar{
839
+ width: 0 !important;
840
+ }
841
+
842
+ .cl-input-element::placeholder {
843
+ line-height:45px;
844
+ }
845
+
846
+ .cl-input-element:focus {
847
+ outline: 2px solid transparent;
848
+ outline-offset: 2px;
849
+ }
850
+
851
+ .cl-input-element:focus::placeholder {
852
+ line-height:unset;
853
+ }
854
+
855
+ .cl-user_message {
856
+ width: -webkit-fit-content;
857
+ width: -moz-fit-content;
858
+ width: fit-content;
859
+ -webkit-column-break-before: all;
860
+ break-before: all;
861
+ border-radius: 0.75rem;
862
+ border-top-right-radius: 0.125rem;
863
+ --tw-bg-opacity: 1;
864
+ background-color: rgb(59 130 246 / var(--tw-bg-opacity));
865
+ padding-left: 1rem;
866
+ padding-right: 1rem;
867
+ padding-top: 0.5rem;
868
+ padding-bottom: 0.5rem;
869
+ text-align: left;
870
+ --tw-text-opacity: 1;
871
+ color: rgb(255 255 255 / var(--tw-text-opacity));
872
+ white-space: pre-line;
873
+ }
874
+
875
+ .cl-error_message {
876
+ width: -webkit-fit-content;
877
+ width: -moz-fit-content;
878
+ width: fit-content;
879
+ max-width: 90%;
880
+ -webkit-column-break-before: all;
881
+ break-before: all;
882
+ border-radius: 0.75rem;
883
+ border-top-left-radius: 0.125rem;
884
+ --tw-bg-opacity: 1;
885
+ background-color: rgb(248 113 113 / var(--tw-bg-opacity));
886
+ padding-left: 1rem;
887
+ padding-right: 1rem;
888
+ padding-top: 0.5rem;
889
+ padding-bottom: 0.5rem;
890
+ text-align: left;
891
+ --tw-text-opacity: 1;
892
+ color: rgb(255 255 255 / var(--tw-text-opacity));
893
+ }
894
+
895
+ .cl-bot_message {
896
+ width: -webkit-fit-content;
897
+ width: -moz-fit-content;
898
+ width: fit-content;
899
+
900
+ -webkit-column-break-before: all;
901
+ break-before: all;
902
+ border-radius: 0.75rem;
903
+ border-top-left-radius: 0.125rem;
904
+ --tw-bg-opacity: 1;
905
+ background-color: #FFFFFF;
906
+ padding-left: 1rem;
907
+ padding-right: 1rem;
908
+ padding-top: 0.5rem;
909
+ padding-bottom: 0.5rem;
910
+ text-align: left;
911
+ --tw-text-opacity: 1;
912
+ color: rgb(31 41 55 / var(--tw-text-opacity));
913
+ }
914
+
915
+ .origin-bottom {
916
+ -webkit-transform-origin: bottom;
917
+ transform-origin: bottom;
918
+ }
919
+
920
+ .origin-bottom-left {
921
+ -webkit-transform-origin: bottom left;
922
+ transform-origin: bottom left;
923
+ }
924
+
925
+ .origin-bottom-right {
926
+ -webkit-transform-origin: bottom right;
927
+ transform-origin: bottom right;
928
+ }
929
+
930
+ .origin-center {
931
+ -webkit-transform-origin: center;
932
+ transform-origin: center;
933
+ }
934
+
935
+ .origin-top {
936
+ -webkit-transform-origin: top;
937
+ transform-origin: top;
938
+ }
939
+
940
+ .origin-top-left {
941
+ -webkit-transform-origin: top left;
942
+ transform-origin: top left;
943
+ }
944
+
945
+ .origin-top-right {
946
+ -webkit-transform-origin: top right;
947
+ transform-origin: top right;
948
+ }
949
+
950
+ .shadow {
951
+ --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
952
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
953
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
954
+ }
955
+ input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
956
+ color: rgb(156 163 175);
957
+ opacity: 1; /* Firefox */
958
+ }
959
+
960
+ input:-ms-input-placeholder { /* Internet Explorer 10-11 */
961
+ color: rgb(156 163 175);
962
+ }
963
+
964
+ input::-ms-input-placeholder { /* Microsoft Edge */
965
+ color: rgb(156 163 175);
966
+ }
967
+ `;
968
+
969
+ const markdownBody = `
970
+
971
+ .markdown-body {
972
+ --base-size-4: 0.25rem;
973
+ --base-size-8: 0.5rem;
974
+ --base-size-16: 1rem;
975
+ --base-text-weight-normal: 400;
976
+ --base-text-weight-medium: 500;
977
+ --base-text-weight-semibold: 600;
978
+ --fontStack-monospace: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
979
+ }
980
+
981
+ @media (prefers-color-scheme: dark) {
982
+ .markdown-body,
983
+ [data-theme="dark"] {
984
+ /*dark*/
985
+ color-scheme: dark;
986
+ --focus-outlineColor: #1f6feb;
987
+ --fgColor-default: #e6edf3;
988
+ --fgColor-muted: #8d96a0;
989
+ --fgColor-accent: #4493f8;
990
+ --fgColor-success: #3fb950;
991
+ --fgColor-attention: #d29922;
992
+ --fgColor-danger: #f85149;
993
+ --fgColor-done: #ab7df8;
994
+ --bgColor-default: #0d1117;
995
+ --bgColor-muted: #161b22;
996
+ --bgColor-neutral-muted: #6e768166;
997
+ --bgColor-attention-muted: #bb800926;
998
+ --borderColor-default: #30363d;
999
+ --borderColor-muted: #30363db3;
1000
+ --borderColor-neutral-muted: #6e768166;
1001
+ --borderColor-accent-emphasis: #1f6feb;
1002
+ --borderColor-success-emphasis: #238636;
1003
+ --borderColor-attention-emphasis: #9e6a03;
1004
+ --borderColor-danger-emphasis: #da3633;
1005
+ --borderColor-done-emphasis: #8957e5;
1006
+ --color-prettylights-syntax-comment: #8b949e;
1007
+ --color-prettylights-syntax-constant: #79c0ff;
1008
+ --color-prettylights-syntax-constant-other-reference-link: #a5d6ff;
1009
+ --color-prettylights-syntax-entity: #d2a8ff;
1010
+ --color-prettylights-syntax-storage-modifier-import: #c9d1d9;
1011
+ --color-prettylights-syntax-entity-tag: #7ee787;
1012
+ --color-prettylights-syntax-keyword: #ff7b72;
1013
+ --color-prettylights-syntax-string: #a5d6ff;
1014
+ --color-prettylights-syntax-variable: #ffa657;
1015
+ --color-prettylights-syntax-brackethighlighter-unmatched: #f85149;
1016
+ --color-prettylights-syntax-brackethighlighter-angle: #8b949e;
1017
+ --color-prettylights-syntax-invalid-illegal-text: #f0f6fc;
1018
+ --color-prettylights-syntax-invalid-illegal-bg: #8e1519;
1019
+ --color-prettylights-syntax-carriage-return-text: #f0f6fc;
1020
+ --color-prettylights-syntax-carriage-return-bg: #b62324;
1021
+ --color-prettylights-syntax-string-regexp: #7ee787;
1022
+ --color-prettylights-syntax-markup-list: #f2cc60;
1023
+ --color-prettylights-syntax-markup-heading: #1f6feb;
1024
+ --color-prettylights-syntax-markup-italic: #c9d1d9;
1025
+ --color-prettylights-syntax-markup-bold: #c9d1d9;
1026
+ --color-prettylights-syntax-markup-deleted-text: #ffdcd7;
1027
+ --color-prettylights-syntax-markup-deleted-bg: #67060c;
1028
+ --color-prettylights-syntax-markup-inserted-text: #aff5b4;
1029
+ --color-prettylights-syntax-markup-inserted-bg: #033a16;
1030
+ --color-prettylights-syntax-markup-changed-text: #ffdfb6;
1031
+ --color-prettylights-syntax-markup-changed-bg: #5a1e02;
1032
+ --color-prettylights-syntax-markup-ignored-text: #c9d1d9;
1033
+ --color-prettylights-syntax-markup-ignored-bg: #1158c7;
1034
+ --color-prettylights-syntax-meta-diff-range: #d2a8ff;
1035
+ --color-prettylights-syntax-sublimelinter-gutter-mark: #484f58;
1036
+ }
1037
+ }
1038
+
1039
+ @media (prefers-color-scheme: light) {
1040
+ .markdown-body,
1041
+ [data-theme="light"] {
1042
+ /*light*/
1043
+ color-scheme: light;
1044
+ --focus-outlineColor: #0969da;
1045
+ --fgColor-default: #1f2328;
1046
+ --fgColor-muted: #636c76;
1047
+ --fgColor-accent: #0969da;
1048
+ --fgColor-success: #1a7f37;
1049
+ --fgColor-attention: #9a6700;
1050
+ --fgColor-danger: #d1242f;
1051
+ --fgColor-done: #8250df;
1052
+ --bgColor-default: #ffffff;
1053
+ --bgColor-muted: #f6f8fa;
1054
+ --bgColor-neutral-muted: #afb8c133;
1055
+ --bgColor-attention-muted: #fff8c5;
1056
+ --borderColor-default: #d0d7de;
1057
+ --borderColor-muted: #d0d7deb3;
1058
+ --borderColor-neutral-muted: #afb8c133;
1059
+ --borderColor-accent-emphasis: #0969da;
1060
+ --borderColor-success-emphasis: #1a7f37;
1061
+ --borderColor-attention-emphasis: #bf8700;
1062
+ --borderColor-danger-emphasis: #cf222e;
1063
+ --borderColor-done-emphasis: #8250df;
1064
+ --color-prettylights-syntax-comment: #57606a;
1065
+ --color-prettylights-syntax-constant: #0550ae;
1066
+ --color-prettylights-syntax-constant-other-reference-link: #0a3069;
1067
+ --color-prettylights-syntax-entity: #6639ba;
1068
+ --color-prettylights-syntax-storage-modifier-import: #24292f;
1069
+ --color-prettylights-syntax-entity-tag: #0550ae;
1070
+ --color-prettylights-syntax-keyword: #cf222e;
1071
+ --color-prettylights-syntax-string: #0a3069;
1072
+ --color-prettylights-syntax-variable: #953800;
1073
+ --color-prettylights-syntax-brackethighlighter-unmatched: #82071e;
1074
+ --color-prettylights-syntax-brackethighlighter-angle: #57606a;
1075
+ --color-prettylights-syntax-invalid-illegal-text: #f6f8fa;
1076
+ --color-prettylights-syntax-invalid-illegal-bg: #82071e;
1077
+ --color-prettylights-syntax-carriage-return-text: #f6f8fa;
1078
+ --color-prettylights-syntax-carriage-return-bg: #cf222e;
1079
+ --color-prettylights-syntax-string-regexp: #116329;
1080
+ --color-prettylights-syntax-markup-list: #3b2300;
1081
+ --color-prettylights-syntax-markup-heading: #0550ae;
1082
+ --color-prettylights-syntax-markup-italic: #24292f;
1083
+ --color-prettylights-syntax-markup-bold: #24292f;
1084
+ --color-prettylights-syntax-markup-deleted-text: #82071e;
1085
+ --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
1086
+ --color-prettylights-syntax-markup-inserted-text: #116329;
1087
+ --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
1088
+ --color-prettylights-syntax-markup-changed-text: #953800;
1089
+ --color-prettylights-syntax-markup-changed-bg: #ffd8b5;
1090
+ --color-prettylights-syntax-markup-ignored-text: #eaeef2;
1091
+ --color-prettylights-syntax-markup-ignored-bg: #0550ae;
1092
+ --color-prettylights-syntax-meta-diff-range: #8250df;
1093
+ --color-prettylights-syntax-sublimelinter-gutter-mark: #8c959f;
1094
+ }
1095
+ }
1096
+
1097
+ .markdown-body {
1098
+ -ms-text-size-adjust: 100%;
1099
+ -webkit-text-size-adjust: 100%;
1100
+ margin: 0;
1101
+ font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
1102
+ font-size: 16px;
1103
+ line-height: 1.5;
1104
+ word-wrap: break-word;
1105
+ scroll-behavior: auto;
1106
+ }
1107
+
1108
+ .markdown-body .octicon {
1109
+ display: inline-block;
1110
+ fill: currentColor;
1111
+ vertical-align: text-bottom;
1112
+ }
1113
+
1114
+ .markdown-body h1:hover .anchor .octicon-link:before,
1115
+ .markdown-body h2:hover .anchor .octicon-link:before,
1116
+ .markdown-body h3:hover .anchor .octicon-link:before,
1117
+ .markdown-body h4:hover .anchor .octicon-link:before,
1118
+ .markdown-body h5:hover .anchor .octicon-link:before,
1119
+ .markdown-body h6:hover .anchor .octicon-link:before {
1120
+ width: 16px;
1121
+ height: 16px;
1122
+ content: ' ';
1123
+ display: inline-block;
1124
+ background-color: currentColor;
1125
+ -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>");
1126
+ 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>");
1127
+ }
1128
+
1129
+ .markdown-body details,
1130
+ .markdown-body figcaption,
1131
+ .markdown-body figure {
1132
+ display: block;
1133
+ }
1134
+
1135
+ .markdown-body summary {
1136
+ display: list-item;
1137
+ }
1138
+
1139
+ .markdown-body [hidden] {
1140
+ display: none !important;
1141
+ }
1142
+
1143
+ .markdown-body a {
1144
+ background-color: transparent;
1145
+ color: var(--fgColor-accent);
1146
+ text-decoration: none;
1147
+ }
1148
+
1149
+ .markdown-body abbr[title] {
1150
+ border-bottom: none;
1151
+ -webkit-text-decoration: underline dotted;
1152
+ text-decoration: underline dotted;
1153
+ }
1154
+
1155
+ .markdown-body b,
1156
+ .markdown-body strong {
1157
+ font-weight: var(--base-text-weight-semibold, 600);
1158
+ }
1159
+
1160
+ .markdown-body dfn {
1161
+ font-style: italic;
1162
+ }
1163
+
1164
+ .markdown-body h1 {
1165
+ margin: .67em 0;
1166
+ font-weight: var(--base-text-weight-semibold, 600);
1167
+ padding-bottom: .3em;
1168
+ font-size: 2em;
1169
+ border-bottom: 1px solid var(--borderColor-muted);
1170
+ }
1171
+
1172
+ .markdown-body mark {
1173
+ background-color: var(--bgColor-attention-muted);
1174
+ color: var(--fgColor-default);
1175
+ }
1176
+
1177
+ .markdown-body small {
1178
+ font-size: 90%;
1179
+ }
1180
+
1181
+ .markdown-body sub,
1182
+ .markdown-body sup {
1183
+ font-size: 75%;
1184
+ line-height: 0;
1185
+ position: relative;
1186
+ vertical-align: baseline;
1187
+ }
1188
+
1189
+ .markdown-body sub {
1190
+ bottom: -0.25em;
1191
+ }
1192
+
1193
+ .markdown-body sup {
1194
+ top: -0.5em;
1195
+ }
1196
+
1197
+ .markdown-body img {
1198
+ border-style: none;
1199
+ max-width: 100%;
1200
+ box-sizing: content-box;
1201
+ }
1202
+
1203
+ .markdown-body code,
1204
+ .markdown-body kbd,
1205
+ .markdown-body pre,
1206
+ .markdown-body samp {
1207
+ font-family: monospace;
1208
+ font-size: 1em;
1209
+ }
1210
+
1211
+ .markdown-body figure {
1212
+ margin: 1em 40px;
1213
+ }
1214
+
1215
+ .markdown-body hr {
1216
+ box-sizing: content-box;
1217
+ overflow: hidden;
1218
+ background: transparent;
1219
+ border-bottom: 1px solid var(--borderColor-muted);
1220
+ height: .25em;
1221
+ padding: 0;
1222
+ margin: 24px 0;
1223
+ background-color: var(--borderColor-default);
1224
+ border: 0;
1225
+ }
1226
+
1227
+ .markdown-body input {
1228
+ font: inherit;
1229
+ margin: 0;
1230
+ overflow: visible;
1231
+ font-family: inherit;
1232
+ font-size: inherit;
1233
+ line-height: inherit;
1234
+ }
1235
+
1236
+ .markdown-body [type=button],
1237
+ .markdown-body [type=reset],
1238
+ .markdown-body [type=submit] {
1239
+ -webkit-appearance: button;
1240
+ appearance: button;
1241
+ }
1242
+
1243
+ .markdown-body [type=checkbox],
1244
+ .markdown-body [type=radio] {
1245
+ box-sizing: border-box;
1246
+ padding: 0;
1247
+ }
1248
+
1249
+ .markdown-body [type=number]::-webkit-inner-spin-button,
1250
+ .markdown-body [type=number]::-webkit-outer-spin-button {
1251
+ height: auto;
1252
+ }
1253
+
1254
+ .markdown-body [type=search]::-webkit-search-cancel-button,
1255
+ .markdown-body [type=search]::-webkit-search-decoration {
1256
+ -webkit-appearance: none;
1257
+ appearance: none;
1258
+ }
1259
+
1260
+ .markdown-body ::-webkit-input-placeholder {
1261
+ color: inherit;
1262
+ opacity: .54;
1263
+ }
1264
+
1265
+ .markdown-body ::-webkit-file-upload-button {
1266
+ -webkit-appearance: button;
1267
+ appearance: button;
1268
+ font: inherit;
1269
+ }
1270
+
1271
+ .markdown-body a:hover {
1272
+ text-decoration: underline;
1273
+ }
1274
+
1275
+ .markdown-body ::placeholder {
1276
+ color: var(--fgColor-muted);
1277
+ opacity: 1;
1278
+ }
1279
+
1280
+ .markdown-body hr::before {
1281
+ display: table;
1282
+ content: "";
1283
+ }
1284
+
1285
+ .markdown-body hr::after {
1286
+ display: table;
1287
+ clear: both;
1288
+ content: "";
1289
+ }
1290
+
1291
+ .markdown-body table {
1292
+ border-spacing: 0;
1293
+ border-collapse: collapse;
1294
+ display: block;
1295
+ width: max-content;
1296
+ max-width: 100%;
1297
+ overflow: auto;
1298
+ }
1299
+
1300
+ .markdown-body td,
1301
+ .markdown-body th {
1302
+ padding: 0;
1303
+ }
1304
+
1305
+ .markdown-body details summary {
1306
+ cursor: pointer;
1307
+ }
1308
+
1309
+ .markdown-body details:not([open])>*:not(summary) {
1310
+ display: none;
1311
+ }
1312
+
1313
+ .markdown-body a:focus,
1314
+ .markdown-body [role=button]:focus,
1315
+ .markdown-body input[type=radio]:focus,
1316
+ .markdown-body input[type=checkbox]:focus {
1317
+ outline: 2px solid var(--focus-outlineColor);
1318
+ outline-offset: -2px;
1319
+ box-shadow: none;
1320
+ }
1321
+
1322
+ .markdown-body a:focus:not(:focus-visible),
1323
+ .markdown-body [role=button]:focus:not(:focus-visible),
1324
+ .markdown-body input[type=radio]:focus:not(:focus-visible),
1325
+ .markdown-body input[type=checkbox]:focus:not(:focus-visible) {
1326
+ outline: solid 1px transparent;
1327
+ }
1328
+
1329
+ .markdown-body a:focus-visible,
1330
+ .markdown-body [role=button]:focus-visible,
1331
+ .markdown-body input[type=radio]:focus-visible,
1332
+ .markdown-body input[type=checkbox]:focus-visible {
1333
+ outline: 2px solid var(--focus-outlineColor);
1334
+ outline-offset: -2px;
1335
+ box-shadow: none;
1336
+ }
1337
+
1338
+ .markdown-body a:not([class]):focus,
1339
+ .markdown-body a:not([class]):focus-visible,
1340
+ .markdown-body input[type=radio]:focus,
1341
+ .markdown-body input[type=radio]:focus-visible,
1342
+ .markdown-body input[type=checkbox]:focus,
1343
+ .markdown-body input[type=checkbox]:focus-visible {
1344
+ outline-offset: 0;
1345
+ }
1346
+
1347
+ .markdown-body kbd {
1348
+ display: inline-block;
1349
+ padding: 3px 5px;
1350
+ font: 11px var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);
1351
+ line-height: 10px;
1352
+ color: var(--fgColor-default);
1353
+ vertical-align: middle;
1354
+ background-color: var(--bgColor-muted);
1355
+ border: solid 1px var(--borderColor-neutral-muted);
1356
+ border-bottom-color: var(--borderColor-neutral-muted);
1357
+ border-radius: 6px;
1358
+ box-shadow: inset 0 -1px 0 var(--borderColor-neutral-muted);
1359
+ }
1360
+
1361
+ .markdown-body h1,
1362
+ .markdown-body h2,
1363
+ .markdown-body h3,
1364
+ .markdown-body h4,
1365
+ .markdown-body h5,
1366
+ .markdown-body h6 {
1367
+ margin-top: 24px;
1368
+ margin-bottom: 16px;
1369
+ font-weight: var(--base-text-weight-semibold, 600);
1370
+ line-height: 1.25;
1371
+ }
1372
+
1373
+ .markdown-body h2 {
1374
+ font-weight: var(--base-text-weight-semibold, 600);
1375
+ padding-bottom: .3em;
1376
+ font-size: 1.5em;
1377
+ border-bottom: 1px solid var(--borderColor-muted);
1378
+ }
1379
+
1380
+ .markdown-body h3 {
1381
+ font-weight: var(--base-text-weight-semibold, 600);
1382
+ font-size: 1.25em;
1383
+ }
1384
+
1385
+ .markdown-body h4 {
1386
+ font-weight: var(--base-text-weight-semibold, 600);
1387
+ font-size: 1em;
1388
+ }
1389
+
1390
+ .markdown-body h5 {
1391
+ font-weight: var(--base-text-weight-semibold, 600);
1392
+ font-size: .875em;
1393
+ }
1394
+
1395
+ .markdown-body h6 {
1396
+ font-weight: var(--base-text-weight-semibold, 600);
1397
+ font-size: .85em;
1398
+ color: var(--fgColor-muted);
1399
+ }
1400
+
1401
+ .markdown-body p {
1402
+ margin-top: 0;
1403
+ margin-bottom: 10px;
1404
+ }
1405
+
1406
+ .markdown-body blockquote {
1407
+ margin: 0;
1408
+ padding: 0 1em;
1409
+ color: var(--fgColor-muted);
1410
+ }
1411
+
1412
+ .markdown-body ul,
1413
+ .markdown-body ol {
1414
+ margin-top: 0;
1415
+ margin-bottom: 0;
1416
+ padding-left: 2em;
1417
+ }
1418
+
1419
+ .markdown-body ol ol,
1420
+ .markdown-body ul ol {
1421
+ list-style-type: lower-roman;
1422
+ }
1423
+
1424
+ .markdown-body ul ul ol,
1425
+ .markdown-body ul ol ol,
1426
+ .markdown-body ol ul ol,
1427
+ .markdown-body ol ol ol {
1428
+ list-style-type: lower-alpha;
1429
+ }
1430
+
1431
+ .markdown-body dd {
1432
+ margin-left: 0;
1433
+ }
1434
+
1435
+ .markdown-body tt,
1436
+ .markdown-body code,
1437
+ .markdown-body samp {
1438
+ font-family: var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);
1439
+ font-size: 12px;
1440
+ }
1441
+
1442
+ .markdown-body pre {
1443
+ margin-top: 0;
1444
+ margin-bottom: 0;
1445
+ font-family: var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);
1446
+ font-size: 12px;
1447
+ word-wrap: normal;
1448
+ }
1449
+
1450
+ .markdown-body .octicon {
1451
+ display: inline-block;
1452
+ overflow: visible !important;
1453
+ vertical-align: text-bottom;
1454
+ fill: currentColor;
1455
+ }
1456
+
1457
+ .markdown-body input::-webkit-outer-spin-button,
1458
+ .markdown-body input::-webkit-inner-spin-button {
1459
+ margin: 0;
1460
+ -webkit-appearance: none;
1461
+ appearance: none;
1462
+ }
1463
+
1464
+ .markdown-body .mr-2 {
1465
+ margin-right: var(--base-size-8, 8px) !important;
1466
+ }
1467
+
1468
+ .markdown-body::before {
1469
+ display: table;
1470
+ content: "";
1471
+ }
1472
+
1473
+ .markdown-body::after {
1474
+ display: table;
1475
+ clear: both;
1476
+ content: "";
1477
+ }
1478
+
1479
+ .markdown-body>*:first-child {
1480
+ margin-top: 0 !important;
1481
+ }
1482
+
1483
+ .markdown-body>*:last-child {
1484
+ margin-bottom: 0 !important;
1485
+ }
1486
+
1487
+ .markdown-body a:not([href]) {
1488
+ color: inherit;
1489
+ text-decoration: none;
1490
+ }
1491
+
1492
+ .markdown-body .absent {
1493
+ color: var(--fgColor-danger);
1494
+ }
1495
+
1496
+ .markdown-body .anchor {
1497
+ float: left;
1498
+ padding-right: 4px;
1499
+ margin-left: -20px;
1500
+ line-height: 1;
1501
+ }
1502
+
1503
+ .markdown-body .anchor:focus {
1504
+ outline: none;
1505
+ }
1506
+
1507
+ .markdown-body p,
1508
+ .markdown-body blockquote,
1509
+ .markdown-body ul,
1510
+ .markdown-body ol,
1511
+ .markdown-body dl,
1512
+ .markdown-body table,
1513
+ .markdown-body pre,
1514
+ .markdown-body details {
1515
+ margin-top: 0;
1516
+ margin-bottom: 16px;
1517
+ }
1518
+
1519
+ .markdown-body blockquote>:first-child {
1520
+ margin-top: 0;
1521
+ }
1522
+
1523
+ .markdown-body blockquote>:last-child {
1524
+ margin-bottom: 0;
1525
+ }
1526
+
1527
+ .markdown-body h1 .octicon-link,
1528
+ .markdown-body h2 .octicon-link,
1529
+ .markdown-body h3 .octicon-link,
1530
+ .markdown-body h4 .octicon-link,
1531
+ .markdown-body h5 .octicon-link,
1532
+ .markdown-body h6 .octicon-link {
1533
+ color: var(--fgColor-default);
1534
+ vertical-align: middle;
1535
+ visibility: hidden;
1536
+ }
1537
+
1538
+ .markdown-body h1:hover .anchor,
1539
+ .markdown-body h2:hover .anchor,
1540
+ .markdown-body h3:hover .anchor,
1541
+ .markdown-body h4:hover .anchor,
1542
+ .markdown-body h5:hover .anchor,
1543
+ .markdown-body h6:hover .anchor {
1544
+ text-decoration: none;
1545
+ }
1546
+
1547
+ .markdown-body h1:hover .anchor .octicon-link,
1548
+ .markdown-body h2:hover .anchor .octicon-link,
1549
+ .markdown-body h3:hover .anchor .octicon-link,
1550
+ .markdown-body h4:hover .anchor .octicon-link,
1551
+ .markdown-body h5:hover .anchor .octicon-link,
1552
+ .markdown-body h6:hover .anchor .octicon-link {
1553
+ visibility: visible;
1554
+ }
1555
+
1556
+ .markdown-body h1 tt,
1557
+ .markdown-body h1 code,
1558
+ .markdown-body h2 tt,
1559
+ .markdown-body h2 code,
1560
+ .markdown-body h3 tt,
1561
+ .markdown-body h3 code,
1562
+ .markdown-body h4 tt,
1563
+ .markdown-body h4 code,
1564
+ .markdown-body h5 tt,
1565
+ .markdown-body h5 code,
1566
+ .markdown-body h6 tt,
1567
+ .markdown-body h6 code {
1568
+ padding: 0 .2em;
1569
+ font-size: inherit;
1570
+ }
1571
+
1572
+ .markdown-body summary h1,
1573
+ .markdown-body summary h2,
1574
+ .markdown-body summary h3,
1575
+ .markdown-body summary h4,
1576
+ .markdown-body summary h5,
1577
+ .markdown-body summary h6 {
1578
+ display: inline-block;
1579
+ }
1580
+
1581
+ .markdown-body summary h1 .anchor,
1582
+ .markdown-body summary h2 .anchor,
1583
+ .markdown-body summary h3 .anchor,
1584
+ .markdown-body summary h4 .anchor,
1585
+ .markdown-body summary h5 .anchor,
1586
+ .markdown-body summary h6 .anchor {
1587
+ margin-left: -40px;
1588
+ }
1589
+
1590
+ .markdown-body summary h1,
1591
+ .markdown-body summary h2 {
1592
+ padding-bottom: 0;
1593
+ border-bottom: 0;
1594
+ }
1595
+
1596
+ .markdown-body ul.no-list,
1597
+ .markdown-body ol.no-list {
1598
+ padding: 0;
1599
+ list-style-type: none;
1600
+ }
1601
+
1602
+ .markdown-body ol[type="a s"] {
1603
+ list-style-type: lower-alpha;
1604
+ }
1605
+
1606
+ .markdown-body ol[type="A s"] {
1607
+ list-style-type: upper-alpha;
1608
+ }
1609
+
1610
+ .markdown-body ol[type="i s"] {
1611
+ list-style-type: lower-roman;
1612
+ }
1613
+
1614
+ .markdown-body ol[type="I s"] {
1615
+ list-style-type: upper-roman;
1616
+ }
1617
+
1618
+ .markdown-body ol[type="1"] {
1619
+ list-style-type: decimal;
1620
+ }
1621
+
1622
+ .markdown-body div>ol:not([type]) {
1623
+ list-style-type: decimal;
1624
+ }
1625
+
1626
+ .markdown-body ul ul,
1627
+ .markdown-body ul ol,
1628
+ .markdown-body ol ol,
1629
+ .markdown-body ol ul {
1630
+ margin-top: 0;
1631
+ margin-bottom: 0;
1632
+ }
1633
+
1634
+ .markdown-body li>p {
1635
+ margin-top: 16px;
1636
+ }
1637
+
1638
+ .markdown-body li+li {
1639
+ margin-top: .25em;
1640
+ }
1641
+
1642
+ .markdown-body dl {
1643
+ padding: 0;
1644
+ }
1645
+
1646
+ .markdown-body dl dt {
1647
+ padding: 0;
1648
+ margin-top: 16px;
1649
+ font-size: 1em;
1650
+ font-style: italic;
1651
+ font-weight: var(--base-text-weight-semibold, 600);
1652
+ }
1653
+
1654
+ .markdown-body dl dd {
1655
+ padding: 0 16px;
1656
+ margin-bottom: 16px;
1657
+ }
1658
+
1659
+ .markdown-body table th {
1660
+ font-weight: var(--base-text-weight-semibold, 600);
1661
+ }
1662
+
1663
+ .markdown-body table th,
1664
+ .markdown-body table td {
1665
+ padding: 6px 13px;
1666
+ border: 1px solid var(--borderColor-default);
1667
+ }
1668
+
1669
+ .markdown-body table td>:last-child {
1670
+ margin-bottom: 0;
1671
+ }
1672
+
1673
+ .markdown-body table tr {
1674
+ border-top: 1px solid var(--borderColor-muted);
1675
+ }
1676
+
1677
+ .markdown-body table img {
1678
+ background-color: transparent;
1679
+ }
1680
+
1681
+ .markdown-body img[align=right] {
1682
+ padding-left: 20px;
1683
+ }
1684
+
1685
+ .markdown-body img[align=left] {
1686
+ padding-right: 20px;
1687
+ }
1688
+
1689
+ .markdown-body .emoji {
1690
+ max-width: none;
1691
+ vertical-align: text-top;
1692
+ background-color: transparent;
1693
+ }
1694
+
1695
+ .markdown-body span.frame {
1696
+ display: block;
1697
+ overflow: hidden;
1698
+ }
1699
+
1700
+ .markdown-body span.frame>span {
1701
+ display: block;
1702
+ float: left;
1703
+ width: auto;
1704
+ padding: 7px;
1705
+ margin: 13px 0 0;
1706
+ overflow: hidden;
1707
+ border: 1px solid var(--borderColor-default);
1708
+ }
1709
+
1710
+ .markdown-body span.frame span img {
1711
+ display: block;
1712
+ float: left;
1713
+ }
1714
+
1715
+ .markdown-body span.frame span span {
1716
+ display: block;
1717
+ padding: 5px 0 0;
1718
+ clear: both;
1719
+ color: var(--fgColor-default);
1720
+ }
1721
+
1722
+ .markdown-body span.align-center {
1723
+ display: block;
1724
+ overflow: hidden;
1725
+ clear: both;
1726
+ }
1727
+
1728
+ .markdown-body span.align-center>span {
1729
+ display: block;
1730
+ margin: 13px auto 0;
1731
+ overflow: hidden;
1732
+ text-align: center;
1733
+ }
1734
+
1735
+ .markdown-body span.align-center span img {
1736
+ margin: 0 auto;
1737
+ text-align: center;
1738
+ }
1739
+
1740
+ .markdown-body span.align-right {
1741
+ display: block;
1742
+ overflow: hidden;
1743
+ clear: both;
1744
+ }
1745
+
1746
+ .markdown-body span.align-right>span {
1747
+ display: block;
1748
+ margin: 13px 0 0;
1749
+ overflow: hidden;
1750
+ text-align: right;
1751
+ }
1752
+
1753
+ .markdown-body span.align-right span img {
1754
+ margin: 0;
1755
+ text-align: right;
1756
+ }
1757
+
1758
+ .markdown-body span.float-left {
1759
+ display: block;
1760
+ float: left;
1761
+ margin-right: 13px;
1762
+ overflow: hidden;
1763
+ }
1764
+
1765
+ .markdown-body span.float-left span {
1766
+ margin: 13px 0 0;
1767
+ }
1768
+
1769
+ .markdown-body span.float-right {
1770
+ display: block;
1771
+ float: right;
1772
+ margin-left: 13px;
1773
+ overflow: hidden;
1774
+ }
1775
+
1776
+ .markdown-body span.float-right>span {
1777
+ display: block;
1778
+ margin: 13px auto 0;
1779
+ overflow: hidden;
1780
+ text-align: right;
1781
+ }
1782
+
1783
+ .markdown-body code,
1784
+ .markdown-body tt {
1785
+ padding: .2em .4em;
1786
+ margin: 0;
1787
+ font-size: 85%;
1788
+ white-space: break-spaces;
1789
+ background-color: var(--bgColor-neutral-muted);
1790
+ border-radius: 6px;
1791
+ }
1792
+
1793
+ .markdown-body code br,
1794
+ .markdown-body tt br {
1795
+ display: none;
1796
+ }
1797
+
1798
+ .markdown-body del code {
1799
+ text-decoration: inherit;
1800
+ }
1801
+
1802
+ .markdown-body samp {
1803
+ font-size: 85%;
1804
+ }
1805
+
1806
+ .markdown-body pre code {
1807
+ font-size: 100%;
1808
+ }
1809
+
1810
+ .markdown-body pre>code {
1811
+ padding: 0;
1812
+ margin: 0;
1813
+ word-break: normal;
1814
+ white-space: pre;
1815
+ background: transparent;
1816
+ border: 0;
1817
+ }
1818
+
1819
+ .markdown-body .highlight {
1820
+ margin-bottom: 16px;
1821
+ }
1822
+
1823
+ .markdown-body .highlight pre {
1824
+ margin-bottom: 0;
1825
+ word-break: normal;
1826
+ }
1827
+
1828
+ .markdown-body .highlight pre,
1829
+ .markdown-body pre {
1830
+ padding: 16px;
1831
+ overflow: auto;
1832
+ font-size: 85%;
1833
+ line-height: 1.45;
1834
+ color: #000000 !important;
1835
+ background-color: #ffffff !important;
1836
+ <!-- color: var(&#45;&#45;fgColor-default);-->
1837
+ <!-- background-color: var(&#45;&#45;bgColor-muted);-->
1838
+ border-radius: 6px;
1839
+ }
1840
+
1841
+ .markdown-body pre code,
1842
+ .markdown-body pre tt {
1843
+ display: inline;
1844
+ max-width: auto;
1845
+ padding: 0;
1846
+ margin: 0;
1847
+ overflow: visible;
1848
+ line-height: inherit;
1849
+ word-wrap: normal;
1850
+ background-color: transparent;
1851
+ border: 0;
1852
+ }
1853
+
1854
+ .markdown-body .csv-data td,
1855
+ .markdown-body .csv-data th {
1856
+ padding: 5px;
1857
+ overflow: hidden;
1858
+ font-size: 12px;
1859
+ line-height: 1;
1860
+ text-align: left;
1861
+ white-space: nowrap;
1862
+ }
1863
+
1864
+ .markdown-body .csv-data .blob-num {
1865
+ padding: 10px 8px 9px;
1866
+ text-align: right;
1867
+ border: 0;
1868
+ }
1869
+
1870
+ .markdown-body .csv-data tr {
1871
+ border-top: 0;
1872
+ }
1873
+
1874
+ .markdown-body .csv-data th {
1875
+ font-weight: var(--base-text-weight-semibold, 600);
1876
+ background: var(--bgColor-muted);
1877
+ border-top: 0;
1878
+ }
1879
+
1880
+ .markdown-body [data-footnote-ref]::before {
1881
+ content: "[";
1882
+ }
1883
+
1884
+ .markdown-body [data-footnote-ref]::after {
1885
+ content: "]";
1886
+ }
1887
+
1888
+ .markdown-body .footnotes {
1889
+ font-size: 12px;
1890
+ color: var(--fgColor-muted);
1891
+ border-top: 1px solid var(--borderColor-default);
1892
+ }
1893
+
1894
+ .markdown-body .footnotes ol {
1895
+ padding-left: 16px;
1896
+ }
1897
+
1898
+ .markdown-body .footnotes ol ul {
1899
+ display: inline-block;
1900
+ padding-left: 16px;
1901
+ margin-top: 16px;
1902
+ }
1903
+
1904
+ .markdown-body .footnotes li {
1905
+ position: relative;
1906
+ }
1907
+
1908
+ .markdown-body .footnotes li:target::before {
1909
+ position: absolute;
1910
+ top: -8px;
1911
+ right: -8px;
1912
+ bottom: -8px;
1913
+ left: -24px;
1914
+ pointer-events: none;
1915
+ content: "";
1916
+ border: 2px solid var(--borderColor-accent-emphasis);
1917
+ border-radius: 6px;
1918
+ }
1919
+
1920
+ .markdown-body .footnotes li:target {
1921
+ color: var(--fgColor-default);
1922
+ }
1923
+
1924
+ .markdown-body .footnotes .data-footnote-backref g-emoji {
1925
+ font-family: monospace;
1926
+ }
1927
+
1928
+ .markdown-body .pl-c {
1929
+ color: var(--color-prettylights-syntax-comment);
1930
+ }
1931
+
1932
+ .markdown-body .pl-c1,
1933
+ .markdown-body .pl-s .pl-v {
1934
+ color: var(--color-prettylights-syntax-constant);
1935
+ }
1936
+
1937
+ .markdown-body .pl-e,
1938
+ .markdown-body .pl-en {
1939
+ color: var(--color-prettylights-syntax-entity);
1940
+ }
1941
+
1942
+ .markdown-body .pl-smi,
1943
+ .markdown-body .pl-s .pl-s1 {
1944
+ color: var(--color-prettylights-syntax-storage-modifier-import);
1945
+ }
1946
+
1947
+ .markdown-body .pl-ent {
1948
+ color: var(--color-prettylights-syntax-entity-tag);
1949
+ }
1950
+
1951
+ .markdown-body .pl-k {
1952
+ color: var(--color-prettylights-syntax-keyword);
1953
+ }
1954
+
1955
+ .markdown-body .pl-s,
1956
+ .markdown-body .pl-pds,
1957
+ .markdown-body .pl-s .pl-pse .pl-s1,
1958
+ .markdown-body .pl-sr,
1959
+ .markdown-body .pl-sr .pl-cce,
1960
+ .markdown-body .pl-sr .pl-sre,
1961
+ .markdown-body .pl-sr .pl-sra {
1962
+ color: var(--color-prettylights-syntax-string);
1963
+ }
1964
+
1965
+ .markdown-body .pl-v,
1966
+ .markdown-body .pl-smw {
1967
+ color: var(--color-prettylights-syntax-variable);
1968
+ }
1969
+
1970
+ .markdown-body .pl-bu {
1971
+ color: var(--color-prettylights-syntax-brackethighlighter-unmatched);
1972
+ }
1973
+
1974
+ .markdown-body .pl-ii {
1975
+ color: var(--color-prettylights-syntax-invalid-illegal-text);
1976
+ background-color: var(--color-prettylights-syntax-invalid-illegal-bg);
1977
+ }
1978
+
1979
+ .markdown-body .pl-c2 {
1980
+ color: var(--color-prettylights-syntax-carriage-return-text);
1981
+ background-color: var(--color-prettylights-syntax-carriage-return-bg);
1982
+ }
1983
+
1984
+ .markdown-body .pl-sr .pl-cce {
1985
+ font-weight: bold;
1986
+ color: var(--color-prettylights-syntax-string-regexp);
1987
+ }
1988
+
1989
+ .markdown-body .pl-ml {
1990
+ color: var(--color-prettylights-syntax-markup-list);
1991
+ }
1992
+
1993
+ .markdown-body .pl-mh,
1994
+ .markdown-body .pl-mh .pl-en,
1995
+ .markdown-body .pl-ms {
1996
+ font-weight: bold;
1997
+ color: var(--color-prettylights-syntax-markup-heading);
1998
+ }
1999
+
2000
+ .markdown-body .pl-mi {
2001
+ font-style: italic;
2002
+ color: var(--color-prettylights-syntax-markup-italic);
2003
+ }
2004
+
2005
+ .markdown-body .pl-mb {
2006
+ font-weight: bold;
2007
+ color: var(--color-prettylights-syntax-markup-bold);
2008
+ }
2009
+
2010
+ .markdown-body .pl-md {
2011
+ color: var(--color-prettylights-syntax-markup-deleted-text);
2012
+ background-color: var(--color-prettylights-syntax-markup-deleted-bg);
2013
+ }
2014
+
2015
+ .markdown-body .pl-mi1 {
2016
+ color: var(--color-prettylights-syntax-markup-inserted-text);
2017
+ background-color: var(--color-prettylights-syntax-markup-inserted-bg);
2018
+ }
2019
+
2020
+ .markdown-body .pl-mc {
2021
+ color: var(--color-prettylights-syntax-markup-changed-text);
2022
+ background-color: var(--color-prettylights-syntax-markup-changed-bg);
2023
+ }
2024
+
2025
+ .markdown-body .pl-mi2 {
2026
+ color: var(--color-prettylights-syntax-markup-ignored-text);
2027
+ background-color: var(--color-prettylights-syntax-markup-ignored-bg);
2028
+ }
2029
+
2030
+ .markdown-body .pl-mdr {
2031
+ font-weight: bold;
2032
+ color: var(--color-prettylights-syntax-meta-diff-range);
2033
+ }
2034
+
2035
+ .markdown-body .pl-ba {
2036
+ color: var(--color-prettylights-syntax-brackethighlighter-angle);
2037
+ }
2038
+
2039
+ .markdown-body .pl-sg {
2040
+ color: var(--color-prettylights-syntax-sublimelinter-gutter-mark);
2041
+ }
2042
+
2043
+ .markdown-body .pl-corl {
2044
+ text-decoration: underline;
2045
+ color: var(--color-prettylights-syntax-constant-other-reference-link);
2046
+ }
2047
+
2048
+ .markdown-body [role=button]:focus:not(:focus-visible),
2049
+ .markdown-body [role=tabpanel][tabindex="0"]:focus:not(:focus-visible),
2050
+ .markdown-body button:focus:not(:focus-visible),
2051
+ .markdown-body summary:focus:not(:focus-visible),
2052
+ .markdown-body a:focus:not(:focus-visible) {
2053
+ outline: none;
2054
+ box-shadow: none;
2055
+ }
2056
+
2057
+ .markdown-body [tabindex="0"]:focus:not(:focus-visible),
2058
+ .markdown-body details-dialog:focus:not(:focus-visible) {
2059
+ outline: none;
2060
+ }
2061
+
2062
+ .markdown-body g-emoji {
2063
+ display: inline-block;
2064
+ min-width: 1ch;
2065
+ font-family: "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
2066
+ font-size: 1em;
2067
+ font-style: normal !important;
2068
+ font-weight: var(--base-text-weight-normal, 400);
2069
+ line-height: 1;
2070
+ vertical-align: -0.075em;
2071
+ }
2072
+
2073
+ .markdown-body g-emoji img {
2074
+ width: 1em;
2075
+ height: 1em;
2076
+ }
2077
+
2078
+ .markdown-body .task-list-item {
2079
+ list-style-type: none;
2080
+ }
2081
+
2082
+ .markdown-body .task-list-item label {
2083
+ font-weight: var(--base-text-weight-normal, 400);
2084
+ }
2085
+
2086
+ .markdown-body .task-list-item.enabled label {
2087
+ cursor: pointer;
2088
+ }
2089
+
2090
+ .markdown-body .task-list-item+.task-list-item {
2091
+ margin-top: var(--base-size-4);
2092
+ }
2093
+
2094
+ .markdown-body .task-list-item .handle {
2095
+ display: none;
2096
+ }
2097
+
2098
+ .markdown-body .task-list-item-checkbox {
2099
+ margin: 0 .2em .25em -1.4em;
2100
+ vertical-align: middle;
2101
+ }
2102
+
2103
+ .markdown-body .contains-task-list:dir(rtl) .task-list-item-checkbox {
2104
+ margin: 0 -1.6em .25em .2em;
2105
+ }
2106
+
2107
+ .markdown-body .contains-task-list {
2108
+ position: relative;
2109
+ }
2110
+
2111
+ .markdown-body .contains-task-list:hover .task-list-item-convert-container,
2112
+ .markdown-body .contains-task-list:focus-within .task-list-item-convert-container {
2113
+ display: block;
2114
+ width: auto;
2115
+ height: 24px;
2116
+ overflow: visible;
2117
+ clip: auto;
2118
+ }
2119
+
2120
+ .markdown-body ::-webkit-calendar-picker-indicator {
2121
+ filter: invert(50%);
2122
+ }
2123
+
2124
+ .markdown-body .markdown-alert {
2125
+ padding: var(--base-size-8) var(--base-size-16);
2126
+ margin-bottom: var(--base-size-16);
2127
+ color: inherit;
2128
+ border-left: .25em solid var(--borderColor-default);
2129
+ }
2130
+
2131
+ .markdown-body .markdown-alert>:first-child {
2132
+ margin-top: 0;
2133
+ }
2134
+
2135
+ .markdown-body .markdown-alert>:last-child {
2136
+ margin-bottom: 0;
2137
+ }
2138
+
2139
+ .markdown-body .markdown-alert .markdown-alert-title {
2140
+ display: flex;
2141
+ font-weight: var(--base-text-weight-medium, 500);
2142
+ align-items: center;
2143
+ line-height: 1;
2144
+ }
2145
+
2146
+ .markdown-body .markdown-alert.markdown-alert-note {
2147
+ border-left-color: var(--borderColor-accent-emphasis);
2148
+ }
2149
+
2150
+ .markdown-body .markdown-alert.markdown-alert-note .markdown-alert-title {
2151
+ color: var(--fgColor-accent);
2152
+ }
2153
+
2154
+ .markdown-body .markdown-alert.markdown-alert-important {
2155
+ border-left-color: var(--borderColor-done-emphasis);
2156
+ }
2157
+
2158
+ .markdown-body .markdown-alert.markdown-alert-important .markdown-alert-title {
2159
+ color: var(--fgColor-done);
2160
+ }
2161
+
2162
+ .markdown-body .markdown-alert.markdown-alert-warning {
2163
+ border-left-color: var(--borderColor-attention-emphasis);
2164
+ }
2165
+
2166
+ .markdown-body .markdown-alert.markdown-alert-warning .markdown-alert-title {
2167
+ color: var(--fgColor-attention);
2168
+ }
2169
+
2170
+ .markdown-body .markdown-alert.markdown-alert-tip {
2171
+ border-left-color: var(--borderColor-success-emphasis);
2172
+ }
2173
+
2174
+ .markdown-body .markdown-alert.markdown-alert-tip .markdown-alert-title {
2175
+ color: var(--fgColor-success);
2176
+ }
2177
+
2178
+ .markdown-body .markdown-alert.markdown-alert-caution {
2179
+ border-left-color: var(--borderColor-danger-emphasis);
2180
+ }
2181
+
2182
+ .markdown-body .markdown-alert.markdown-alert-caution .markdown-alert-title {
2183
+ color: var(--fgColor-danger);
2184
+ }
2185
+
2186
+ .markdown-body>*:first-child>.heading-element:first-child {
2187
+ margin-top: 0 !important;
2188
+ }`;
2189
+
2190
+ const yt_style = `
2191
+ .msg_userMessageBox {
2192
+ width: fit-content;
2193
+ max-width: 90%;
2194
+ display: flex;
2195
+ flex-direction: column;
2196
+ align-items: flex-end;
2197
+ }
2198
+
2199
+ .msg_userMessageBox .msg_messageImgBox {
2200
+ width: 100%;
2201
+ display: flex;
2202
+ flex-wrap: wrap;
2203
+ justify-content: flex-end;
2204
+ }
2205
+
2206
+ .msg_userMessageBox .msg_messageImgBox .msg_messageImg {
2207
+ border-radius: 5px;
2208
+ }
2209
+
2210
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox {
2211
+ flex-shrink: 0;
2212
+ pointer-events: auto;
2213
+ position: relative;
2214
+ width: 137px;
2215
+ background-color: #f0f0f0;
2216
+ border-radius: 10px;
2217
+ margin: 3px 5px;
2218
+ padding: 5px;
2219
+ display: flex;
2220
+ }
2221
+
2222
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox:hover .msg_fileRemove {
2223
+ display: block;
2224
+ }
2225
+
2226
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileInfoBox {
2227
+ margin-left: 10px;
2228
+ overflow: hidden;
2229
+ display: flex;
2230
+ align-items: center;
2231
+ }
2232
+
2233
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileInfoBox .msg_fileInfoFileName {
2234
+ overflow: hidden;
2235
+ text-overflow: ellipsis;
2236
+ white-space: nowrap;
2237
+ width: 72px;
2238
+ color: #242424;
2239
+ user-select: none;
2240
+ }
2241
+
2242
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileInfoBox .msg_fileInfoMeta {
2243
+ user-select: none;
2244
+ color: #a8a8a8;
2245
+ }
2246
+
2247
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileRemove {
2248
+ display: none;
2249
+ position: absolute;
2250
+ cursor: pointer;
2251
+ top: -2px;
2252
+ right: 0;
2253
+ z-index: 99999;
2254
+ }
2255
+
2256
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_fileRemove img {
2257
+ width: 20px;
2258
+ }
2259
+
2260
+ .msg_userMessageBox .msg_messageImgBox .msg_fileBox .msg_upImg {
2261
+ border-radius: 3px;
2262
+ z-index: 510;
2263
+ }
2264
+
2265
+ .msg_operateBox {
2266
+ display: flex;
2267
+ margin-top: 5px;
2268
+ user-select: none;
2269
+ }
2270
+
2271
+ .msg_operateBox img {
2272
+ -webkit-user-drag: none;
2273
+ margin-right: 3px;
2274
+ cursor: pointer;
2275
+ width: 16px;
2276
+ }
2277
+
2278
+ .plh_textBox {
2279
+ display: flex;
2280
+ justify-content: center;
2281
+ align-content: center;
2282
+ }
2283
+
2284
+ .plh_textBox .plh_text {
2285
+ font-weight: bold;
2286
+ }
2287
+
2288
+ .w_send_file_box {
2289
+ height: 23px;
2290
+ display: flex;
2291
+ background: transparent;
2292
+ align-items: center;
2293
+ justify-content: center;
2294
+ border-radius: 24px;
2295
+ font-size: 12px;
2296
+ color: #666666;
2297
+ cursor: pointer;
2298
+ }
2299
+
2300
+ .w_file_preview {
2301
+ width: 100%;
2302
+ height: fit-content;
2303
+ background-color: transparent;
2304
+ z-index: 500;
2305
+ display: flex;
2306
+ justify-content: flex-start;
2307
+ align-items: center;
2308
+ padding: 0 5px;
2309
+ overflow-x: hidden;
2310
+ }
2311
+
2312
+ .w_file_preview .w_directionBg {
2313
+ position: absolute;
2314
+ cursor: pointer;
2315
+ width: 18px;
2316
+ height: 18px;
2317
+ background: #FFFFFF;
2318
+ box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
2319
+ border-radius: 5px;
2320
+ border: 1px solid #F0F0F0;
2321
+ z-index: 999999;
2322
+ display: flex;
2323
+ justify-content: center;
2324
+ align-items: center;
2325
+ }
2326
+
2327
+ .w_file_preview .w_directionBg img {
2328
+ width: 12px;
2329
+ }
2330
+
2331
+ .w_file_preview .w_toLeftBox {
2332
+ position: absolute;
2333
+ left: 0;
2334
+ top: 6px;
2335
+ height: 60px;
2336
+ width: 80px;
2337
+ background: linear-gradient(90deg, #FFFFFF 0%, #FFFFFF 25%, rgba(255,255,255,0) 100%);
2338
+ z-index: 99999;
2339
+ }
2340
+
2341
+ .w_file_preview .w_toLeftBox .w_toLeft {
2342
+ position: absolute;
2343
+ cursor: pointer;
2344
+ width: 18px;
2345
+ height: 18px;
2346
+ background: #FFFFFF;
2347
+ box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
2348
+ border-radius: 5px;
2349
+ border: 1px solid #F0F0F0;
2350
+ z-index: 999999;
2351
+ display: flex;
2352
+ justify-content: center;
2353
+ align-items: center;
2354
+ top: 25px;
2355
+ left: 5px;
2356
+ }
2357
+
2358
+ .w_file_preview .w_toRightBox {
2359
+ position: absolute;
2360
+ right: 0;
2361
+ top: 6px;
2362
+ height: 60px;
2363
+ width: 80px;
2364
+ background: linear-gradient(-90deg, #FFFFFF 0%, #FFFFFF 25%, rgba(255, 255, 255, 0) 100%);
2365
+ z-index: 99999;
2366
+ }
2367
+
2368
+ .w_file_preview .w_toRightBox .w_toRight {
2369
+ position: absolute;
2370
+ cursor: pointer;
2371
+ width: 18px;
2372
+ height: 18px;
2373
+ background: #FFFFFF;
2374
+ box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
2375
+ border-radius: 5px;
2376
+ border: 1px solid #F0F0F0;
2377
+ z-index: 999999;
2378
+ display: flex;
2379
+ justify-content: center;
2380
+ align-items: center;
2381
+ top: 25px;
2382
+ right: 5px;
2383
+ }
2384
+
2385
+ .w_file_preview .w_fileBox {
2386
+ position: relative;
2387
+ min-width: fit-content;
2388
+ background-color: #f0f0f0;
2389
+ border-radius: 10px;
2390
+ margin: 10px 5px;
2391
+ padding: 5px;
2392
+ display: flex;
2393
+ }
2394
+
2395
+ .w_file_preview .w_fileBox:hover .w_fileRemove {
2396
+ display: block;
2397
+ }
2398
+
2399
+ .w_file_preview .w_fileBox .w_fileInfoBox {
2400
+ width: fit-content;
2401
+ margin-left: 10px;
2402
+ }
2403
+
2404
+ .w_file_preview .w_fileBox .w_fileInfoBox .w_fileInfoFileName {
2405
+ overflow: hidden;
2406
+ text-overflow: ellipsis;
2407
+ white-space: nowrap;
2408
+ width: 110px;
2409
+ color: #242424;
2410
+ user-select: none;
2411
+ }
2412
+
2413
+ .w_file_preview .w_fileBox .w_fileInfoBox .w_fileInfoMeta {
2414
+ width: fit-content;
2415
+ user-select: none;
2416
+ color: #a8a8a8;
2417
+ white-space: nowrap;
2418
+ }
2419
+
2420
+ .w_file_preview .w_fileBox .w_fileRemove {
2421
+ display: none;
2422
+ position: absolute;
2423
+ cursor: pointer;
2424
+ top: -2px;
2425
+ right: 0;
2426
+ z-index: 99999;
2427
+ }
2428
+
2429
+ .w_file_preview .w_fileBox .w_fileRemove img {
2430
+ width: 20px;
2431
+ }
2432
+
2433
+ .w_file_preview .w_fileBox .w_upImg {
2434
+ border-radius: 3px;
2435
+ z-index: 510;
2436
+ }
2437
+
2438
+ .w_tagListClass {
2439
+ width: 100%;
2440
+ height: fit-content;
2441
+ display: flex;
2442
+ align-items: center;
2443
+ padding: 8px 0 8px 10px;
2444
+ flex-wrap: wrap;
2445
+ gap: 8px;
2446
+ }
2447
+ .w_tagListClass::-webkit-scrollbar {
2448
+ height: 0px;
2449
+ display: none;
2450
+ background: transparent;
2451
+ }
2452
+ .w_tagListClass .w_tagItemBox {
2453
+ padding: 8px 12px;
2454
+ display: flex;
2455
+ align-items: center;
2456
+ justify-content: center;
2457
+ width: fit-content;
2458
+ height: 30px;
2459
+ background: #00000000;
2460
+ border-radius: 15px;
2461
+ border: 1px solid #4B4FFF;
2462
+ cursor: pointer;
2463
+
2464
+ }
2465
+ .w_tagListClass .w_tagItemBox:hover, .w_tagListClass .w_tagItemBox:active {
2466
+ background: linear-gradient( 270deg, #828EFE 0%, #4B4FFF 100%);
2467
+ }
2468
+ .w_tagListClass .w_tagItemBox:hover .w_tagImgh,.w_tagListClass .w_tagItemBox:active .w_tagImgh {
2469
+ filter: brightness(100);
2470
+ }
2471
+
2472
+ .w_tagListClass .w_tagItemBox:hover .w_tagItemText, .w_tagListClass .w_tagItemBox:active .w_tagItemText {
2473
+ color: #fff;
2474
+ }
2475
+ .w_tagListClass .w_tagItemBox .w_tagImgh{
2476
+ width: 16px;
2477
+ height: 16px;
2478
+ }
2479
+ .w_tagListClass .w_tagItemBox .w_tagItemText {
2480
+ width: fit-content;
2481
+ padding-top: 2px;
2482
+ color: #1552FF;
2483
+ font-size: 14px;
2484
+ }
2485
+ .w_tagListClass .w_tagItemBox .w_tagImg {
2486
+ margin-left: 6px;
2487
+ width: 12px;
2488
+ height: 12px;
2489
+ background-repeat: no-repeat;
2490
+ background-size: cover;
2491
+ }
2492
+
2493
+ .w_inputBox {
2494
+ width: calc(100% - 16px);
2495
+ margin: 0 auto 8px;
2496
+ display: flex;
2497
+ align-items: center;
2498
+ box-shadow: 0px 2px 15px 0px rgba(0,48,187,0.1);
2499
+ border-radius: 30px;
2500
+ background: #FFFFFF;
2501
+ transition: height 0.2s ease;
2502
+ }
2503
+ .w_inputBox textarea {
2504
+ resize: none;
2505
+ min-height: 48px;
2506
+ max-height: 96px;
2507
+ border: 0;
2508
+ box-shadow: none !important;
2509
+ color: #333;
2510
+ outline: 0;
2511
+ width: 100%;
2512
+
2513
+ box-sizing: border-box;
2514
+ overflow-y: auto; /* 允许垂直滚动 */
2515
+ scrollbar-width: none; /* Firefox */
2516
+ -ms-overflow-style: none; /* IE and Edge */
2517
+ border-top-left-radius: 50px;
2518
+ border-bottom-left-radius: 50px;
2519
+ }
2520
+
2521
+ .w_inputBox textarea::-webkit-scrollbar {
2522
+ display: none;
2523
+ }
2524
+
2525
+ .w_send_voice_box {
2526
+ height: 23px;
2527
+ display: flex;
2528
+ background: transparent;
2529
+ align-items: center;
2530
+ justify-content: center;
2531
+ border-radius: 24px;
2532
+ font-size: 12px;
2533
+ color: #666666;
2534
+ cursor: pointer;
2535
+ margin-right: 10px;
2536
+ }
2537
+
2538
+ .w_send_voice_box .w_recordIng {
2539
+ padding: 4px;
2540
+ background: #1552FF;
2541
+ border-radius: 8px;
2542
+ }
2543
+ `
2544
+
2545
+ return (
2546
+ <div style={{ position: 'relative',height:'100%' }}>
2547
+ <style dangerouslySetInnerHTML={{ __html: styles + markdownBody + yt_style }}></style>
2548
+ <div style={{fontSize: 10, color: '#a3a3a3', position: 'absolute', bottom: 6, width: '100%', display: 'flex', justifyContent: 'center'}}>内容由AI生成，无法保证真实准确，仅供参考</div>
2549
+ <ChatWindow
2550
+ is_enable_call={is_enable_call}
2551
+ tags={tags}
2552
+ getHistoryList={getHistoryList}
2553
+ userInfo={userInfo}
2554
+ clearMessage={clearMessage}
2555
+ api_key={api_key}
2556
+ input_type={input_type}
2557
+ output_type={output_type}
2558
+ output_component={output_component}
2559
+ open={open}
2560
+ height={height}
2561
+ width={width}
2562
+ send_icon_style={send_icon_style}
2563
+ bot_message_style={bot_message_style}
2564
+ user_message_style={user_message_style}
2565
+ chat_window_style={chat_window_style}
2566
+ error_message_style={error_message_style}
2567
+ send_button_style={send_button_style}
2568
+ placeholder={placeholder}
2569
+ input_style={input_style}
2570
+ online={online}
2571
+ online_message={online_message}
2572
+ offline_message={offline_message}
2573
+ placeholder_sending={placeholder_sending}
2574
+ window_title={window_title}
2575
+ input_container_style={input_container_style}
2576
+ tweaks={tweaks}
2577
+ flowId={flow_id}
2578
+ hostUrl={host_url}
2579
+ updateLastMessage={updateLastMessage}
2580
+ addMessage={addMessage}
2581
+ messages={messages}
2582
+ triggerRef={triggerRef}
2583
+ position={chat_position}
2584
+ sessionId={sessionId}
2585
+ additional_headers={additional_headers}
2586
+ setDropDownList={setDropDownList}
2587
+ dropDownList={dropDownList}
2588
+ baseConfig={baseConfig}
2589
+ isShowVoiceButton={isShowVoiceButton}
2590
+ isShowUploadButton={isShowUploadButton}
2591
+ dropManUrl={dropManUrl}
2592
+ modalWidth={modalWidth}
2593
+ isMobile={isMobile}
2594
+ isShowChatHeader={isShowChatHeader}
2595
+ />
2596
+ </div>
2597
+ );
2598
+ }