ckeditor5-premium-features 46.1.1 → 47.0.0-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE.md +9 -0
- package/dist/browser/ckeditor5-premium-features-editor.css +5 -2
- package/dist/browser/ckeditor5-premium-features.css +5 -2
- package/dist/browser/ckeditor5-premium-features.js +63 -61
- package/dist/browser/ckeditor5-premium-features.umd.js +65 -63
- package/dist/ckeditor5-premium-features-editor.css +2792 -53
- package/dist/ckeditor5-premium-features.css +3203 -55
- package/dist/translations/af.js +1 -1
- package/dist/translations/af.umd.js +1 -1
- package/dist/translations/ar.js +1 -1
- package/dist/translations/ar.umd.js +1 -1
- package/dist/translations/ast.js +1 -1
- package/dist/translations/ast.umd.js +1 -1
- package/dist/translations/az.js +1 -1
- package/dist/translations/az.umd.js +1 -1
- package/dist/translations/be.js +1 -1
- package/dist/translations/be.umd.js +1 -1
- package/dist/translations/bg.js +1 -1
- package/dist/translations/bg.umd.js +1 -1
- package/dist/translations/bn.js +1 -1
- package/dist/translations/bn.umd.js +1 -1
- package/dist/translations/bs.js +1 -1
- package/dist/translations/bs.umd.js +1 -1
- package/dist/translations/ca.js +1 -1
- package/dist/translations/ca.umd.js +1 -1
- package/dist/translations/cs.js +1 -1
- package/dist/translations/cs.umd.js +1 -1
- package/dist/translations/da.js +1 -1
- package/dist/translations/da.umd.js +1 -1
- package/dist/translations/de-ch.js +1 -1
- package/dist/translations/de-ch.umd.js +1 -1
- package/dist/translations/de.js +1 -1
- package/dist/translations/de.umd.js +1 -1
- package/dist/translations/el.js +1 -1
- package/dist/translations/el.umd.js +1 -1
- package/dist/translations/en-au.js +1 -1
- package/dist/translations/en-au.umd.js +1 -1
- package/dist/translations/en-gb.js +1 -1
- package/dist/translations/en-gb.umd.js +1 -1
- package/dist/translations/en.js +1 -1
- package/dist/translations/en.umd.js +1 -1
- package/dist/translations/eo.js +1 -1
- package/dist/translations/eo.umd.js +1 -1
- package/dist/translations/es-co.js +1 -1
- package/dist/translations/es-co.umd.js +1 -1
- package/dist/translations/es.js +1 -1
- package/dist/translations/es.umd.js +1 -1
- package/dist/translations/et.js +1 -1
- package/dist/translations/et.umd.js +1 -1
- package/dist/translations/eu.js +1 -1
- package/dist/translations/eu.umd.js +1 -1
- package/dist/translations/fa.js +1 -1
- package/dist/translations/fa.umd.js +1 -1
- package/dist/translations/fi.js +1 -1
- package/dist/translations/fi.umd.js +1 -1
- package/dist/translations/fr.js +1 -1
- package/dist/translations/fr.umd.js +1 -1
- package/dist/translations/gl.js +1 -1
- package/dist/translations/gl.umd.js +1 -1
- package/dist/translations/gu.js +1 -1
- package/dist/translations/gu.umd.js +1 -1
- package/dist/translations/he.js +1 -1
- package/dist/translations/he.umd.js +1 -1
- package/dist/translations/hi.js +1 -1
- package/dist/translations/hi.umd.js +1 -1
- package/dist/translations/hr.js +1 -1
- package/dist/translations/hr.umd.js +1 -1
- package/dist/translations/hu.js +1 -1
- package/dist/translations/hu.umd.js +1 -1
- package/dist/translations/hy.js +1 -1
- package/dist/translations/hy.umd.js +1 -1
- package/dist/translations/id.js +1 -1
- package/dist/translations/id.umd.js +1 -1
- package/dist/translations/it.js +1 -1
- package/dist/translations/it.umd.js +1 -1
- package/dist/translations/ja.js +1 -1
- package/dist/translations/ja.umd.js +1 -1
- package/dist/translations/jv.js +1 -1
- package/dist/translations/jv.umd.js +1 -1
- package/dist/translations/kk.js +1 -1
- package/dist/translations/kk.umd.js +1 -1
- package/dist/translations/km.js +1 -1
- package/dist/translations/km.umd.js +1 -1
- package/dist/translations/kn.js +1 -1
- package/dist/translations/kn.umd.js +1 -1
- package/dist/translations/ko.js +1 -1
- package/dist/translations/ko.umd.js +1 -1
- package/dist/translations/ku.js +1 -1
- package/dist/translations/ku.umd.js +1 -1
- package/dist/translations/lt.js +1 -1
- package/dist/translations/lt.umd.js +1 -1
- package/dist/translations/lv.js +1 -1
- package/dist/translations/lv.umd.js +1 -1
- package/dist/translations/ms.js +1 -1
- package/dist/translations/ms.umd.js +1 -1
- package/dist/translations/nb.js +1 -1
- package/dist/translations/nb.umd.js +1 -1
- package/dist/translations/ne.js +1 -1
- package/dist/translations/ne.umd.js +1 -1
- package/dist/translations/nl.js +1 -1
- package/dist/translations/nl.umd.js +1 -1
- package/dist/translations/no.js +1 -1
- package/dist/translations/no.umd.js +1 -1
- package/dist/translations/oc.js +1 -1
- package/dist/translations/oc.umd.js +1 -1
- package/dist/translations/pl.js +1 -1
- package/dist/translations/pl.umd.js +1 -1
- package/dist/translations/pt-br.js +1 -1
- package/dist/translations/pt-br.umd.js +1 -1
- package/dist/translations/pt.js +1 -1
- package/dist/translations/pt.umd.js +1 -1
- package/dist/translations/ro.js +1 -1
- package/dist/translations/ro.umd.js +1 -1
- package/dist/translations/ru.js +1 -1
- package/dist/translations/ru.umd.js +1 -1
- package/dist/translations/si.js +1 -1
- package/dist/translations/si.umd.js +1 -1
- package/dist/translations/sk.js +1 -1
- package/dist/translations/sk.umd.js +1 -1
- package/dist/translations/sl.js +1 -1
- package/dist/translations/sl.umd.js +1 -1
- package/dist/translations/sq.js +1 -1
- package/dist/translations/sq.umd.js +1 -1
- package/dist/translations/sr-latn.js +1 -1
- package/dist/translations/sr-latn.umd.js +1 -1
- package/dist/translations/sr.js +1 -1
- package/dist/translations/sr.umd.js +1 -1
- package/dist/translations/sv.js +1 -1
- package/dist/translations/sv.umd.js +1 -1
- package/dist/translations/th.js +1 -1
- package/dist/translations/th.umd.js +1 -1
- package/dist/translations/ti.js +1 -1
- package/dist/translations/ti.umd.js +1 -1
- package/dist/translations/tk.js +1 -1
- package/dist/translations/tk.umd.js +1 -1
- package/dist/translations/tr.js +1 -1
- package/dist/translations/tr.umd.js +1 -1
- package/dist/translations/tt.js +1 -1
- package/dist/translations/tt.umd.js +1 -1
- package/dist/translations/ug.js +1 -1
- package/dist/translations/ug.umd.js +1 -1
- package/dist/translations/uk.js +1 -1
- package/dist/translations/uk.umd.js +1 -1
- package/dist/translations/ur.js +1 -1
- package/dist/translations/ur.umd.js +1 -1
- package/dist/translations/uz.js +1 -1
- package/dist/translations/uz.umd.js +1 -1
- package/dist/translations/vi.js +1 -1
- package/dist/translations/vi.umd.js +1 -1
- package/dist/translations/zh-cn.js +1 -1
- package/dist/translations/zh-cn.umd.js +1 -1
- package/dist/translations/zh.js +1 -1
- package/dist/translations/zh.umd.js +1 -1
- package/package.json +26 -26
|
@@ -391,6 +391,3147 @@
|
|
|
391
391
|
}
|
|
392
392
|
|
|
393
393
|
|
|
394
|
+
/*
|
|
395
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
396
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
397
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
398
|
+
*
|
|
399
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
400
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
401
|
+
*/
|
|
402
|
+
|
|
403
|
+
.ck.ck-button.ck-tab-button {
|
|
404
|
+
padding: 0;
|
|
405
|
+
border: 0;
|
|
406
|
+
cursor: pointer;
|
|
407
|
+
justify-content: center;
|
|
408
|
+
}
|
|
409
|
+
|
|
410
|
+
.ck.ck-button.ck-tab-button:active,
|
|
411
|
+
.ck.ck-button.ck-tab-button:focus {
|
|
412
|
+
box-shadow: none;
|
|
413
|
+
}
|
|
414
|
+
|
|
415
|
+
.ck.ck-button.ck-tab-button:not(.ck-disabled):hover {
|
|
416
|
+
background-color: var(--ck-color-tab-button-active-background);
|
|
417
|
+
}
|
|
418
|
+
|
|
419
|
+
.ck.ck-button.ck-tab-button .ck.ck-icon {
|
|
420
|
+
padding: var(--ck-tab-button-padding);
|
|
421
|
+
color: var(--ck-color-tab-button-icon);
|
|
422
|
+
}
|
|
423
|
+
|
|
424
|
+
.ck.ck-button.ck-tab-button.ck-on {
|
|
425
|
+
border: 0;
|
|
426
|
+
background-color: var(--ck-color-tab-button-active-background);
|
|
427
|
+
}
|
|
428
|
+
|
|
429
|
+
.ck.ck-button.ck-tab-button.ck-on .ck.ck-icon {
|
|
430
|
+
color: var(--ck-color-tab-button-active-icon);
|
|
431
|
+
background-color: var(--ck-color-tab-button-active-background);
|
|
432
|
+
}
|
|
433
|
+
|
|
434
|
+
.ck.ck-button.ck-tab-button.ck-tab-button_top.ck-on {
|
|
435
|
+
border-bottom: 1px solid var(--ck-color-tab-button-active-icon);
|
|
436
|
+
box-shadow: var(--ck-color-tab-button-active-icon) 0 1px 0 0;
|
|
437
|
+
}
|
|
438
|
+
|
|
439
|
+
.ck.ck-button.ck-tab-button.ck-tab-button_top.ck-on .ck.ck-icon {
|
|
440
|
+
padding-bottom: calc(var(--ck-tab-button-padding) - 1px);
|
|
441
|
+
}
|
|
442
|
+
|
|
443
|
+
.ck.ck-button.ck-tab-button.ck-tab-button_left.ck-on {
|
|
444
|
+
border-left: 0;
|
|
445
|
+
border-right: 1px solid var(--ck-color-tab-button-active-icon);
|
|
446
|
+
box-shadow: var(--ck-color-tab-button-active-icon) 1px 0 0 0;
|
|
447
|
+
}
|
|
448
|
+
|
|
449
|
+
.ck.ck-button.ck-tab-button.ck-tab-button_left.ck-on .ck.ck-icon {
|
|
450
|
+
padding-right: calc(var(--ck-tab-button-padding) - 1px);
|
|
451
|
+
}
|
|
452
|
+
|
|
453
|
+
.ck.ck-button.ck-tab-button.ck-tab-button_right.ck-on {
|
|
454
|
+
border-right: 0;
|
|
455
|
+
border-left: 1px solid var(--ck-color-tab-button-active-icon);
|
|
456
|
+
box-shadow: var(--ck-color-tab-button-active-icon) -1px 0 0 0;
|
|
457
|
+
}
|
|
458
|
+
|
|
459
|
+
.ck.ck-button.ck-tab-button.ck-tab-button_right.ck-on .ck.ck-icon {
|
|
460
|
+
padding-left: calc(var(--ck-tab-button-padding) - 1px);
|
|
461
|
+
}
|
|
462
|
+
|
|
463
|
+
/*
|
|
464
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
465
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
466
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
467
|
+
*
|
|
468
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
469
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
470
|
+
*/
|
|
471
|
+
|
|
472
|
+
:root {
|
|
473
|
+
--ck-tabs-buttons-container-buttons-vertical-spacing: 0;
|
|
474
|
+
--ck-tabs-panels-container-width: auto;
|
|
475
|
+
--ck-tabs-panels-container-background: hsl(0, 0%, 100%);
|
|
476
|
+
--ck-tab-button-padding: 12px;
|
|
477
|
+
--ck-tab-button-gap: var(--ck-spacing-medium);
|
|
478
|
+
--ck-color-tabs-buttons-container-background: hsl(0, 0%, 96%);
|
|
479
|
+
--ck-color-tab-button-icon: hsl(0, 0%, 44%);
|
|
480
|
+
--ck-color-tab-button-active-icon: hsl(0, 0%, 44%);
|
|
481
|
+
--ck-color-tab-button-active-background: hsl(0, 0%, 91%);
|
|
482
|
+
}
|
|
483
|
+
|
|
484
|
+
.ck.ck-tabs {
|
|
485
|
+
display: flex;
|
|
486
|
+
height: 100%;
|
|
487
|
+
|
|
488
|
+
font-size: var(--ck-font-size-base);
|
|
489
|
+
border: 1px solid var(--ck-color-base-border);
|
|
490
|
+
border-radius: var(--ck-border-radius);
|
|
491
|
+
}
|
|
492
|
+
|
|
493
|
+
.ck.ck-tabs.ck-tabs_top {
|
|
494
|
+
flex-direction: column;
|
|
495
|
+
}
|
|
496
|
+
|
|
497
|
+
.ck.ck-tabs.ck-tabs_left {
|
|
498
|
+
flex-direction: row;
|
|
499
|
+
}
|
|
500
|
+
|
|
501
|
+
.ck.ck-tabs.ck-tabs_right {
|
|
502
|
+
flex-direction: row-reverse;
|
|
503
|
+
}
|
|
504
|
+
|
|
505
|
+
.ck.ck-tabs .ck-tabs__panels-container {
|
|
506
|
+
width: var(--ck-tabs-panels-container-width);
|
|
507
|
+
transition: width 0.8s ease-in-out;
|
|
508
|
+
transition: height 0.8s ease-in-out;
|
|
509
|
+
background-color: var(--ck-tabs-panels-container-background);
|
|
510
|
+
flex-grow: 1;
|
|
511
|
+
}
|
|
512
|
+
|
|
513
|
+
.ck.ck-tabs .ck-tabs__buttons-container {
|
|
514
|
+
display: flex;
|
|
515
|
+
background-color: var(--ck-color-tabs-buttons-container-background);
|
|
516
|
+
gap: var(--ck-tab-button-gap);
|
|
517
|
+
}
|
|
518
|
+
|
|
519
|
+
.ck.ck-tabs .ck-tabs__buttons-container.ck-tabs__buttons-container_top {
|
|
520
|
+
border-top: none;
|
|
521
|
+
border-bottom: 1px solid var(--ck-color-base-border);
|
|
522
|
+
flex-direction: row;
|
|
523
|
+
}
|
|
524
|
+
|
|
525
|
+
.ck.ck-tabs .ck-tabs__buttons-container.ck-tabs__buttons-container_left {
|
|
526
|
+
border-left: none;
|
|
527
|
+
border-right: 1px solid var(--ck-color-base-border);
|
|
528
|
+
}
|
|
529
|
+
|
|
530
|
+
.ck.ck-tabs .ck-tabs__buttons-container.ck-tabs__buttons-container_right {
|
|
531
|
+
border-right: none;
|
|
532
|
+
border-left: 1px solid var(--ck-color-base-border);
|
|
533
|
+
}
|
|
534
|
+
|
|
535
|
+
.ck.ck-tabs .ck-tabs__buttons-container.ck-tabs__buttons-container_left,
|
|
536
|
+
.ck.ck-tabs .ck-tabs__buttons-container.ck-tabs__buttons-container_right {
|
|
537
|
+
flex-direction: column;
|
|
538
|
+
padding-top: var(--ck-tabs-buttons-container-buttons-vertical-spacing);
|
|
539
|
+
}
|
|
540
|
+
|
|
541
|
+
/*
|
|
542
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
543
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
544
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
545
|
+
*
|
|
546
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
547
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
548
|
+
*/
|
|
549
|
+
|
|
550
|
+
:root {
|
|
551
|
+
--ck-tabs-overlay-top-position: 0;
|
|
552
|
+
--ck-tabs-overlay-right-position: 0;
|
|
553
|
+
--ck-tabs-overlay-left-position: auto;
|
|
554
|
+
--ck-tabs-overlay-bottom-position: auto;
|
|
555
|
+
--ck-tabs-overlay-height: 100%;
|
|
556
|
+
--ck-ai-tabs-overlay-width: 500px;
|
|
557
|
+
--ck-ai-tabs-overlay-width-maximized: 50%;
|
|
558
|
+
}
|
|
559
|
+
|
|
560
|
+
.ck.ck-tabs.ck-ai-tabs {
|
|
561
|
+
--ck-tabs-buttons-container-buttons-vertical-spacing: 61.5px;
|
|
562
|
+
--ck-color-tab-button-active-icon: hsl(263, 59%, 52%);
|
|
563
|
+
--ck-tabs-panels-container-width: 450px;
|
|
564
|
+
}
|
|
565
|
+
|
|
566
|
+
.ck.ck-tabs.ck-ai-tabs .ck-tab-panel {
|
|
567
|
+
height: 100%;
|
|
568
|
+
display: flex;
|
|
569
|
+
flex-direction: column;
|
|
570
|
+
overflow: hidden;
|
|
571
|
+
}
|
|
572
|
+
|
|
573
|
+
.ck.ck-tabs.ck-ai-tabs .ck-tab-panel>* {
|
|
574
|
+
flex-grow: 1;
|
|
575
|
+
}
|
|
576
|
+
|
|
577
|
+
.ck.ck-tabs.ck-ai-tabs.ck-ai-tabs__overlay {
|
|
578
|
+
position: fixed;
|
|
579
|
+
height: var(--ck-tabs-overlay-height);
|
|
580
|
+
top: var(--ck-tabs-overlay-top-position);
|
|
581
|
+
right: var(--ck-tabs-overlay-right-position);
|
|
582
|
+
left: var(--ck-tabs-overlay-left-position);
|
|
583
|
+
bottom: var(--ck-tabs-overlay-bottom-position);
|
|
584
|
+
z-index: calc(var(--ck-z-dialog) - 1);
|
|
585
|
+
border-radius: 0;
|
|
586
|
+
border-top: 0;
|
|
587
|
+
border-bottom: 0;
|
|
588
|
+
width: var(--ck-ai-tabs-overlay-width);
|
|
589
|
+
transition: width 0.3s ease;
|
|
590
|
+
}
|
|
591
|
+
|
|
592
|
+
.ck.ck-tabs.ck-ai-tabs.ck-ai-tabs__overlay.ck-ai-tabs_maximized {
|
|
593
|
+
width: var(--ck-ai-tabs-overlay-width-maximized);
|
|
594
|
+
}
|
|
595
|
+
|
|
596
|
+
.ck.ck-tabs.ck-ai-tabs.ck-ai-tabs__overlay.ck-tabs_left {
|
|
597
|
+
--ck-tabs-overlay-right-position: auto;
|
|
598
|
+
--ck-tabs-overlay-left-position: 0;
|
|
599
|
+
border-left: 0;
|
|
600
|
+
}
|
|
601
|
+
|
|
602
|
+
.ck.ck-tabs.ck-ai-tabs.ck-ai-tabs__overlay.ck-tabs_right {
|
|
603
|
+
border-right: 0;
|
|
604
|
+
}
|
|
605
|
+
/*
|
|
606
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
607
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
608
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
609
|
+
*
|
|
610
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
611
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
612
|
+
*/
|
|
613
|
+
|
|
614
|
+
/*
|
|
615
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
616
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
617
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
618
|
+
*
|
|
619
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
620
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
621
|
+
*/
|
|
622
|
+
|
|
623
|
+
/*
|
|
624
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
625
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
626
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
627
|
+
*
|
|
628
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
629
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
630
|
+
*/
|
|
631
|
+
|
|
632
|
+
/*
|
|
633
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
634
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
635
|
+
*/
|
|
636
|
+
|
|
637
|
+
.ck.ck-ai-chat__prompt-input.ck-search .ck-labeled-field-view {
|
|
638
|
+
width: 100%;
|
|
639
|
+
}
|
|
640
|
+
|
|
641
|
+
.ck.ck-ai-chat__prompt-input.ck-search .ck-labeled-field-view .ck-labeled-field-view__status_error {
|
|
642
|
+
line-height: 1.4em;
|
|
643
|
+
}
|
|
644
|
+
|
|
645
|
+
.ck.ck-ai-chat__prompt-input.ck-search .ck-labeled-field-view__input-wrapper .ck.ck-input.ck-textarea {
|
|
646
|
+
line-height: calc(var(--ck-font-size-base) * 2);
|
|
647
|
+
|
|
648
|
+
/* The padding is used to make space for the add context button. */
|
|
649
|
+
}
|
|
650
|
+
|
|
651
|
+
[dir="ltr"] .ck.ck-ai-chat__prompt-input.ck-search .ck-labeled-field-view__input-wrapper .ck.ck-input.ck-textarea {
|
|
652
|
+
padding-right: 2.6em;
|
|
653
|
+
}
|
|
654
|
+
|
|
655
|
+
[dir="rtl"] .ck.ck-ai-chat__prompt-input.ck-search .ck-labeled-field-view__input-wrapper .ck.ck-input.ck-textarea {
|
|
656
|
+
padding-left: 2.6em;
|
|
657
|
+
}
|
|
658
|
+
|
|
659
|
+
.ck.ck-ai-chat__prompt-input.ck-search .ck-labeled-field-view__input-wrapper > .ck.ck-label {
|
|
660
|
+
visibility: hidden;
|
|
661
|
+
}
|
|
662
|
+
|
|
663
|
+
.ck.ck-ai-chat__prompt-input.ck-search .ck-ai-chat__prompt-submit-button {
|
|
664
|
+
height: auto;
|
|
665
|
+
align-self: flex-end;
|
|
666
|
+
margin-left: var(--ck-spacing-medium);
|
|
667
|
+
background-color: var(--ck-ai-background-color-action-button);
|
|
668
|
+
color: var(--ck-ai-font-color-action-button);
|
|
669
|
+
}
|
|
670
|
+
|
|
671
|
+
.ck.ck-ai-chat__prompt-input.ck-search .ck-ai-chat__prompt-submit-button.ck-disabled {
|
|
672
|
+
opacity: var(--ck-disabled-opacity);
|
|
673
|
+
}
|
|
674
|
+
|
|
675
|
+
.ck.ck-ai-chat__prompt-input.ck-search .ck-ai-chat__prompt-submit-button > svg {
|
|
676
|
+
opacity: 1;
|
|
677
|
+
}
|
|
678
|
+
|
|
679
|
+
/*
|
|
680
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
681
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
682
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
683
|
+
*
|
|
684
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
685
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
686
|
+
*/
|
|
687
|
+
|
|
688
|
+
.ck.ck-ai-chat-controls .ck-ai-chat__prompt-capabilities {
|
|
689
|
+
display: flex;
|
|
690
|
+
justify-content: space-between;
|
|
691
|
+
align-items: center;
|
|
692
|
+
padding-top: var(--ck-spacing-medium-small);
|
|
693
|
+
gap: var(--ck-spacing-medium-small);
|
|
694
|
+
padding-inline-end: calc(var(--ck-ui-component-min-height) + var(--ck-spacing-medium));
|
|
695
|
+
}
|
|
696
|
+
|
|
697
|
+
.ck.ck-ai-chat-controls .ck-ai-chat__prompt-capabilities .ck-ai-chat-controls-button:not(.ck-button_with-text) {
|
|
698
|
+
margin: 0;
|
|
699
|
+
padding: var(--ck-spacing-tiny);
|
|
700
|
+
}
|
|
701
|
+
|
|
702
|
+
.ck.ck-ai-chat-controls .ck-ai-chat__prompt-capabilities .ck-ai-chat-controls-button > .ck-icon {
|
|
703
|
+
--ck-icon-size: 16px;
|
|
704
|
+
color: var(--ck-ai-chat-color-icon);
|
|
705
|
+
}
|
|
706
|
+
|
|
707
|
+
.ck.ck-ai-chat-controls .ck-ai-chat__prompt-capabilities .ck-ai-chat-controls-button--commands {
|
|
708
|
+
margin-inline-start: auto;
|
|
709
|
+
margin-inline-end: 0;
|
|
710
|
+
margin-block-start: 0;
|
|
711
|
+
margin-block-end: 0;
|
|
712
|
+
padding: 0;
|
|
713
|
+
/*
|
|
714
|
+
* TODO: Remove this when the commands button is implemented.
|
|
715
|
+
*/
|
|
716
|
+
visibility: hidden;
|
|
717
|
+
pointer-events: none;
|
|
718
|
+
}
|
|
719
|
+
|
|
720
|
+
.ck.ck-ai-chat-controls .ck-ai-chat__prompt-capabilities .ck-ai-chat-controls__model-name {
|
|
721
|
+
color: var(--ck-ai-chat-color-icon);
|
|
722
|
+
}
|
|
723
|
+
|
|
724
|
+
/*
|
|
725
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
726
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
727
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
728
|
+
*
|
|
729
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
730
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
731
|
+
*/
|
|
732
|
+
|
|
733
|
+
:root {
|
|
734
|
+
--ck-ai-chat-context-controls-balloon-width: 400px;
|
|
735
|
+
}
|
|
736
|
+
|
|
737
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-context-controls {
|
|
738
|
+
display: flex;
|
|
739
|
+
align-content: center;
|
|
740
|
+
justify-content: flex-start;
|
|
741
|
+
align-items: flex-start;
|
|
742
|
+
flex-wrap: wrap;
|
|
743
|
+
padding-top: 0;
|
|
744
|
+
gap: var(--ck-spacing-medium-small);
|
|
745
|
+
|
|
746
|
+
padding-bottom: var(--ck-spacing-medium-small);
|
|
747
|
+
}
|
|
748
|
+
|
|
749
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-context-controls:has(.ck-ai-chat-context-controls__pending-contexts:empty) {
|
|
750
|
+
padding-bottom: var(--ck-spacing-small);
|
|
751
|
+
}
|
|
752
|
+
|
|
753
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-context-controls .ck-ai-chat-context-controls__pending-contexts {
|
|
754
|
+
display: contents;
|
|
755
|
+
}
|
|
756
|
+
|
|
757
|
+
/* The button to add context living inside the query input. */
|
|
758
|
+
|
|
759
|
+
.ck.ck-ai-chat-controls .ck-button.ck-ai-chat-controls-button.ck-ai-chat-context-controls__add-context-button {
|
|
760
|
+
position: absolute;
|
|
761
|
+
bottom: 3px;
|
|
762
|
+
opacity: .7;
|
|
763
|
+
margin: 0;
|
|
764
|
+
}
|
|
765
|
+
|
|
766
|
+
.ck.ck-ai-chat-controls .ck-button.ck-ai-chat-controls-button.ck-ai-chat-context-controls__add-context-button:hover, .ck.ck-ai-chat-controls .ck-button.ck-ai-chat-controls-button.ck-ai-chat-context-controls__add-context-button:focus {
|
|
767
|
+
opacity: 1;
|
|
768
|
+
}
|
|
769
|
+
|
|
770
|
+
/*
|
|
771
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
772
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
773
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
774
|
+
*
|
|
775
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
776
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
777
|
+
*/
|
|
778
|
+
|
|
779
|
+
/* .ck-ai-chat-context-chip {
|
|
780
|
+
|
|
781
|
+
} */
|
|
782
|
+
|
|
783
|
+
:root {
|
|
784
|
+
--ck-ai-chat-context-balloon-width: 290px;
|
|
785
|
+
}
|
|
786
|
+
|
|
787
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chip, .ck.ck-ai-chat .ck-ai-chat-context-chip {
|
|
788
|
+
display: inline-flex;
|
|
789
|
+
align-items: center;
|
|
790
|
+
justify-content: center;
|
|
791
|
+
flex-shrink: 0;
|
|
792
|
+
|
|
793
|
+
max-width: max(calc(33% - var(--ck-spacing-medium-small) - (2 * var(--ck-spacing-large) / 3)), 118px);
|
|
794
|
+
box-sizing: border-box;
|
|
795
|
+
|
|
796
|
+
width: auto;
|
|
797
|
+
|
|
798
|
+
padding: var(--ck-spacing-small) var(--ck-spacing-medium-small);
|
|
799
|
+
|
|
800
|
+
background-color: var(--ck-ai-chat-user-context-background);
|
|
801
|
+
border-radius: var(--ck-ai-border-radius);
|
|
802
|
+
border: var(--ck-ai-chat-border-width) solid var(--ck-ai-border-color-main);
|
|
803
|
+
|
|
804
|
+
line-height: 1;
|
|
805
|
+
color: var(--ck-ai-chat-color-icon);
|
|
806
|
+
}
|
|
807
|
+
|
|
808
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chip.ck-ai-chat-context-chip_wide, .ck.ck-ai-chat .ck-ai-chat-context-chip.ck-ai-chat-context-chip_wide {
|
|
809
|
+
max-width: max(calc(66% - var(--ck-spacing-medium-small)), 240px);
|
|
810
|
+
width: auto;
|
|
811
|
+
}
|
|
812
|
+
|
|
813
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chip.ck-ai-chat-context-chip_document, .ck.ck-ai-chat .ck-ai-chat-context-chip.ck-ai-chat-context-chip_document {
|
|
814
|
+
max-width: unset;
|
|
815
|
+
}
|
|
816
|
+
|
|
817
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chip.ck-ai-chat-context-chip_new-chip, .ck.ck-ai-chat .ck-ai-chat-context-chip.ck-ai-chat-context-chip_new-chip {
|
|
818
|
+
animation: ck-ai-new-item-flash var(--ck-ai-chat-animation-duration) var(--ck-ai-chat-animation-timing);
|
|
819
|
+
}
|
|
820
|
+
|
|
821
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chip > .ck-ai-chat-context-chip__label, .ck.ck-ai-chat .ck-ai-chat-context-chip > .ck-ai-chat-context-chip__label {
|
|
822
|
+
font-size: 0.9em;
|
|
823
|
+
display: inline-block;
|
|
824
|
+
margin: 0 var(--ck-spacing-medium-small);
|
|
825
|
+
text-overflow: ellipsis;
|
|
826
|
+
overflow: hidden;
|
|
827
|
+
line-height: 1.25;
|
|
828
|
+
color: var(--ck-ai-chat-color-icon);
|
|
829
|
+
}
|
|
830
|
+
|
|
831
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chip > .ck-icon.ck-ai-chat-context-chip__type-icon, .ck.ck-ai-chat .ck-ai-chat-context-chip > .ck-icon.ck-ai-chat-context-chip__type-icon {
|
|
832
|
+
--ck-icon-size: 1em;
|
|
833
|
+
|
|
834
|
+
flex-shrink: 0;
|
|
835
|
+
font-size: 1em;
|
|
836
|
+
fill: var(--ck-ai-chat-color-icon);
|
|
837
|
+
}
|
|
838
|
+
|
|
839
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chip .ck-button, .ck.ck-ai-chat .ck-ai-chat-context-chip .ck-button {
|
|
840
|
+
--ck-ui-component-min-height: 1em;
|
|
841
|
+
|
|
842
|
+
max-width: var(--ck-ui-component-min-height);
|
|
843
|
+
max-height: var(--ck-ui-component-min-height);
|
|
844
|
+
border: none;
|
|
845
|
+
padding: var(--ck-spacing-tiny);
|
|
846
|
+
}
|
|
847
|
+
|
|
848
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chip .ck-button > .ck-icon, .ck.ck-ai-chat .ck-ai-chat-context-chip .ck-button > .ck-icon {
|
|
849
|
+
--ck-icon-size: 1em;
|
|
850
|
+
|
|
851
|
+
font-size: 1em;
|
|
852
|
+
fill: var(--ck-ai-chat-color-icon);
|
|
853
|
+
}
|
|
854
|
+
|
|
855
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chips-wrapper, .ck.ck-ai-chat .ck-ai-chat-context-chips-wrapper {
|
|
856
|
+
display: flex;
|
|
857
|
+
gap: var(--ck-spacing-medium-small);
|
|
858
|
+
flex-wrap: wrap;
|
|
859
|
+
align-items: center;
|
|
860
|
+
justify-content: flex-end;
|
|
861
|
+
|
|
862
|
+
width: 100%;
|
|
863
|
+
margin-bottom: 0;
|
|
864
|
+
padding: 0;
|
|
865
|
+
}
|
|
866
|
+
|
|
867
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chips-wrapper-balloon, .ck.ck-ai-chat .ck-ai-chat-context-chips-wrapper-balloon {
|
|
868
|
+
display: flex;
|
|
869
|
+
gap: var(--ck-spacing-standard);
|
|
870
|
+
flex-wrap: wrap;
|
|
871
|
+
align-items: center;
|
|
872
|
+
justify-content: flex-start;
|
|
873
|
+
|
|
874
|
+
width: var(--ck-ai-chat-context-balloon-width);
|
|
875
|
+
max-height: 10em;
|
|
876
|
+
padding: var(--ck-spacing-standard);
|
|
877
|
+
overflow-y: auto;
|
|
878
|
+
}
|
|
879
|
+
|
|
880
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chips-wrapper-balloon .ck-ai-chat-context-chip, .ck.ck-ai-chat .ck-ai-chat-context-chips-wrapper-balloon .ck-ai-chat-context-chip {
|
|
881
|
+
max-width: max( calc(50% - var(--ck-spacing-standard)), 110px);
|
|
882
|
+
}
|
|
883
|
+
|
|
884
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chips-wrapper-balloon.ck-ai-chat-context-chip_wide, .ck.ck-ai-chat .ck-ai-chat-context-chips-wrapper-balloon.ck-ai-chat-context-chip_wide {
|
|
885
|
+
max-width: 100%;
|
|
886
|
+
}
|
|
887
|
+
|
|
888
|
+
.ck.ck-balloon-panel .ck-ai-chat-context-chips-wrapper-balloon .ck-ai-chat-context-chip.ck-ai-chat-context-chip_new-chip, .ck.ck-ai-chat .ck-ai-chat-context-chips-wrapper-balloon .ck-ai-chat-context-chip.ck-ai-chat-context-chip_new-chip {
|
|
889
|
+
animation: none;
|
|
890
|
+
}
|
|
891
|
+
|
|
892
|
+
@keyframes ck-ai-new-item-flash {
|
|
893
|
+
0% {
|
|
894
|
+
background-color: var(--ck-ai-chat-flash-color);
|
|
895
|
+
color: var(--ck-ai-chat-flash-color-text);
|
|
896
|
+
border-color: var(--ck-ai-chat-flash-color-text);
|
|
897
|
+
}
|
|
898
|
+
|
|
899
|
+
100% {
|
|
900
|
+
background-color: var(--ck-ai-chat-user-context-background);
|
|
901
|
+
color: var(--ck-ai-chat-color-icon);
|
|
902
|
+
border-color: var(--ck-ai-border-color-main);
|
|
903
|
+
}
|
|
904
|
+
}
|
|
905
|
+
|
|
906
|
+
/*
|
|
907
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
908
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
909
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
910
|
+
*
|
|
911
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
912
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
913
|
+
*/
|
|
914
|
+
|
|
915
|
+
.ck.ck-button.ck-ai-chat-controls-button {
|
|
916
|
+
--ck-ui-component-min-height: 1.88em;
|
|
917
|
+
|
|
918
|
+
padding: var(--ck-spacing-tiny);
|
|
919
|
+
flex-shrink: 0;
|
|
920
|
+
display: flex;
|
|
921
|
+
align-items: center;
|
|
922
|
+
justify-content: center;
|
|
923
|
+
}
|
|
924
|
+
|
|
925
|
+
.ck.ck-button.ck-ai-chat-controls-button:not(.ck-button_with-text) {
|
|
926
|
+
margin: 0 0 var(--ck-spacing-tiny) 0;
|
|
927
|
+
padding: var(--ck-spacing-tiny);
|
|
928
|
+
}
|
|
929
|
+
|
|
930
|
+
.ck.ck-button.ck-ai-chat-controls-button.ck-button_with-text.ck-ai-chat-controls_context_show-more-button {
|
|
931
|
+
display: block;
|
|
932
|
+
padding: 0;
|
|
933
|
+
border-width: 0;
|
|
934
|
+
letter-spacing: -0.1em;
|
|
935
|
+
text-align: center;
|
|
936
|
+
}
|
|
937
|
+
|
|
938
|
+
.ck.ck-button.ck-ai-chat-controls-button:not(.ck-disabled):hover {
|
|
939
|
+
background-color: var(--ck-ai-chat-button-active-background-color);
|
|
940
|
+
color: var(--ck-ai-chat-button-hover-color);
|
|
941
|
+
}
|
|
942
|
+
|
|
943
|
+
.ck.ck-button.ck-ai-chat-controls-button:not(.ck-disabled):hover .ck-button__icon {
|
|
944
|
+
fill: var(--ck-ai-chat-button-hover-color);
|
|
945
|
+
}
|
|
946
|
+
|
|
947
|
+
.ck.ck-button.ck-ai-chat-controls-button:not(.ck-disabled):active {
|
|
948
|
+
background-color: var(--ck-ai-chat-button-active-background-color);
|
|
949
|
+
color: var(--ck-ai-chat-button-active-color);
|
|
950
|
+
}
|
|
951
|
+
|
|
952
|
+
.ck.ck-button.ck-ai-chat-controls-button:not(.ck-disabled):active .ck-button__icon {
|
|
953
|
+
fill: var(--ck-ai-chat-button-active-color);
|
|
954
|
+
}
|
|
955
|
+
|
|
956
|
+
.ck.ck-button.ck-ai-chat-controls-button.ck-on:not(.ck-disabled):not(:hover):not(:active):not(.ck-disabled) {
|
|
957
|
+
background-color: var(--ck-ai-chat-button-active-background-color);
|
|
958
|
+
color: var(--ck-ai-chat-button-active-color);
|
|
959
|
+
}
|
|
960
|
+
|
|
961
|
+
.ck.ck-button.ck-ai-chat-controls-button.ck-on:not(.ck-disabled):not(:hover):not(:active):not(.ck-disabled) .ck-button__icon {
|
|
962
|
+
color: var(--ck-ai-chat-button-active-color);
|
|
963
|
+
}
|
|
964
|
+
|
|
965
|
+
.ck.ck-button.ck-ai-chat-controls-button > .ck-icon {
|
|
966
|
+
--ck-icon-size: 16px;
|
|
967
|
+
}
|
|
968
|
+
|
|
969
|
+
.ck.ck-button.ck-ai-chat-controls-button .ck-dropdown__arrow {
|
|
970
|
+
display: none;
|
|
971
|
+
}
|
|
972
|
+
|
|
973
|
+
/* svg {
|
|
974
|
+
margin-right: 0;
|
|
975
|
+
width: auto;
|
|
976
|
+
font-size: 1em;
|
|
977
|
+
} */
|
|
978
|
+
|
|
979
|
+
/*
|
|
980
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
981
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
982
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
983
|
+
*
|
|
984
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
985
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
986
|
+
*/
|
|
987
|
+
|
|
988
|
+
:root {
|
|
989
|
+
--ck-ai-chat-loader-icon-dot-color: hsl(216, 5%, 81%);
|
|
990
|
+
--ck-ai-chat-loader-icon-dot-active-color: hsl(0, 0%, 20%);
|
|
991
|
+
--ck-ai-loader-dot-pulse-dot-size: 6px;
|
|
992
|
+
--ck-ai-loader-dot-pulse-width: 40px;
|
|
993
|
+
--ck-ai-loader-dot-pulse-height: 20px;
|
|
994
|
+
--ck-ai-loader-dot-pulse-border-radius: 8px;
|
|
995
|
+
--ck-ai-loader-dot-pulse-animation-delay: 0.3s;
|
|
996
|
+
}
|
|
997
|
+
|
|
998
|
+
.ck-ai-chat-controls-loader {
|
|
999
|
+
display: flex;
|
|
1000
|
+
align-items: center;
|
|
1001
|
+
color: var(--ck-color-input-disabled-text);
|
|
1002
|
+
}
|
|
1003
|
+
|
|
1004
|
+
.ck-ai-chat-controls-loader .ck-ai-chat-controls-loader-icon {
|
|
1005
|
+
box-sizing: border-box;
|
|
1006
|
+
display: flex;
|
|
1007
|
+
align-items: center;
|
|
1008
|
+
justify-content: space-between;
|
|
1009
|
+
width: var(--ck-ai-loader-dot-pulse-width);
|
|
1010
|
+
height: var(--ck-ai-loader-dot-pulse-height);
|
|
1011
|
+
margin-inline-end: var(--ck-spacing-standard);
|
|
1012
|
+
padding: var(--ck-spacing-small) var(--ck-spacing-medium-small);
|
|
1013
|
+
border-radius: var(--ck-ai-loader-dot-pulse-border-radius);
|
|
1014
|
+
background-color: var(--ck-ai-chat-loader-icon-color);
|
|
1015
|
+
}
|
|
1016
|
+
|
|
1017
|
+
.ck-ai-chat-controls-loader .ck-ai-chat-controls-loader-icon-dot {
|
|
1018
|
+
width: var(--ck-ai-loader-dot-pulse-dot-size);
|
|
1019
|
+
height: var(--ck-ai-loader-dot-pulse-dot-size);
|
|
1020
|
+
border-radius: 50%;
|
|
1021
|
+
background-color: var(--ck-ai-chat-loader-icon-dot-color);
|
|
1022
|
+
flex-shrink: 0;
|
|
1023
|
+
|
|
1024
|
+
animation: ck-ai-loader-dot-pulse var(--ck-ai-chat-loader-animation-duration) infinite;
|
|
1025
|
+
}
|
|
1026
|
+
|
|
1027
|
+
.ck-ai-chat-controls-loader .ck-ai-chat-controls-loader-icon-dot:nth-child(1) {
|
|
1028
|
+
animation-delay: 0s;
|
|
1029
|
+
}
|
|
1030
|
+
|
|
1031
|
+
.ck-ai-chat-controls-loader .ck-ai-chat-controls-loader-icon-dot:nth-child(2) {
|
|
1032
|
+
animation-delay: var(--ck-ai-loader-dot-pulse-animation-delay);
|
|
1033
|
+
}
|
|
1034
|
+
|
|
1035
|
+
.ck-ai-chat-controls-loader .ck-ai-chat-controls-loader-icon-dot:nth-child(3) {
|
|
1036
|
+
animation-delay: calc(var(--ck-ai-loader-dot-pulse-animation-delay) * 2);
|
|
1037
|
+
}
|
|
1038
|
+
|
|
1039
|
+
.ck.ck-button.ai-chat-controls-loader__cancel-button {
|
|
1040
|
+
min-height: 22px;
|
|
1041
|
+
padding: 0 var(--ck-spacing-medium) 0 var(--ck-spacing-small);
|
|
1042
|
+
border: var(--ck-ai-chat-border-width) solid var(--ck-ai-border-color-button);
|
|
1043
|
+
border-radius: var(--ck-border-radius);
|
|
1044
|
+
color: var(--ck-ai-chat-color-text);
|
|
1045
|
+
}
|
|
1046
|
+
|
|
1047
|
+
.ck.ck-button.ai-chat-controls-loader__cancel-button .ck.ck-icon.ck-button__icon {
|
|
1048
|
+
color: var(--ck-ai-chat-color-text);
|
|
1049
|
+
height: 14px;
|
|
1050
|
+
width: 14px;
|
|
1051
|
+
margin-right: 4px;
|
|
1052
|
+
}
|
|
1053
|
+
|
|
1054
|
+
.ck.ck-button.ai-chat-controls-loader__cancel-button:hover {
|
|
1055
|
+
background-color: var(--ck-ai-chat-button-active-background-color);
|
|
1056
|
+
}
|
|
1057
|
+
|
|
1058
|
+
.ck-ai-chat-controls-loader-wrapper {
|
|
1059
|
+
display: flex;
|
|
1060
|
+
justify-content: space-between;
|
|
1061
|
+
}
|
|
1062
|
+
|
|
1063
|
+
@keyframes ck-ai-loader-dot-pulse {
|
|
1064
|
+
0%, 80%, 100% {
|
|
1065
|
+
background-color: var(--ck-ai-chat-loader-icon-dot-color);
|
|
1066
|
+
}
|
|
1067
|
+
|
|
1068
|
+
40% {
|
|
1069
|
+
background-color: var(--ck-ai-chat-loader-icon-dot-active-color);
|
|
1070
|
+
}
|
|
1071
|
+
}
|
|
1072
|
+
|
|
1073
|
+
/*
|
|
1074
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
1075
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
1076
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
1077
|
+
*
|
|
1078
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
1079
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
1080
|
+
*/
|
|
1081
|
+
|
|
1082
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__add-context-balloon-panel {
|
|
1083
|
+
min-width: 157px;
|
|
1084
|
+
max-width: 250px;
|
|
1085
|
+
}
|
|
1086
|
+
|
|
1087
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__add-context-balloon-panel .ck-ai-chat-context-controls__balloon-button {
|
|
1088
|
+
width: 100%;
|
|
1089
|
+
display: flex;
|
|
1090
|
+
padding-left: var(--ck-spacing-extra-large);
|
|
1091
|
+
padding-right: var(--ck-spacing-extra-large);
|
|
1092
|
+
}
|
|
1093
|
+
|
|
1094
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__add-context-balloon-panel .ck-ai-chat-context-controls__balloon-button:first-child {
|
|
1095
|
+
margin-top: var(--ck-spacing-tiny);
|
|
1096
|
+
}
|
|
1097
|
+
|
|
1098
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__add-context-balloon-panel .ck-ai-chat-context-controls__balloon-button:last-child {
|
|
1099
|
+
margin-bottom: var(--ck-spacing-tiny);
|
|
1100
|
+
}
|
|
1101
|
+
|
|
1102
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__add-context-balloon-panel .ck-ai-chat-context-controls__balloon-button .ck-icon.ck-button__icon {
|
|
1103
|
+
--ck-icon-size: 16px;
|
|
1104
|
+
}
|
|
1105
|
+
|
|
1106
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__add-context-balloon-panel .ck-ai-chat-context-controls__balloon-button .ck-button__label {
|
|
1107
|
+
margin: 0;
|
|
1108
|
+
line-height: var(--ck-line-height-base);
|
|
1109
|
+
}
|
|
1110
|
+
|
|
1111
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__add-context-balloon-panel .ck-ai-chat-context-controls__balloon-button:hover {
|
|
1112
|
+
background-color: var(--ck-ai-button-secondary-hover-background-color);
|
|
1113
|
+
}
|
|
1114
|
+
|
|
1115
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__add-context-balloon-panel .ck-ai-chat-context-controls__balloon-button > .ck-ai-chat-context-controls__balloon-button-source__arrow {
|
|
1116
|
+
width: var(--ck-dropdown-arrow-size);
|
|
1117
|
+
|
|
1118
|
+
transform: rotate(-90deg);
|
|
1119
|
+
|
|
1120
|
+
/* A space to accommodate the triangle. */
|
|
1121
|
+
margin-left: var(--ck-spacing-standard);
|
|
1122
|
+
|
|
1123
|
+
/* Nudge the arrow gently to the right because its center of gravity is to the left */
|
|
1124
|
+
margin-right: calc(-1 * var(--ck-spacing-small));
|
|
1125
|
+
}
|
|
1126
|
+
|
|
1127
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__add-context-balloon-panel .ck-ai-chat-context-controls__balloon-button > span {
|
|
1128
|
+
flex-grow: 1;
|
|
1129
|
+
}
|
|
1130
|
+
|
|
1131
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__url-balloon-panel .ck-ai-chat-context-controls__url-form {
|
|
1132
|
+
width: var(--ck-ai-chat-context-controls-balloon-width);
|
|
1133
|
+
line-height: var(--ck-form-header-height);
|
|
1134
|
+
}
|
|
1135
|
+
|
|
1136
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__url-balloon-panel .ck-ai-chat-context-controls__url-form .ck-ai-chat-context-controls__url-input-section {
|
|
1137
|
+
display: flex;
|
|
1138
|
+
align-items: flex-start;
|
|
1139
|
+
padding: var(--ck-spacing-large);
|
|
1140
|
+
}
|
|
1141
|
+
|
|
1142
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__url-balloon-panel .ck-ai-chat-context-controls__url-form .ck-ai-chat-context-controls__url-input-section>.ck-labeled-field-view {
|
|
1143
|
+
width: 100%;
|
|
1144
|
+
}
|
|
1145
|
+
|
|
1146
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__url-balloon-panel .ck-ai-chat-context-controls__url-form .ck-ai-chat-context-controls__url-input-section>.ck-labeled-field-view>.ck.ck-labeled-field-view__input-wrapper>.ck.ck-input {
|
|
1147
|
+
width: 100%;
|
|
1148
|
+
font: normal normal normal var(--ck-font-size-base) / var(--ck-line-height-base) var(--ck-font-face);
|
|
1149
|
+
vertical-align: middle;
|
|
1150
|
+
line-height: var(--ck-line-height-base);
|
|
1151
|
+
}
|
|
1152
|
+
|
|
1153
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__url-balloon-panel .ck-ai-chat-context-controls__url-form .ck-ai-chat-context-controls__url-input-section>.ck-labeled-field-view>.ck.ck-labeled-field-view__input-wrapper>.ck.ck-label {
|
|
1154
|
+
visibility: hidden;
|
|
1155
|
+
}
|
|
1156
|
+
|
|
1157
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__url-balloon-panel .ck-ai-chat-context-controls__url-form .ck-ai-chat-context-controls__url-input-section>.ck.ck-button {
|
|
1158
|
+
height: auto;
|
|
1159
|
+
margin-left: var(--ck-spacing-medium);
|
|
1160
|
+
background-color: var(--ck-ai-background-color-action-button);
|
|
1161
|
+
color: var(--ck-ai-font-color-action-button);
|
|
1162
|
+
}
|
|
1163
|
+
|
|
1164
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__url-balloon-panel .ck-ai-chat-context-controls__url-form .ck-ai-chat-context-controls__url-input-section>.ck.ck-button.ck-disabled {
|
|
1165
|
+
opacity: 0.5;
|
|
1166
|
+
}
|
|
1167
|
+
|
|
1168
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__url-balloon-panel .ck-ai-chat-context-controls__url-form .ck-ai-chat-context-controls__url-input-section>.ck.ck-button.ck-disabled>.ck-button__icon {
|
|
1169
|
+
opacity: 1;
|
|
1170
|
+
}
|
|
1171
|
+
|
|
1172
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel {
|
|
1173
|
+
width: var(--ck-ai-chat-context-controls-balloon-width);
|
|
1174
|
+
height: 319px;
|
|
1175
|
+
}
|
|
1176
|
+
|
|
1177
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel:has(.ck-ai-skeleton:not(.ck-hidden)) {
|
|
1178
|
+
overflow: hidden;
|
|
1179
|
+
}
|
|
1180
|
+
|
|
1181
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck.ck-search__query_with-icon {
|
|
1182
|
+
padding: var(--ck-spacing-large) var(--ck-spacing-large) var(--ck-spacing-tiny) var(--ck-spacing-large);
|
|
1183
|
+
}
|
|
1184
|
+
|
|
1185
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-skeleton {
|
|
1186
|
+
--ck-ai-skeleton-gap: var(--ck-spacing-small);
|
|
1187
|
+
|
|
1188
|
+
padding-top: var(--ck-spacing-standard);
|
|
1189
|
+
padding-bottom: var(--ck-spacing-standard);
|
|
1190
|
+
}
|
|
1191
|
+
|
|
1192
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-chat-resources__list {
|
|
1193
|
+
height: 233px;
|
|
1194
|
+
overflow-y: auto;
|
|
1195
|
+
overflow-x: hidden;
|
|
1196
|
+
}
|
|
1197
|
+
|
|
1198
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-chat-resources__list .ck-ai-chat-resources__item {
|
|
1199
|
+
display: flex;
|
|
1200
|
+
align-items: center;
|
|
1201
|
+
padding: var(--ck-spacing-tiny) var(--ck-spacing-extra-large);
|
|
1202
|
+
border-radius: var(--ck-border-radius);
|
|
1203
|
+
|
|
1204
|
+
cursor: pointer;
|
|
1205
|
+
transition: background-color 0.2s;
|
|
1206
|
+
}
|
|
1207
|
+
|
|
1208
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-chat-resources__list .ck-ai-chat-resources__item:hover {
|
|
1209
|
+
background-color: var(--ck-ai-button-secondary-hover-background-color);
|
|
1210
|
+
}
|
|
1211
|
+
|
|
1212
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-chat-resources__list .ck-ai-chat-resources__item.ck-ai-chat-resources__item--in-context {
|
|
1213
|
+
color: hsla(0, 0%, 20%, 0.5);
|
|
1214
|
+
pointer-events: none;
|
|
1215
|
+
}
|
|
1216
|
+
|
|
1217
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-chat-resources__list .ck-ai-chat-resources__item.ck-ai-chat-resources__item--in-context * {
|
|
1218
|
+
color: inherit;
|
|
1219
|
+
}
|
|
1220
|
+
|
|
1221
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-chat-resources__list .ck-ai-chat-resources__item .ck-ai-chat-resources__item__icon {
|
|
1222
|
+
display: flex;
|
|
1223
|
+
align-items: center;
|
|
1224
|
+
justify-content: center;
|
|
1225
|
+
height: 1.14em;
|
|
1226
|
+
margin-right: 0.35em;
|
|
1227
|
+
flex-shrink: 0;
|
|
1228
|
+
}
|
|
1229
|
+
|
|
1230
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-chat-resources__list .ck-ai-chat-resources__item .ck-ai-chat-resources__item__icon .ck-icon {
|
|
1231
|
+
height: 1.368em;
|
|
1232
|
+
fill: currentColor;
|
|
1233
|
+
}
|
|
1234
|
+
|
|
1235
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-chat-resources__list .ck-ai-chat-resources__item.ck-ai-chat-resources__item--in-context .ck-ai-chat-resources__item__icon {
|
|
1236
|
+
color: hsla(0, 0%, 20%, 0.5);
|
|
1237
|
+
}
|
|
1238
|
+
|
|
1239
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-chat-resources__list .ck-ai-chat-resources__item .ck-ai-chat-resources__item-title {
|
|
1240
|
+
flex: 1;
|
|
1241
|
+
font-size: 1em;
|
|
1242
|
+
line-height: var(--ck-line-height-base);
|
|
1243
|
+
overflow: hidden;
|
|
1244
|
+
text-overflow: ellipsis;
|
|
1245
|
+
white-space: nowrap;
|
|
1246
|
+
}
|
|
1247
|
+
|
|
1248
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__source-balloon-panel .ck-ai-chat-resources__list.ck-hidden {
|
|
1249
|
+
display: none;
|
|
1250
|
+
}
|
|
1251
|
+
|
|
1252
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__chip-tooltip {
|
|
1253
|
+
max-width: 180px;
|
|
1254
|
+
}
|
|
1255
|
+
|
|
1256
|
+
.ck.ck-balloon-panel.ck-ai-chat-context-controls__chip-tooltip .ck.ck-tooltip__text {
|
|
1257
|
+
white-space: normal;
|
|
1258
|
+
display: inline-block;
|
|
1259
|
+
padding: var(--ck-tooltip-text-padding) 0;
|
|
1260
|
+
}
|
|
1261
|
+
|
|
1262
|
+
.ck.ck-ai-chat-controls {
|
|
1263
|
+
padding: var(--ck-spacing-large) var(--ck-spacing-large) var(--ck-spacing-standard);
|
|
1264
|
+
line-height: var(--ck-form-header-height);
|
|
1265
|
+
border-top: var(--ck-ai-chat-border-width) solid var(--ck-color-base-border);
|
|
1266
|
+
|
|
1267
|
+
/* When loader wrapper (second child) is visible, bottom padding should be larger to match the top one. */
|
|
1268
|
+
}
|
|
1269
|
+
|
|
1270
|
+
.ck.ck-ai-chat-controls:has(>:first-child.ck-hidden) {
|
|
1271
|
+
padding-bottom: var(--ck-spacing-large);
|
|
1272
|
+
}
|
|
1273
|
+
|
|
1274
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection {
|
|
1275
|
+
line-height: 0;
|
|
1276
|
+
}
|
|
1277
|
+
|
|
1278
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-dropdown__panel.ck-dropdown__panel_ne {
|
|
1279
|
+
bottom: calc(100% + 10px);
|
|
1280
|
+
top: auto;
|
|
1281
|
+
padding-top: .5em;
|
|
1282
|
+
width: 426px;
|
|
1283
|
+
max-width: max-content;
|
|
1284
|
+
max-height: 600px;
|
|
1285
|
+
overflow-y: scroll;
|
|
1286
|
+
}
|
|
1287
|
+
|
|
1288
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-dropdown__panel.ck-dropdown__panel_ne::before,
|
|
1289
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-dropdown__panel.ck-dropdown__panel_ne::after {
|
|
1290
|
+
content: '';
|
|
1291
|
+
position: absolute;
|
|
1292
|
+
left: calc(2 * var(--ck-balloon-arrow-half-width));
|
|
1293
|
+
bottom: calc(-1 * var(--ck-balloon-arrow-height));
|
|
1294
|
+
width: 0;
|
|
1295
|
+
height: 0;
|
|
1296
|
+
border-style: solid;
|
|
1297
|
+
border-width: var(--ck-balloon-arrow-height) var(--ck-balloon-arrow-half-width) 0 var(--ck-balloon-arrow-half-width);
|
|
1298
|
+
border-color: var(--ck-color-panel-border) transparent transparent;
|
|
1299
|
+
}
|
|
1300
|
+
|
|
1301
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-dropdown__panel.ck-dropdown__panel_ne::before {
|
|
1302
|
+
z-index: var(--ck-balloon-panel-arrow-z-index);
|
|
1303
|
+
margin-bottom: calc(-1 * var(--ck-balloon-border-width));
|
|
1304
|
+
filter: drop-shadow(var(--ck-balloon-arrow-drop-shadow));
|
|
1305
|
+
}
|
|
1306
|
+
|
|
1307
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-dropdown__panel.ck-dropdown__panel_ne::after {
|
|
1308
|
+
z-index: calc(var(--ck-balloon-panel-arrow-z-index) + 1);
|
|
1309
|
+
margin-bottom: calc(var(--ck-balloon-arrow-offset) - var(--ck-balloon-border-width));
|
|
1310
|
+
}
|
|
1311
|
+
|
|
1312
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-button.ck-dropdown__button {
|
|
1313
|
+
border: 0;
|
|
1314
|
+
font-size: .9em;
|
|
1315
|
+
margin-inline-end: 0;
|
|
1316
|
+
color: var(--ck-ai-chat-color-icon);
|
|
1317
|
+
padding-top: 0;
|
|
1318
|
+
padding-bottom: 0;
|
|
1319
|
+
min-height: auto;
|
|
1320
|
+
}
|
|
1321
|
+
|
|
1322
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-button.ck-dropdown__button.ck-on .ck-dropdown__arrow {
|
|
1323
|
+
transform: rotate(180deg);
|
|
1324
|
+
}
|
|
1325
|
+
|
|
1326
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-button.ck-dropdown__button .ck-button__label {
|
|
1327
|
+
width: auto;
|
|
1328
|
+
}
|
|
1329
|
+
|
|
1330
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-button.ck-dropdown__button:hover,
|
|
1331
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-button.ck-dropdown__button.ck-on {
|
|
1332
|
+
background-color: var(--ck-ai-chat-button-active-background-color);
|
|
1333
|
+
color: var(--ck-ai-background-color-action-button);
|
|
1334
|
+
}
|
|
1335
|
+
|
|
1336
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-button.ck-dropdown__button:hover .ck-dropdown__arrow, .ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-button.ck-dropdown__button.ck-on .ck-dropdown__arrow {
|
|
1337
|
+
color: var(--ck-ai-background-color-action-button);
|
|
1338
|
+
}
|
|
1339
|
+
|
|
1340
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item:not(:last-child) {
|
|
1341
|
+
margin-bottom: var(--ck-spacing-medium-small);
|
|
1342
|
+
}
|
|
1343
|
+
|
|
1344
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button {
|
|
1345
|
+
align-items: start;
|
|
1346
|
+
}
|
|
1347
|
+
|
|
1348
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button > .ck-list-item-button__check-holder {
|
|
1349
|
+
height: 1.2em;
|
|
1350
|
+
}
|
|
1351
|
+
|
|
1352
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button > .ck-list-item-button__check-holder > .ck-list-item-button__check-icon {
|
|
1353
|
+
padding-top: 2px;
|
|
1354
|
+
}
|
|
1355
|
+
|
|
1356
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button > .ck-button__label {
|
|
1357
|
+
line-height: 1.3;
|
|
1358
|
+
}
|
|
1359
|
+
|
|
1360
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button > .ck-button__label > .ck-ai-chat-controls__model-selection__item-name {
|
|
1361
|
+
line-height: 1.3;
|
|
1362
|
+
font-weight: 500;
|
|
1363
|
+
}
|
|
1364
|
+
|
|
1365
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button > .ck-button__label > .ck-ai-chat-controls__model-selection__item-description {
|
|
1366
|
+
line-height: 1.3;
|
|
1367
|
+
padding-top: var(--ck-spacing-tiny);
|
|
1368
|
+
}
|
|
1369
|
+
|
|
1370
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button > .ck-button__label > .ck-ai-chat-controls__model-selection__item-description > span {
|
|
1371
|
+
color: var(--ck-ai-chat-color-icon);
|
|
1372
|
+
line-height: 1;
|
|
1373
|
+
white-space: normal;
|
|
1374
|
+
}
|
|
1375
|
+
|
|
1376
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button > .ck-button__label > .ck-ai-chat-controls__model-selection__item-capabilities {
|
|
1377
|
+
line-height: 1.3;
|
|
1378
|
+
--ck-icon-font-size: .5em;
|
|
1379
|
+
}
|
|
1380
|
+
|
|
1381
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button > .ck-button__label > .ck-ai-chat-controls__model-selection__item-capabilities > span {
|
|
1382
|
+
color: var(--ck-ai-chat-color-icon);
|
|
1383
|
+
}
|
|
1384
|
+
|
|
1385
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button > .ck-button__label > .ck-ai-chat-controls__model-selection__item-capabilities > span:nth-of-type(2n) {
|
|
1386
|
+
font-weight: bold;
|
|
1387
|
+
display: inline-block;
|
|
1388
|
+
width: 4ch;
|
|
1389
|
+
}
|
|
1390
|
+
|
|
1391
|
+
.ck.ck-ai-chat-controls .ck-ai-chat-controls__model-selection .ck-list > .ck-list__item > .ck-button > .ck-button__label > .ck-ai-chat-controls__model-selection__item-capabilities > .ck-icon {
|
|
1392
|
+
margin-inline-end: var(--ck-spacing-standard);
|
|
1393
|
+
color: var(--ck-ai-chat-color-icon);
|
|
1394
|
+
fill: var(--ck-ai-chat-color-icon);
|
|
1395
|
+
}
|
|
1396
|
+
/*
|
|
1397
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
1398
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
1399
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
1400
|
+
*
|
|
1401
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
1402
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
1403
|
+
*/
|
|
1404
|
+
/*
|
|
1405
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
1406
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
1407
|
+
*/
|
|
1408
|
+
/**
|
|
1409
|
+
* Implements rounded corner interface for .ck-rounded-corners class.
|
|
1410
|
+
*
|
|
1411
|
+
* @see $ck-border-radius
|
|
1412
|
+
*/
|
|
1413
|
+
:root {
|
|
1414
|
+
--ck-ai-chat-feed-item-color-text: hsla(0, 0%, 0%, 1);
|
|
1415
|
+
--ck-ai-chat-feed-item-color-background: hsla(0, 0%, 96%, 1);
|
|
1416
|
+
--ck-ai-chat-feed-item-color-background-secondary: hsla(0, 0%, 96%, 1);
|
|
1417
|
+
--ck-ai-chat-feed-item-color-actions-button-hover: hsla(263, 59%, 40%, 1);
|
|
1418
|
+
--ck-ai-chat-feed-item-color-show-changes-toggle-hover-color: hsla(263, 59%, 40%, 1);
|
|
1419
|
+
--ck-ai-chat-feed-item-color-show-changes-toggle-hover-background: hsl(262, 100%, 96%);
|
|
1420
|
+
--ck-ai-chat-feed-item-color-show-changes-toggle-on-color: hsla(263, 59%, 40%, 1);
|
|
1421
|
+
--ck-ai-chat-feed-item-color-show-changes-toggle-on-background: hsl(262, 100%, 96%);
|
|
1422
|
+
--ck-ai-chat-feed-item-color-show-changes-toggle-active-background: hsl(262, 100%, 96%);
|
|
1423
|
+
--ck-ai-chat-feed-loader-icon-color: hsla(0, 0%, 85%, 1);
|
|
1424
|
+
--ck-ai-chat-feed-interaction-header-capabilities-color-text: hsla(0, 0%, 44%, 1);
|
|
1425
|
+
}
|
|
1426
|
+
.ck.ck-ai-chat__feed {
|
|
1427
|
+
flex: 1 1 auto;
|
|
1428
|
+
overflow-y: auto;
|
|
1429
|
+
display: flex;
|
|
1430
|
+
flex-direction: column;
|
|
1431
|
+
justify-content: flex-start;
|
|
1432
|
+
align-items: stretch;
|
|
1433
|
+
flex-wrap: nowrap;
|
|
1434
|
+
padding-bottom: var(--ck-spacing-extra-large);
|
|
1435
|
+
gap: var(--ck-spacing-large);
|
|
1436
|
+
position: relative;
|
|
1437
|
+
|
|
1438
|
+
/* This is needed to prevent the feed from overflowing when the skeleton is visible. */
|
|
1439
|
+
}
|
|
1440
|
+
.ck.ck-ai-chat__feed:has(.ck-ai-skeleton:not(.ck-hidden)) {
|
|
1441
|
+
overflow: hidden;
|
|
1442
|
+
}
|
|
1443
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__items {
|
|
1444
|
+
display: flex;
|
|
1445
|
+
flex-direction: column;
|
|
1446
|
+
gap: var(--ck-spacing-extra-large) 0;
|
|
1447
|
+
}
|
|
1448
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__items > .ck-ai-chat__feed__item:first-child {
|
|
1449
|
+
margin-top: var(--ck-spacing-extra-large);
|
|
1450
|
+
}
|
|
1451
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item {
|
|
1452
|
+
margin: 0 var(--ck-spacing-large);
|
|
1453
|
+
scroll-margin: var(--ck-spacing-large);
|
|
1454
|
+
|
|
1455
|
+
/* These controls show up only after the item is done */
|
|
1456
|
+
}
|
|
1457
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-mini-toolbar,
|
|
1458
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-chat__feed__ai-suggestion__actions,
|
|
1459
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-suggestion__header__show-changes-toggle {
|
|
1460
|
+
transition: opacity .4s, display .4s allow-discrete;
|
|
1461
|
+
}
|
|
1462
|
+
@starting-style {
|
|
1463
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-mini-toolbar, .ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-chat__feed__ai-suggestion__actions, .ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-suggestion__header__show-changes-toggle {
|
|
1464
|
+
opacity: 0;
|
|
1465
|
+
}
|
|
1466
|
+
}
|
|
1467
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-suggestion__header__show-changes-toggle {
|
|
1468
|
+
--ck-color-button-default-hover-background: var(--ck-ai-chat-feed-item-color-show-changes-toggle-hover-background);
|
|
1469
|
+
--ck-color-button-on-hover-background: var(--ck-ai-chat-feed-item-color-show-changes-toggle-hover-background);
|
|
1470
|
+
--ck-color-button-default-active-background: var(--ck-ai-chat-feed-item-color-show-changes-toggle-active-background);
|
|
1471
|
+
--ck-color-button-on-background: var(--ck-ai-chat-feed-item-color-show-changes-toggle-active-background);
|
|
1472
|
+
--ck-color-focus-border: var(--ck-ai-chat-feed-item-color-show-changes-toggle-active-background);
|
|
1473
|
+
--ck-focus-ring: 1px solid var(--ck-color-focus-border);
|
|
1474
|
+
|
|
1475
|
+
padding: 0 var(--ck-spacing-small);
|
|
1476
|
+
min-height: 22px;
|
|
1477
|
+
font-size: var(--ck-ai-chat-suggestion-container-header-font-size);
|
|
1478
|
+
color: var(--ck-ai-chat-color-icon);
|
|
1479
|
+
}
|
|
1480
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-suggestion__header__show-changes-toggle:hover {
|
|
1481
|
+
color: var(--ck-ai-chat-feed-item-color-show-changes-toggle-hover-color);
|
|
1482
|
+
}
|
|
1483
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-suggestion__header__show-changes-toggle:active {
|
|
1484
|
+
box-shadow: none;
|
|
1485
|
+
color: var(--ck-ai-chat-feed-item-color-show-changes-toggle-on-color);
|
|
1486
|
+
}
|
|
1487
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-suggestion__header__show-changes-toggle.ck-on {
|
|
1488
|
+
color: var(--ck-ai-chat-feed-item-color-show-changes-toggle-on-color);
|
|
1489
|
+
}
|
|
1490
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-suggestion__header__show-changes-toggle:focus {
|
|
1491
|
+
border: 1px solid transparent;
|
|
1492
|
+
}
|
|
1493
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-suggestion__header__show-changes-toggle > .ck-icon {
|
|
1494
|
+
width: 16px;
|
|
1495
|
+
height: 16px;
|
|
1496
|
+
margin-right: 0;
|
|
1497
|
+
margin-left: var(--ck-spacing-medium);
|
|
1498
|
+
}
|
|
1499
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item:not(.ck-ai-chat__feed__item_done) .ck-ai-mini-toolbar,
|
|
1500
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item:not(.ck-ai-chat__feed__item_done) .ck-ai-chat__feed__ai-suggestion__actions,
|
|
1501
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item:not(.ck-ai-chat__feed__item_done) .ck-ai-suggestion__header__show-changes-toggle {
|
|
1502
|
+
display: none;
|
|
1503
|
+
opacity: 0;
|
|
1504
|
+
}
|
|
1505
|
+
/*
|
|
1506
|
+
* Any item that contains text (AI replies, suggestions, user messages etc.)
|
|
1507
|
+
*/
|
|
1508
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__text-item {
|
|
1509
|
+
word-break: normal;
|
|
1510
|
+
text-wrap: auto;
|
|
1511
|
+
}
|
|
1512
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__text-item pre > code {
|
|
1513
|
+
white-space: pre-wrap;
|
|
1514
|
+
}
|
|
1515
|
+
/*
|
|
1516
|
+
* User message item with a query to the AI
|
|
1517
|
+
*/
|
|
1518
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__user-message:has(.ck-ai-chat-context-chips-wrapper) {
|
|
1519
|
+
max-width: 100%;
|
|
1520
|
+
}
|
|
1521
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__user-message .ck-ai-chat__feed__message-content {
|
|
1522
|
+
max-width: 80%;
|
|
1523
|
+
margin-inline-end: 0;
|
|
1524
|
+
margin-inline-start: auto;
|
|
1525
|
+
text-align: end;
|
|
1526
|
+
}
|
|
1527
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__user-message p {
|
|
1528
|
+
display: inline-block;
|
|
1529
|
+
background-color: var(--ck-ai-chat-feed-item-color-background-secondary);
|
|
1530
|
+
padding: 8px;
|
|
1531
|
+
border-radius: var(--ck-ai-border-radius);
|
|
1532
|
+
}
|
|
1533
|
+
/*
|
|
1534
|
+
* Replies from the AI that aren't suggestions.
|
|
1535
|
+
*
|
|
1536
|
+
* Also, occasionally used for static notifications.
|
|
1537
|
+
*/
|
|
1538
|
+
/* &.ck-ai-chat__feed__ai-reply {} */
|
|
1539
|
+
/*
|
|
1540
|
+
* This is the kind of reply from the AI where content changes are suggested.
|
|
1541
|
+
*/
|
|
1542
|
+
/*
|
|
1543
|
+
* Actions for the suggestion.
|
|
1544
|
+
*/
|
|
1545
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck-ai-chat__feed__ai-suggestion .ck-ai-chat__feed__ai-suggestion__actions {
|
|
1546
|
+
--ck-color-split-button-hover-background: var(--ck-ai-background-color-action-button);
|
|
1547
|
+
|
|
1548
|
+
margin-top: var(--ck-spacing-medium);
|
|
1549
|
+
width: fit-content;
|
|
1550
|
+
}
|
|
1551
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck-ai-chat__feed__ai-suggestion .ck-ai-chat__feed__ai-suggestion__actions > .ck-button {
|
|
1552
|
+
--ck-color-button-default-background: var(--ck-ai-background-color-action-button);
|
|
1553
|
+
--ck-color-button-default-hover-background: var(--ck-ai-chat-feed-item-color-actions-button-hover);
|
|
1554
|
+
--ck-color-button-on-hover-background: var(--ck-ai-chat-feed-item-color-actions-button-hover);
|
|
1555
|
+
--ck-color-button-default-active-background: var(--ck-ai-chat-feed-item-color-actions-button-hover);
|
|
1556
|
+
--ck-color-button-on-background: var(--ck-ai-chat-feed-item-color-actions-button-hover);
|
|
1557
|
+
--ck-color-button-on-active-background: var(--ck-ai-chat-feed-item-color-actions-button-hover);
|
|
1558
|
+
--ck-color-focus-border: var(--ck-color-base-background);
|
|
1559
|
+
--ck-focus-ring: 1px solid var(--ck-color-focus-border);
|
|
1560
|
+
|
|
1561
|
+
color: var(--ck-color-base-background);
|
|
1562
|
+
}
|
|
1563
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck-ai-chat__feed__ai-suggestion .ck-ai-chat__feed__ai-suggestion__actions > .ck-button.ck-splitbutton__action {
|
|
1564
|
+
border-radius: 0;
|
|
1565
|
+
}
|
|
1566
|
+
.ck-rounded-corners .ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck-ai-chat__feed__ai-suggestion .ck-ai-chat__feed__ai-suggestion__actions > .ck-button.ck-splitbutton__action,
|
|
1567
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck-ai-chat__feed__ai-suggestion .ck-ai-chat__feed__ai-suggestion__actions > .ck-button.ck-splitbutton__action.ck-rounded-corners {
|
|
1568
|
+
border-radius: var(--ck-border-radius);
|
|
1569
|
+
border-top-right-radius: 0;
|
|
1570
|
+
border-bottom-right-radius: 0;
|
|
1571
|
+
}
|
|
1572
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck-ai-chat__feed__ai-suggestion .ck-ai-chat__feed__ai-suggestion__actions > .ck-button.ck-splitbutton__arrow {
|
|
1573
|
+
width: 1.9em;
|
|
1574
|
+
color: var(--ck-color-base-background);
|
|
1575
|
+
|
|
1576
|
+
/* Separator always visible */
|
|
1577
|
+
}
|
|
1578
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck-ai-chat__feed__ai-suggestion .ck-ai-chat__feed__ai-suggestion__actions > .ck-button.ck-splitbutton__arrow:after {
|
|
1579
|
+
content: '';
|
|
1580
|
+
position: absolute;
|
|
1581
|
+
width: 1px;
|
|
1582
|
+
height: 100%;
|
|
1583
|
+
left: -1px;
|
|
1584
|
+
background: var(--ck-color-base-background);
|
|
1585
|
+
}
|
|
1586
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck-ai-chat__feed__ai-suggestion .ck-ai-chat__feed__ai-suggestion__actions > .ck-button.ck-disabled {
|
|
1587
|
+
background: hsl(263, 59%, 52%, 0.5);
|
|
1588
|
+
}
|
|
1589
|
+
/*
|
|
1590
|
+
* Interaction header showing capabilities used for the entire interaction.
|
|
1591
|
+
*/
|
|
1592
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__interaction-header .ck-ai-chat__feed__interaction-header__capabilities {
|
|
1593
|
+
display: flex;
|
|
1594
|
+
align-items: center;
|
|
1595
|
+
gap: 4px;
|
|
1596
|
+
color: var(--ck-ai-chat-feed-interaction-header-capabilities-color-text);
|
|
1597
|
+
}
|
|
1598
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__interaction-header .ck-ai-chat__feed__interaction-header__capabilities svg {
|
|
1599
|
+
border-radius: 50%;
|
|
1600
|
+
flex-shrink: 0;
|
|
1601
|
+
background-color: var(--ck-tabs-panels-container-background);
|
|
1602
|
+
}
|
|
1603
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__interaction-header .ck-ai-chat__feed__interaction-header__capabilities svg:not(:first-child) {
|
|
1604
|
+
margin-left: calc(var(--ck-icon-size) * -0.75)
|
|
1605
|
+
}
|
|
1606
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__interaction-header .ck-ai-chat__feed__interaction-header__capabilities__text {
|
|
1607
|
+
color: var(--ck-ai-chat-feed-interaction-header-capabilities-color-text);
|
|
1608
|
+
font-weight: 500;
|
|
1609
|
+
}
|
|
1610
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-chat__feed__ai-reply-container > *:first-child {
|
|
1611
|
+
/* This is needed to clear the default top margin from first HTML element from reply. */
|
|
1612
|
+
margin-top: 0;
|
|
1613
|
+
}
|
|
1614
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-chat__feed__ai-reply-container > *:last-child {
|
|
1615
|
+
/* This is needed to clear the default bottom margin from last HTML element from reply. */
|
|
1616
|
+
margin-bottom: 0;
|
|
1617
|
+
}
|
|
1618
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__ai-suggestion .ck-ai-suggestion__body *,
|
|
1619
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item.ck.ck-ai-chat__feed__text-item
|
|
1620
|
+
*:not(.ck-ai-chat__feed__context-chips):not(.ck-ai-chat__feed__context-chips *):not(.ck-ai-web-source .ck-button__label) {
|
|
1621
|
+
white-space: normal;
|
|
1622
|
+
line-height: 1.4em;
|
|
1623
|
+
}
|
|
1624
|
+
/* TODO: This CSS class is added twice. */
|
|
1625
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-chat__feed__context-chips {
|
|
1626
|
+
display: flex;
|
|
1627
|
+
justify-content: flex-end;
|
|
1628
|
+
margin-bottom: var(--ck-spacing-medium-small);
|
|
1629
|
+
}
|
|
1630
|
+
/* stylelint-disable-next-line no-descending-specificity */
|
|
1631
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-web-sources {
|
|
1632
|
+
display: grid;
|
|
1633
|
+
grid-template-columns: repeat(3, 1fr);
|
|
1634
|
+
gap: var(--ck-spacing-standard);
|
|
1635
|
+
|
|
1636
|
+
padding: var(--ck-spacing-medium-small) var(--ck-spacing-large) var(--ck-spacing-extra-large) var(--ck-spacing-large);
|
|
1637
|
+
}
|
|
1638
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-web-sources > .ck-ai-web-sources__header {
|
|
1639
|
+
grid-column-start: span 3;
|
|
1640
|
+
|
|
1641
|
+
font-size: 12px;
|
|
1642
|
+
font-weight: 500;
|
|
1643
|
+
line-height: 1.4em;
|
|
1644
|
+
}
|
|
1645
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-web-sources > .ck-ai-web-sources__header > .ck-icon {
|
|
1646
|
+
vertical-align: text-bottom;
|
|
1647
|
+
width: 14px;
|
|
1648
|
+
height: 14px;
|
|
1649
|
+
margin-right: var(--ck-spacing-medium-small);
|
|
1650
|
+
color: hsl(0, 0%, 44%);
|
|
1651
|
+
}
|
|
1652
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-web-sources > .ck-ai-web-sources__header > span {
|
|
1653
|
+
color: hsl(0, 0%, 44%);
|
|
1654
|
+
}
|
|
1655
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-web-sources > .ck-ai-web-source {
|
|
1656
|
+
padding: var(--ck-spacing-medium) var(--ck-spacing-large);
|
|
1657
|
+
border: 0;
|
|
1658
|
+
border-radius: 50px;
|
|
1659
|
+
background-color: var(--ck-ai-chat-feed-item-color-background);
|
|
1660
|
+
}
|
|
1661
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-web-sources > .ck-ai-web-source:focus, .ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-web-sources > .ck-ai-web-source:active {
|
|
1662
|
+
box-shadow: none;
|
|
1663
|
+
}
|
|
1664
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-web-sources > .ck-ai-web-source .ck-button__icon {
|
|
1665
|
+
margin-right: var(--ck-spacing-medium);
|
|
1666
|
+
color: var(--ck-ai-button-primary-background-color);
|
|
1667
|
+
width: 16px;
|
|
1668
|
+
height: 16px;
|
|
1669
|
+
}
|
|
1670
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-web-sources > .ck-ai-web-source .ck-button__label {
|
|
1671
|
+
/* display: inline-block; */
|
|
1672
|
+
white-space: nowrap;
|
|
1673
|
+
overflow: hidden;
|
|
1674
|
+
text-overflow: ellipsis;
|
|
1675
|
+
max-width: 80px;
|
|
1676
|
+
font-size: 10px;
|
|
1677
|
+
font-weight: 700;
|
|
1678
|
+
line-height: 1.4em;
|
|
1679
|
+
}
|
|
1680
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item .ck-ai-web-sources > .ck-ai-web-source .ck-ai-web-source__title {
|
|
1681
|
+
display: flex;
|
|
1682
|
+
align-items: center;
|
|
1683
|
+
gap: var(--ck-spacing-small);
|
|
1684
|
+
}
|
|
1685
|
+
/* Remove padding if it's directly inside the reply container as the padding is already set. */
|
|
1686
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__feed__item > .ck-ai-web-sources {
|
|
1687
|
+
padding: var(--ck-spacing-extra-large) 0 var(--ck-spacing-medium) 0;
|
|
1688
|
+
}
|
|
1689
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__loader {
|
|
1690
|
+
display: flex;
|
|
1691
|
+
align-items: flex-start;
|
|
1692
|
+
}
|
|
1693
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__loader .ck.ck-spinner-container.ck-ai-spinner {
|
|
1694
|
+
/* Designs have 16px but it needs to be aligned with chat feed items */
|
|
1695
|
+
margin: 0 var(--ck-spacing-large);
|
|
1696
|
+
}
|
|
1697
|
+
.ck.ck-ai-chat__feed .ck.ck-ai-chat__loader .ck.ck-ai-chat__loader-text {
|
|
1698
|
+
font-weight: 500;
|
|
1699
|
+
line-height: 1.462em;
|
|
1700
|
+
white-space: normal;
|
|
1701
|
+
}
|
|
1702
|
+
/**
|
|
1703
|
+
* This is the balloon panel for the suggestion actions.
|
|
1704
|
+
*/
|
|
1705
|
+
.ck-ai-chat__feed__ai-suggestion__actions__balloon .ck-button.ck-list-item-button {
|
|
1706
|
+
padding-top: 0;
|
|
1707
|
+
padding-bottom: 0;
|
|
1708
|
+
}
|
|
1709
|
+
@keyframes ck-html-streamer-fade-in {
|
|
1710
|
+
from {
|
|
1711
|
+
opacity: 0;
|
|
1712
|
+
}
|
|
1713
|
+
|
|
1714
|
+
to {
|
|
1715
|
+
opacity: 1;
|
|
1716
|
+
}
|
|
1717
|
+
}
|
|
1718
|
+
/*
|
|
1719
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
1720
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
1721
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
1722
|
+
*
|
|
1723
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
1724
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
1725
|
+
*/
|
|
1726
|
+
/*
|
|
1727
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
1728
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
1729
|
+
*/
|
|
1730
|
+
/**
|
|
1731
|
+
* Implements rounded corner interface for .ck-rounded-corners class.
|
|
1732
|
+
*
|
|
1733
|
+
* @see $ck-border-radius
|
|
1734
|
+
*/
|
|
1735
|
+
:root {
|
|
1736
|
+
--ck-ai-chat-suggestion-container-header-font-size: .9em;
|
|
1737
|
+
--ck-ai-background-color-action-button-semi-transparent: hsla(263, 59%, 52%, 0.5);
|
|
1738
|
+
}
|
|
1739
|
+
/*
|
|
1740
|
+
* Container for the suggestion where the content returned by the AI is displayed.
|
|
1741
|
+
*
|
|
1742
|
+
* It supports the regular output and "Show preview" mode.
|
|
1743
|
+
*
|
|
1744
|
+
* It works in the feed (sidebar) and in the dialog/balloon.
|
|
1745
|
+
*/
|
|
1746
|
+
.ck.ck-ai-suggestion__container {
|
|
1747
|
+
border-radius: 0;
|
|
1748
|
+
|
|
1749
|
+
--ck-border-radius: 4px;
|
|
1750
|
+
|
|
1751
|
+
border: 1px solid var(--ck-color-base-border);
|
|
1752
|
+
position: relative;
|
|
1753
|
+
}
|
|
1754
|
+
.ck-rounded-corners .ck.ck-ai-suggestion__container,
|
|
1755
|
+
.ck.ck-ai-suggestion__container.ck-rounded-corners {
|
|
1756
|
+
border-radius: var(--ck-border-radius);
|
|
1757
|
+
}
|
|
1758
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__header {
|
|
1759
|
+
height: 3.23em; /* 42px */
|
|
1760
|
+
border-bottom: 1px solid var(--ck-color-base-border);
|
|
1761
|
+
display: flex;
|
|
1762
|
+
flex-direction: row;
|
|
1763
|
+
justify-content: space-between;
|
|
1764
|
+
align-items: center;
|
|
1765
|
+
padding: 0 var(--ck-spacing-large);
|
|
1766
|
+
}
|
|
1767
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__header > span {
|
|
1768
|
+
font-size: var(--ck-ai-chat-suggestion-container-header-font-size);
|
|
1769
|
+
font-weight: bold;
|
|
1770
|
+
color: var(--ck-ai-chat-color-icon);
|
|
1771
|
+
flex-grow: 1;
|
|
1772
|
+
}
|
|
1773
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__header > .ck-icon {
|
|
1774
|
+
width: 14px;
|
|
1775
|
+
height: 14px;
|
|
1776
|
+
margin-right: var(--ck-spacing-medium);
|
|
1777
|
+
color: var(--ck-ai-chat-color-icon);
|
|
1778
|
+
}
|
|
1779
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__header > .ck-switchbutton {
|
|
1780
|
+
--ck-switch-button-toggle-width: 2.307em;
|
|
1781
|
+
--ck-switch-button-toggle-inner-size: 1em;
|
|
1782
|
+
--ck-switch-button-translation: calc(var(--ck-switch-button-toggle-width) - var(--ck-switch-button-toggle-inner-size) - 2px );
|
|
1783
|
+
--ck-color-switch-button-off-background: var(--ck-ai-chat-color-icon);
|
|
1784
|
+
}
|
|
1785
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__header > .ck-switchbutton .ck-button__label {
|
|
1786
|
+
font-size: var(--ck-ai-chat-suggestion-container-header-font-size);
|
|
1787
|
+
margin-right: var(--ck-spacing-standard);
|
|
1788
|
+
}
|
|
1789
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__header > .ck-switchbutton .ck-button__toggle {
|
|
1790
|
+
border-radius: var(--ck-switch-button-toggle-inner-size);
|
|
1791
|
+
}
|
|
1792
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__header > .ck-switchbutton .ck-button__toggle .ck-button__toggle__inner {
|
|
1793
|
+
border-radius: 100%;
|
|
1794
|
+
}
|
|
1795
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body {
|
|
1796
|
+
display: flex;
|
|
1797
|
+
flex-direction: column;
|
|
1798
|
+
}
|
|
1799
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-parts {
|
|
1800
|
+
display: flex;
|
|
1801
|
+
flex-direction: column;
|
|
1802
|
+
}
|
|
1803
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part {
|
|
1804
|
+
position: relative;
|
|
1805
|
+
padding-bottom: var(--ck-spacing-large);
|
|
1806
|
+
}
|
|
1807
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part .ck-ai-suggestion__body__content-part__title {
|
|
1808
|
+
display: flex;
|
|
1809
|
+
justify-content: space-between;
|
|
1810
|
+
align-items: center;
|
|
1811
|
+
color: var(--ck-ai-background-color-action-button);
|
|
1812
|
+
height: 2.308em;
|
|
1813
|
+
}
|
|
1814
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part .ck-ai-suggestion__body__content-part__title > .ck-ai-suggestion__body__content-part__icon-title {
|
|
1815
|
+
position: absolute;
|
|
1816
|
+
left: calc(-1.8 * var(--ck-spacing-large));
|
|
1817
|
+
background: var(--ck-color-base-background);
|
|
1818
|
+
box-shadow: 0 0 5px 6px var(--ck-color-base-background);
|
|
1819
|
+
clip-path: inset(-6px 0 -6px 0);
|
|
1820
|
+
border-radius: 100%;
|
|
1821
|
+
}
|
|
1822
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part .ck-ai-suggestion__body__content-part__title > .ck-ai-suggestion__body__content-part__icon-accepted {
|
|
1823
|
+
color: var(--ck-color-base-action);
|
|
1824
|
+
}
|
|
1825
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part .ck-ai-suggestion__body__content-part__title > .ck-ai-suggestion__body__content-part__icon-rejected {
|
|
1826
|
+
color: var(--ck-color-base-error);
|
|
1827
|
+
}
|
|
1828
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part .ck-ai-suggestion__body__content-part__title > .ck-icon,
|
|
1829
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part .ck-ai-suggestion__body__content-part__title > .ck-toolbar .ck-icon {
|
|
1830
|
+
--ck-icon-size: 1.477em;
|
|
1831
|
+
}
|
|
1832
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part .ck-ai-suggestion__body__content-part__title .ck-toolbar {
|
|
1833
|
+
border: 0;
|
|
1834
|
+
}
|
|
1835
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part .ck-ai-suggestion__body__content-part__title .ck-toolbar .ck-button {
|
|
1836
|
+
margin: 0;
|
|
1837
|
+
opacity: .6;
|
|
1838
|
+
}
|
|
1839
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part .ck-ai-suggestion__body__content-part__content :last-child {
|
|
1840
|
+
padding-bottom: 0;
|
|
1841
|
+
margin-bottom: var(--ck-spacing-medium);
|
|
1842
|
+
}
|
|
1843
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part:hover .ck-ai-suggestion__body__content-part__title .ck-toolbar {
|
|
1844
|
+
visibility: visible;
|
|
1845
|
+
opacity: 1;
|
|
1846
|
+
}
|
|
1847
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part:not(:last-child)::after {
|
|
1848
|
+
content: '...';
|
|
1849
|
+
width: 100%;
|
|
1850
|
+
text-align: center;
|
|
1851
|
+
display: block;
|
|
1852
|
+
clear: both;
|
|
1853
|
+
}
|
|
1854
|
+
/* TODO: This is only a temporary implementation for preview demo purposes. Make it nice. */
|
|
1855
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_active:hover::before {
|
|
1856
|
+
content: '';
|
|
1857
|
+
position: absolute;
|
|
1858
|
+
left: calc((-1 * var(--ck-spacing-large)) - 1px);
|
|
1859
|
+
top: 5px;
|
|
1860
|
+
height: 100%;
|
|
1861
|
+
border-left: 2px solid hsl( 262, 51%, 80% );
|
|
1862
|
+
}
|
|
1863
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_active:last-child::before {
|
|
1864
|
+
height: calc(100% - 10px);
|
|
1865
|
+
}
|
|
1866
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_active:last-child:first-child::before {
|
|
1867
|
+
display: none;
|
|
1868
|
+
}
|
|
1869
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_accepted .ck-ai-suggestion__body__content-part__content, .ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_rejected .ck-ai-suggestion__body__content-part__content {
|
|
1870
|
+
opacity: 0.5;
|
|
1871
|
+
}
|
|
1872
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_accepted .ck-ai-suggestion__body__content-part__title
|
|
1873
|
+
:not(.ck-ai-suggestion__body__content-part__icon-title):not(.ck-ai-suggestion__body__content-part__icon-title *), .ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_rejected .ck-ai-suggestion__body__content-part__title
|
|
1874
|
+
:not(.ck-ai-suggestion__body__content-part__icon-title):not(.ck-ai-suggestion__body__content-part__icon-title *) {
|
|
1875
|
+
opacity: 0.5;
|
|
1876
|
+
}
|
|
1877
|
+
/* stylelint-disable no-descending-specificity */
|
|
1878
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_accepted .ck-ai-suggestion__body__content-part__icon-title, .ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_rejected .ck-ai-suggestion__body__content-part__icon-title {
|
|
1879
|
+
/* Icon can not be transparent because the border would be visible, it has to be controlled by the color. */
|
|
1880
|
+
color: var(--ck-ai-background-color-action-button-semi-transparent);
|
|
1881
|
+
}
|
|
1882
|
+
/* stylelint-enable no-descending-specificity */
|
|
1883
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_accepted::after, .ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck-ai-suggestion__body__content-part_rejected::after {
|
|
1884
|
+
opacity: 0.5;
|
|
1885
|
+
}
|
|
1886
|
+
/* The warning is displayed when some parts of the suggestion are empty. */
|
|
1887
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body .ck.ck-ai-chat__feed__item.ck-ai-chat-error_warning {
|
|
1888
|
+
margin-left: 0;
|
|
1889
|
+
margin-right: 0;
|
|
1890
|
+
margin-bottom: var(--ck-spacing-large);
|
|
1891
|
+
}
|
|
1892
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__body,
|
|
1893
|
+
.ck.ck-ai-suggestion__container .ck-ai-suggestion__changes {
|
|
1894
|
+
padding: var(--ck-spacing-large);
|
|
1895
|
+
padding-bottom: 0px;
|
|
1896
|
+
}
|
|
1897
|
+
/*
|
|
1898
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
1899
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
1900
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
1901
|
+
*
|
|
1902
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
1903
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
1904
|
+
*/
|
|
1905
|
+
.ck.ck-ai-mini-toolbar {
|
|
1906
|
+
--ck-color-button-action-background: hsl(263.2, 59.2%, 52%);
|
|
1907
|
+
--ck-color-button-default-hover-background: hsl(262.1, 100%, 96.3%);
|
|
1908
|
+
--ck-color-button-default-active-background: hsl(262.1, 100%, 96.3%);
|
|
1909
|
+
--ck-color-button-on-background: hsl(262.1, 100%, 96.3%);
|
|
1910
|
+
--ck-color-button-on-hover-background: hsl(262.1, 100%, 96.3%);
|
|
1911
|
+
--ck-color-button-on-active-background: hsl(262.1, 100%, 96.3%);
|
|
1912
|
+
--ck-color-button-on-disabled-background: hsl(262.1, 100%, 96.3%);
|
|
1913
|
+
--ck-color-button-on-color: hsl(263.2, 59.2%, 52%);
|
|
1914
|
+
--ck-color-button-action-hover-background: hsl(262.6, 58.9%, 49.6%);
|
|
1915
|
+
--ck-color-button-action-active-background: hsl(262.6, 58.9%, 49.6%);
|
|
1916
|
+
--ck-color-button-action-disabled-background: hsl(263.8, 59.3%, 75.9%);
|
|
1917
|
+
|
|
1918
|
+
position: absolute;
|
|
1919
|
+
right: var(--ck-spacing-large);
|
|
1920
|
+
bottom: 0;
|
|
1921
|
+
transform: translateY(50%);
|
|
1922
|
+
}
|
|
1923
|
+
.ck.ck-ai-mini-toolbar .ck.ck-button {
|
|
1924
|
+
font-size: .9em;
|
|
1925
|
+
font-family: var(--ck-ai-chat-font-family);
|
|
1926
|
+
color: var(--ck-ai-chat-color-icon);
|
|
1927
|
+
}
|
|
1928
|
+
.ck.ck-ai-mini-toolbar .ck.ck-button.ck-on {
|
|
1929
|
+
color: var(--ck-ai-background-color-action-button);
|
|
1930
|
+
}
|
|
1931
|
+
.ck.ck-ai-mini-toolbar .ck.ck-button.ck-button_with-text {
|
|
1932
|
+
min-height: 2.1em;
|
|
1933
|
+
box-sizing: border-box;
|
|
1934
|
+
flex-direction: row-reverse;
|
|
1935
|
+
padding-right: 0.3em;
|
|
1936
|
+
padding-left: 0.3em;
|
|
1937
|
+
}
|
|
1938
|
+
.ck.ck-ai-mini-toolbar .ck.ck-button.ck-button_with-text span {
|
|
1939
|
+
line-height: 1.4em;
|
|
1940
|
+
}
|
|
1941
|
+
.ck.ck-ai-mini-toolbar .ck.ck-button.ck-button_with-text svg {
|
|
1942
|
+
margin-left: var(--ck-spacing-medium);
|
|
1943
|
+
margin-right: 0;
|
|
1944
|
+
--ck-icon-size: 16px
|
|
1945
|
+
}
|
|
1946
|
+
.ck.ck-ai-mini-toolbar .ck.ck-button.ck-ai-mini-toolbar-copy-button .ck-ai-mini-toolbar-copy-button__check-mark {
|
|
1947
|
+
position: absolute;
|
|
1948
|
+
top: 50%;
|
|
1949
|
+
right: 50%;
|
|
1950
|
+
transform: translate(50%, -50%);
|
|
1951
|
+
color: var(--ck-color-base-action);
|
|
1952
|
+
display: none;
|
|
1953
|
+
}
|
|
1954
|
+
.ck.ck-ai-mini-toolbar .ck.ck-button.ck-ai-mini-toolbar-copy-button.ck-ai-mini-toolbar-copy-button_copied .ck-button__icon {
|
|
1955
|
+
display: none;
|
|
1956
|
+
}
|
|
1957
|
+
.ck.ck-ai-mini-toolbar .ck.ck-button.ck-ai-mini-toolbar-copy-button.ck-ai-mini-toolbar-copy-button_copied .ck-ai-mini-toolbar-copy-button__check-mark {
|
|
1958
|
+
display: block;
|
|
1959
|
+
animation-duration: 1s;
|
|
1960
|
+
animation-name: ck-ai-mini-toolbar-copy-animation;
|
|
1961
|
+
animation-iteration-count: 1;
|
|
1962
|
+
animation-timing-function: ease-out;
|
|
1963
|
+
}
|
|
1964
|
+
@keyframes ck-ai-mini-toolbar-copy-animation {
|
|
1965
|
+
0% {
|
|
1966
|
+
clip-path: inset(0 100% 0 0);
|
|
1967
|
+
}
|
|
1968
|
+
|
|
1969
|
+
50% {
|
|
1970
|
+
clip-path: inset(0 0 0 0);
|
|
1971
|
+
}
|
|
1972
|
+
|
|
1973
|
+
100% {
|
|
1974
|
+
clip-path: inset(0 0 0 0);
|
|
1975
|
+
}
|
|
1976
|
+
}
|
|
1977
|
+
/*
|
|
1978
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
1979
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
1980
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
1981
|
+
*
|
|
1982
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
1983
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
1984
|
+
*/
|
|
1985
|
+
.ck-ai-header {
|
|
1986
|
+
/* Custom values unlike the rest of editor UI. */
|
|
1987
|
+
--ck-ui-component-min-height: 1.7em;
|
|
1988
|
+
--ck-ui-component-min-width: 1.7em;
|
|
1989
|
+
|
|
1990
|
+
/* Custom value. It defaults to the toolbar component height so they look fine on next to each other. */
|
|
1991
|
+
--ck-form-header-height: 3em;
|
|
1992
|
+
--ck-form-header-small-icon-color: hsla(0, 0%, 20%, 1);
|
|
1993
|
+
}
|
|
1994
|
+
.ck-ai-header > .ck-button {
|
|
1995
|
+
margin-inline-start: var(--ck-spacing-standard);
|
|
1996
|
+
}
|
|
1997
|
+
.ck-ai-header > .ck-button > .ck-button__icon {
|
|
1998
|
+
/* Custom value unlike the rest of editor UI (defaults to 16px). See how it's used in the icon.css */
|
|
1999
|
+
--ck-icon-font-size: .666em;
|
|
2000
|
+
|
|
2001
|
+
color: var(--ck-ai-chat-color-icon);
|
|
2002
|
+
}
|
|
2003
|
+
.ck-ai-header > .ck.ck-button.ck-ai-chat__start-conversation {
|
|
2004
|
+
/* Custom value unlike the rest of editor UI (derived from --ck-font-size-base, defaults to 13px). */
|
|
2005
|
+
font-size: 11.7px;
|
|
2006
|
+
min-height: unset;
|
|
2007
|
+
border: 1px solid var(--ck-ai-border-color-button);
|
|
2008
|
+
border-radius: var(--ck-border-radius);
|
|
2009
|
+
gap: var(--ck-spacing-small);
|
|
2010
|
+
color: var(--ck-ai-chat-color-text);
|
|
2011
|
+
}
|
|
2012
|
+
.ck-ai-header > .ck.ck-button.ck-ai-chat__start-conversation:hover {
|
|
2013
|
+
background-color: var(--ck-ai-chat-button-active-background-color);
|
|
2014
|
+
}
|
|
2015
|
+
.ck-ai-header > .ck.ck-button.ck-ai-chat__start-conversation > .ck-button__label {
|
|
2016
|
+
/* Custom value unlike the rest of editor UI. */
|
|
2017
|
+
line-height: 1.4em;
|
|
2018
|
+
}
|
|
2019
|
+
.ck-ai-header > .ck.ck-button.ck-ai-chat__start-conversation > .ck-button__icon {
|
|
2020
|
+
/* Custom value unlike the rest of editor UI (defaults to 14px). See how it's used in the icon.css */
|
|
2021
|
+
--ck-icon-font-size: .632em;
|
|
2022
|
+
|
|
2023
|
+
margin-inline-end: 0;
|
|
2024
|
+
color: var(--ck-ai-chat-color-text);
|
|
2025
|
+
}
|
|
2026
|
+
.ck-ai-header > .ck.ck-button.ck-ai-chat__start-conversation > span.ck-button__label {
|
|
2027
|
+
position: relative;
|
|
2028
|
+
top: 1px;
|
|
2029
|
+
}
|
|
2030
|
+
.ck-ai-header.ck-ai-header_small > .ck.ck-button.ck-button-back {
|
|
2031
|
+
margin-inline-start: 0;
|
|
2032
|
+
margin-inline-end: var(--ck-spacing-small);
|
|
2033
|
+
}
|
|
2034
|
+
.ck-ai-header.ck-ai-header_small > .ck.ck-button.ck-button-back > .ck-button__icon {
|
|
2035
|
+
/* Custom value unlike the rest of editor UI (defaults to 16px). See how it's used in the icon.css */
|
|
2036
|
+
--ck-icon-font-size: 13px;
|
|
2037
|
+
|
|
2038
|
+
color: var(--ck-form-header-small-icon-color);
|
|
2039
|
+
}
|
|
2040
|
+
.ck-ai-header.ck-ai-header_small .ck-form__header__label {
|
|
2041
|
+
--ck-font-size-base: 13px;
|
|
2042
|
+
--ck-font-face: var(--ck-ai-chat-font-family);
|
|
2043
|
+
|
|
2044
|
+
font-weight: 500;
|
|
2045
|
+
}
|
|
2046
|
+
.ck-ai-header .ck-form__header__label:not(:last-child) {
|
|
2047
|
+
margin-inline-end: var(--ck-spacing-small);
|
|
2048
|
+
}
|
|
2049
|
+
/*
|
|
2050
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
2051
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
2052
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
2053
|
+
*
|
|
2054
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
2055
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
2056
|
+
*/
|
|
2057
|
+
:root {
|
|
2058
|
+
--ck-ai-chat-color-background-error: hsla(15, 100%, 97%, 1);
|
|
2059
|
+
--ck-ai-chat-color-background-warning: hsla(36, 100%, 65.10%, 0.10);
|
|
2060
|
+
|
|
2061
|
+
--ck-ai-chat-color-border-error: hsla(14, 100%, 68%, 1);
|
|
2062
|
+
--ck-ai-chat-color-border-warning: hsla(36, 100%, 65%, 1);
|
|
2063
|
+
}
|
|
2064
|
+
/* TODO: rename the class to make it more generic and function as a modifier. */
|
|
2065
|
+
.ck.ck-ai-chat-error {
|
|
2066
|
+
display: flex;
|
|
2067
|
+
align-items: flex-start;
|
|
2068
|
+
justify-content: space-between;
|
|
2069
|
+
gap: var(--ck-spacing-medium);
|
|
2070
|
+
width: fit-content;
|
|
2071
|
+
|
|
2072
|
+
background-color: var(--ck-ai-chat-color-background-error);
|
|
2073
|
+
border: 1px solid var(--ck-ai-chat-color-border-error);
|
|
2074
|
+
padding: var(--ck-spacing-standard);
|
|
2075
|
+
border-radius: var(--ck-ai-border-radius);
|
|
2076
|
+
}
|
|
2077
|
+
.ck.ck-ai-chat-error.ck-ai-chat-error_warning {
|
|
2078
|
+
background-color: var(--ck-ai-chat-color-background-warning);
|
|
2079
|
+
border-color: var(--ck-ai-chat-color-border-warning);
|
|
2080
|
+
}
|
|
2081
|
+
.ck.ck-ai-chat-error > p {
|
|
2082
|
+
flex: 1;
|
|
2083
|
+
max-width: calc(100% - (16px + var(--ck-spacing-medium)));
|
|
2084
|
+
white-space: normal;
|
|
2085
|
+
color: var(--ck-color-base-text);
|
|
2086
|
+
line-height: var(--ck-line-height-base);
|
|
2087
|
+
}
|
|
2088
|
+
.ck.ck-ai-chat-error > .ck-button {
|
|
2089
|
+
--ck-icon-font-size: 0.666em;
|
|
2090
|
+
}
|
|
2091
|
+
.ck.ck-ai-chat-error > .ck-button.ck-ai-chat-error__dismiss-button {
|
|
2092
|
+
--ck-icon-font-size: 0.666em;
|
|
2093
|
+
--ck-ui-component-min-height: 16px;
|
|
2094
|
+
|
|
2095
|
+
padding: 0;
|
|
2096
|
+
flex-shrink: 0;
|
|
2097
|
+
}
|
|
2098
|
+
.ck.ck-ai-chat-error.ck-ai-chat-error_full-width > p {
|
|
2099
|
+
max-width: 100%;
|
|
2100
|
+
}
|
|
2101
|
+
/*
|
|
2102
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
2103
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
2104
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
2105
|
+
*
|
|
2106
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
2107
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
2108
|
+
*/
|
|
2109
|
+
:root {
|
|
2110
|
+
--ai-skeleton-z-index: calc( var(--ck-z-default) + 1 );
|
|
2111
|
+
--ck-ai-skeleton-item-background: linear-gradient(90deg, hsl(0, 0.00%, 98.00%) 0%, hsl(0, 0.00%, 94.10%) 50%, hsl(0, 0.00%, 98.00%) 100%);
|
|
2112
|
+
--ck-ai-skeleton-animation-duration: 1s;
|
|
2113
|
+
--ck-ai-skeleton-gap: var(--ck-spacing-extra-large);
|
|
2114
|
+
}
|
|
2115
|
+
.ck.ck-ai-skeleton {
|
|
2116
|
+
position: absolute;
|
|
2117
|
+
inset: 0;
|
|
2118
|
+
z-index: var(--ai-skeleton-z-index);
|
|
2119
|
+
display: flex;
|
|
2120
|
+
flex-direction: column;
|
|
2121
|
+
align-items: flex-end;
|
|
2122
|
+
gap: var(--ck-ai-skeleton-gap) 0;
|
|
2123
|
+
padding: var(--ck-spacing-extra-large) var(--ck-spacing-large) var(--ck-spacing-large);
|
|
2124
|
+
width: 100%;
|
|
2125
|
+
height: 100%;
|
|
2126
|
+
background-color: var(--ck-color-base-background);
|
|
2127
|
+
opacity: 1;
|
|
2128
|
+
transition: opacity .4s, display .4s allow-discrete;
|
|
2129
|
+
transition-delay: 350ms;
|
|
2130
|
+
}
|
|
2131
|
+
.ck.ck-ai-skeleton.ck-hidden {
|
|
2132
|
+
transition-delay: 0ms;
|
|
2133
|
+
opacity: 0;
|
|
2134
|
+
}
|
|
2135
|
+
@starting-style {
|
|
2136
|
+
.ck.ck-ai-skeleton {
|
|
2137
|
+
opacity: 0;
|
|
2138
|
+
}
|
|
2139
|
+
}
|
|
2140
|
+
.ck.ck-ai-skeleton > .ck.ck-ai-skeleton__item {
|
|
2141
|
+
background: var(--ck-ai-skeleton-item-background);
|
|
2142
|
+
background-size: 200% 100%;
|
|
2143
|
+
animation: var(--ck-ai-skeleton-animation-duration) ck-ai-skeleton-shine linear infinite;
|
|
2144
|
+
width: 100%;
|
|
2145
|
+
}
|
|
2146
|
+
@keyframes ck-ai-skeleton-shine {
|
|
2147
|
+
to {
|
|
2148
|
+
background-position-x: -200%;
|
|
2149
|
+
}
|
|
2150
|
+
}
|
|
2151
|
+
/*
|
|
2152
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
2153
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
2154
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
2155
|
+
*
|
|
2156
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
2157
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
2158
|
+
*/
|
|
2159
|
+
:root {
|
|
2160
|
+
--ck-ai-spinner-size: var(--ck-toolbar-spinner-size);
|
|
2161
|
+
--ck-ai-spinner-background: linear-gradient(to right, hsl(0, 0%, 100%), hsl(0, 0%, 58%));
|
|
2162
|
+
--ck-ai-spinner-mask: radial-gradient(farthest-side, transparent 66%, hsl(0, 0%, 0%) 61%);
|
|
2163
|
+
--ck-ai-spinner-animation-duration: 1s;
|
|
2164
|
+
}
|
|
2165
|
+
.ck.ck-spinner-container.ck-ai-spinner {
|
|
2166
|
+
display: inline-block;
|
|
2167
|
+
width: var(--ck-ai-spinner-size);
|
|
2168
|
+
height: var(--ck-ai-spinner-size);
|
|
2169
|
+
margin: 0;
|
|
2170
|
+
flex-shrink: 0;
|
|
2171
|
+
animation-duration: var(--ck-ai-spinner-animation-duration);
|
|
2172
|
+
}
|
|
2173
|
+
.ck.ck-spinner-container.ck-ai-spinner .ck-spinner {
|
|
2174
|
+
width: var(--ck-ai-spinner-size);
|
|
2175
|
+
height: var(--ck-ai-spinner-size);
|
|
2176
|
+
|
|
2177
|
+
border: none;
|
|
2178
|
+
|
|
2179
|
+
background: var(--ck-ai-spinner-background);
|
|
2180
|
+
-webkit-mask: var(--ck-ai-spinner-mask);
|
|
2181
|
+
mask: var(--ck-ai-spinner-mask);
|
|
2182
|
+
|
|
2183
|
+
box-sizing: border-box;
|
|
2184
|
+
}
|
|
2185
|
+
.ck.ck-spinner-container.ck-ai-spinner.ck-ai-spinner_small {
|
|
2186
|
+
--ck-ai-spinner-size: 1em;
|
|
2187
|
+
}
|
|
2188
|
+
.ck.ck-spinner-container.ck-ai-spinner.ck-ai-spinner_tiny {
|
|
2189
|
+
--ck-ai-spinner-size: 12px;
|
|
2190
|
+
}
|
|
2191
|
+
.ck.ck-spinner-container.ck-hidden {
|
|
2192
|
+
display: none;
|
|
2193
|
+
animation: none;
|
|
2194
|
+
}
|
|
2195
|
+
@keyframes ck-spin {
|
|
2196
|
+
to {
|
|
2197
|
+
transform: rotate(360deg);
|
|
2198
|
+
}
|
|
2199
|
+
}
|
|
2200
|
+
/*
|
|
2201
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
2202
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
2203
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
2204
|
+
*
|
|
2205
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
2206
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
2207
|
+
*/
|
|
2208
|
+
:root {
|
|
2209
|
+
/* Primary button */
|
|
2210
|
+
--ck-ai-button-primary-color: hsla(0, 0%, 100%, 1);
|
|
2211
|
+
--ck-ai-button-primary-disabled-color: hsla(0, 0%, 100%, 1);
|
|
2212
|
+
--ck-ai-button-primary-background-color: hsla(263, 59%, 52%, 1);
|
|
2213
|
+
--ck-ai-button-primary-disabled-background-color: hsla(263, 59%, 52%, 0.5);
|
|
2214
|
+
--ck-ai-button-primary-hover-background-color: hsla(263, 59%, 40%, 1);
|
|
2215
|
+
|
|
2216
|
+
/* Secondary button */
|
|
2217
|
+
--ck-ai-button-secondary-color: hsla(263, 59%, 52%, 1);
|
|
2218
|
+
--ck-ai-button-secondary-disabled-color: hsla(263, 59%, 52%, 0.5);
|
|
2219
|
+
--ck-ai-button-secondary-background-color: hsla(0, 0%, 100%, 1);
|
|
2220
|
+
--ck-ai-button-secondary-disabled-background-color: hsla(0, 0%, 100%, 0.5);
|
|
2221
|
+
--ck-ai-button-secondary-border-color: hsla(262, 51%, 80%, 1);
|
|
2222
|
+
--ck-ai-button-secondary-disabled-border-color: hsla(262, 51%, 80%, 0.5);
|
|
2223
|
+
--ck-ai-button-secondary-hover-background-color: hsla(262, 100%, 96%, 1);
|
|
2224
|
+
--ck-ai-button-secondary-active-background-color: hsla(262, 100%, 96%, 1);
|
|
2225
|
+
|
|
2226
|
+
/* Tertiary text button */
|
|
2227
|
+
--ck-ai-button-tertiary-text-color: hsla(263, 59%, 52%, 1);
|
|
2228
|
+
--ck-ai-button-tertiary-disabled-text-color: hsla(263, 59%, 52%, 0.5);
|
|
2229
|
+
--ck-ai-button-tertiary-text-background-color: transparent;
|
|
2230
|
+
--ck-ai-button-tertiary-text-hover-background-color: hsla(262, 100%, 96%, 1);
|
|
2231
|
+
|
|
2232
|
+
/* Tertiary filled button */
|
|
2233
|
+
--ck-ai-button-tertiary-filled-color: hsla(0, 0%, 44%, 1);
|
|
2234
|
+
--ck-ai-button-tertiary-filled-disabled-color: hsla(0, 0%, 44%, 0.5);
|
|
2235
|
+
--ck-ai-button-tertiary-filled-hover-color: hsla(0, 0%, 20%, 1);
|
|
2236
|
+
--ck-ai-button-tertiary-filled-active-color: hsla(263, 59%, 52%, 1);
|
|
2237
|
+
--ck-ai-button-tertiary-filled-background-color: transparent;
|
|
2238
|
+
--ck-ai-button-tertiary-filled-disabled-background-color: hsla(0, 0%, 93%, 1);
|
|
2239
|
+
--ck-ai-button-tertiary-filled-hover-background-color: hsla(262, 100%, 96%, 1);
|
|
2240
|
+
--ck-ai-button-tertiary-filled-active-background-color: hsla(262, 100%, 96%, 1);
|
|
2241
|
+
}
|
|
2242
|
+
.ck.ck-button.ck-ai-button-primary {
|
|
2243
|
+
color: var(--ck-ai-button-primary-color);
|
|
2244
|
+
background-color: var(--ck-ai-button-primary-background-color);
|
|
2245
|
+
border: none;
|
|
2246
|
+
}
|
|
2247
|
+
.ck.ck-button.ck-ai-button-primary:hover {
|
|
2248
|
+
background-color: var(--ck-ai-button-primary-hover-background-color);
|
|
2249
|
+
}
|
|
2250
|
+
.ck.ck-button.ck-ai-button-primary:disabled,
|
|
2251
|
+
.ck.ck-button.ck-ai-button-primary.ck-disabled {
|
|
2252
|
+
color: var(--ck-ai-button-primary-disabled-color);
|
|
2253
|
+
background-color: var(--ck-ai-button-primary-disabled-background-color);
|
|
2254
|
+
cursor: not-allowed;
|
|
2255
|
+
}
|
|
2256
|
+
.ck.ck-button.ck-ai-button-primary:disabled > .ck.ck-button__label,
|
|
2257
|
+
.ck.ck-button.ck-ai-button-primary.ck-disabled > .ck.ck-button__label,
|
|
2258
|
+
.ck.ck-button.ck-ai-button-primary:disabled > .ck-button__icon,
|
|
2259
|
+
.ck.ck-button.ck-ai-button-primary.ck-disabled > .ck-button__icon {
|
|
2260
|
+
opacity: 1;
|
|
2261
|
+
}
|
|
2262
|
+
.ck.ck-button.ck-ai-button-secondary {
|
|
2263
|
+
color: var(--ck-ai-button-secondary-color);
|
|
2264
|
+
background-color: var(--ck-ai-button-secondary-background-color);
|
|
2265
|
+
border: 1px solid var(--ck-ai-button-secondary-border-color);
|
|
2266
|
+
}
|
|
2267
|
+
.ck.ck-button.ck-ai-button-secondary:hover {
|
|
2268
|
+
background-color: var(--ck-ai-button-secondary-hover-background-color);
|
|
2269
|
+
}
|
|
2270
|
+
.ck.ck-button.ck-ai-button-secondary:active,
|
|
2271
|
+
.ck.ck-button.ck-ai-button-secondary.ck-on {
|
|
2272
|
+
background-color: var(--ck-ai-button-secondary-active-background-color);
|
|
2273
|
+
}
|
|
2274
|
+
.ck.ck-button.ck-ai-button-secondary:disabled,
|
|
2275
|
+
.ck.ck-button.ck-ai-button-secondary.ck-disabled {
|
|
2276
|
+
color: var(--ck-ai-button-secondary-disabled-color);
|
|
2277
|
+
background-color: var(--ck-ai-button-secondary-disabled-background-color);
|
|
2278
|
+
border: 1px solid var(--ck-ai-button-secondary-disabled-border-color);
|
|
2279
|
+
cursor: not-allowed;
|
|
2280
|
+
}
|
|
2281
|
+
.ck.ck-button.ck-ai-button-secondary:disabled > .ck.ck-button__label,
|
|
2282
|
+
.ck.ck-button.ck-ai-button-secondary.ck-disabled > .ck.ck-button__label,
|
|
2283
|
+
.ck.ck-button.ck-ai-button-secondary:disabled > .ck-button__icon,
|
|
2284
|
+
.ck.ck-button.ck-ai-button-secondary.ck-disabled > .ck-button__icon {
|
|
2285
|
+
opacity: 1;
|
|
2286
|
+
}
|
|
2287
|
+
.ck.ck-button.ck-ai-button-tertiary-text {
|
|
2288
|
+
color: var(--ck-ai-button-tertiary-text-color);
|
|
2289
|
+
background-color: var(--ck-ai-button-tertiary-text-background-color);
|
|
2290
|
+
border: none;
|
|
2291
|
+
}
|
|
2292
|
+
.ck.ck-button.ck-ai-button-tertiary-text:hover {
|
|
2293
|
+
background-color: var(--ck-ai-button-tertiary-text-hover-background-color);
|
|
2294
|
+
}
|
|
2295
|
+
.ck.ck-button.ck-ai-button-tertiary-text:disabled,
|
|
2296
|
+
.ck.ck-button.ck-ai-button-tertiary-text.ck-disabled {
|
|
2297
|
+
color: var(--ck-ai-button-tertiary-disabled-text-color);
|
|
2298
|
+
cursor: not-allowed;
|
|
2299
|
+
}
|
|
2300
|
+
.ck.ck-button.ck-ai-button-tertiary-text:disabled > .ck.ck-button__label,
|
|
2301
|
+
.ck.ck-button.ck-ai-button-tertiary-text.ck-disabled > .ck.ck-button__label,
|
|
2302
|
+
.ck.ck-button.ck-ai-button-tertiary-text:disabled > .ck-button__icon,
|
|
2303
|
+
.ck.ck-button.ck-ai-button-tertiary-text.ck-disabled > .ck-button__icon {
|
|
2304
|
+
opacity: 1;
|
|
2305
|
+
}
|
|
2306
|
+
.ck.ck-button.ck-ai-button-tertiary-filled {
|
|
2307
|
+
color: var(--ck-ai-button-tertiary-filled-color);
|
|
2308
|
+
background-color: var(--ck-ai-button-tertiary-filled-background-color);
|
|
2309
|
+
border: none;
|
|
2310
|
+
}
|
|
2311
|
+
.ck.ck-button.ck-ai-button-tertiary-filled:hover {
|
|
2312
|
+
color: var(--ck-ai-button-tertiary-filled-hover-color);
|
|
2313
|
+
background-color: var(--ck-ai-button-tertiary-filled-hover-background-color);
|
|
2314
|
+
}
|
|
2315
|
+
.ck.ck-button.ck-ai-button-tertiary-filled:active,
|
|
2316
|
+
.ck.ck-button.ck-ai-button-tertiary-filled.ck-on {
|
|
2317
|
+
color: var(--ck-ai-button-tertiary-filled-active-color);
|
|
2318
|
+
background-color: var(--ck-ai-button-tertiary-filled-active-background-color);
|
|
2319
|
+
}
|
|
2320
|
+
.ck.ck-button.ck-ai-button-tertiary-filled:disabled,
|
|
2321
|
+
.ck.ck-button.ck-ai-button-tertiary-filled.ck-disabled {
|
|
2322
|
+
color: var(--ck-ai-button-tertiary-filled-disabled-color);
|
|
2323
|
+
background-color: var(--ck-ai-button-tertiary-filled-disabled-background-color);
|
|
2324
|
+
cursor: not-allowed;
|
|
2325
|
+
}
|
|
2326
|
+
.ck.ck-button.ck-ai-button-tertiary-filled:disabled > .ck.ck-button__label,
|
|
2327
|
+
.ck.ck-button.ck-ai-button-tertiary-filled.ck-disabled > .ck.ck-button__label,
|
|
2328
|
+
.ck.ck-button.ck-ai-button-tertiary-filled:disabled > .ck-button__icon,
|
|
2329
|
+
.ck.ck-button.ck-ai-button-tertiary-filled.ck-disabled > .ck-button__icon {
|
|
2330
|
+
opacity: 1;
|
|
2331
|
+
}
|
|
2332
|
+
/*
|
|
2333
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
2334
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
2335
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
2336
|
+
*
|
|
2337
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
2338
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
2339
|
+
*/
|
|
2340
|
+
:root {
|
|
2341
|
+
--ck-ai-disclaimer-background-color: hsla(0, 0%, 96%, 1);
|
|
2342
|
+
--ck-ai-disclaimer-border-color: hsla(220, 6%, 82%, 1);
|
|
2343
|
+
--ck-ai-disclaimer-text-color: hsla(0, 0%, 44%, 1);
|
|
2344
|
+
}
|
|
2345
|
+
.ck.ck-ai-disclaimer {
|
|
2346
|
+
background-color: var(--ck-ai-disclaimer-background-color);
|
|
2347
|
+
border-top: 1px solid var(--ck-ai-disclaimer-border-color);
|
|
2348
|
+
padding: var(--ck-spacing-standard) 1em;
|
|
2349
|
+
}
|
|
2350
|
+
.ck.ck-ai-disclaimer > .ck.ck-ai-disclaimer__content {
|
|
2351
|
+
color: var(--ck-ai-disclaimer-text-color);
|
|
2352
|
+
font-size: 0.75em;
|
|
2353
|
+
line-height: 1.025em;
|
|
2354
|
+
text-align: center;
|
|
2355
|
+
word-break: normal;
|
|
2356
|
+
text-wrap: auto;
|
|
2357
|
+
}
|
|
2358
|
+
|
|
2359
|
+
:root {
|
|
2360
|
+
--ck-ai-border-color-main: hsla(216, 5%, 81%, 1);
|
|
2361
|
+
--ck-ai-border-color-button: hsla(262, 51%, 80%, 1);
|
|
2362
|
+
--ck-ai-background-color-action-button: hsla(263, 59%, 52%, 1);
|
|
2363
|
+
--ck-ai-font-color-action-button: hsl(0, 0%, 100%);
|
|
2364
|
+
|
|
2365
|
+
--ck-ai-chat-color-text: hsla(263, 59%, 52%, 1);
|
|
2366
|
+
--ck-ai-chat-color-icon: hsla(0, 0%, 44%, 1);
|
|
2367
|
+
--ck-ai-chat-border-width: 1px;
|
|
2368
|
+
|
|
2369
|
+
--ck-ai-chat-button-active-background-color: hsla(262, 100%, 96%, 1);
|
|
2370
|
+
--ck-ai-chat-button-active-color: hsla(263, 59%, 52%, 1);
|
|
2371
|
+
--ck-ai-chat-button-hover-color: hsla(0, 0%, 20%, 1);
|
|
2372
|
+
--ck-ai-chat-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
2373
|
+
--ck-ai-chat-user-context-background: hsla(0, 0%, 98%, 1);
|
|
2374
|
+
|
|
2375
|
+
--ck-ai-chat-flash-color: hsla(263, 59%, 52%, 0.102);
|
|
2376
|
+
--ck-ai-chat-flash-color-text: hsla(263, 59%, 52%, 1);
|
|
2377
|
+
--ck-ai-chat-animation-duration: 0.6s;
|
|
2378
|
+
--ck-ai-chat-animation-timing: ease-out;
|
|
2379
|
+
|
|
2380
|
+
--ck-ai-chat-loader-animation-duration: 1.5s;
|
|
2381
|
+
--ck-ai-chat-loader-icon-color: hsla(0, 0%, 96%, 0.98);
|
|
2382
|
+
|
|
2383
|
+
--ck-ai-chat-feed-loader-icon-color: hsla(0, 0%, 85%, 1);
|
|
2384
|
+
|
|
2385
|
+
--ck-ai-border-radius: calc(var(--ck-border-radius) * 2);
|
|
2386
|
+
}
|
|
2387
|
+
|
|
2388
|
+
/* Note: This class name is mentioned in the guide and acts like a public API. */
|
|
2389
|
+
.ck-ai-ui_theme {
|
|
2390
|
+
/* @TODO: there should be one theme applied on all NextGenAI features */
|
|
2391
|
+
}
|
|
2392
|
+
|
|
2393
|
+
.ck.ck-ai-chat {
|
|
2394
|
+
|
|
2395
|
+
width: 100%;
|
|
2396
|
+
min-height: 300px;
|
|
2397
|
+
display: flex;
|
|
2398
|
+
flex-direction: column;
|
|
2399
|
+
overflow: hidden;
|
|
2400
|
+
font-family: var(--ck-ai-chat-font-family) !important;
|
|
2401
|
+
}
|
|
2402
|
+
|
|
2403
|
+
.ck.ck-ai-chat * {
|
|
2404
|
+
font-family: var(--ck-ai-chat-font-family) !important;
|
|
2405
|
+
}
|
|
2406
|
+
|
|
2407
|
+
/*
|
|
2408
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
2409
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
2410
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
2411
|
+
*
|
|
2412
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
2413
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
2414
|
+
*/
|
|
2415
|
+
|
|
2416
|
+
:root {
|
|
2417
|
+
--ai-active-icon-size: 17px;
|
|
2418
|
+
|
|
2419
|
+
--ck-ai-loader-icon-color: hsla(0, 0%, 85%, 1);
|
|
2420
|
+
--ck-ai-loader-icon-dot-color: hsla(0, 0%, 65%, 1);
|
|
2421
|
+
--ck-ai-chat-feed-item-spacing: var(--ck-spacing-extra-large);
|
|
2422
|
+
}
|
|
2423
|
+
|
|
2424
|
+
.ck .ck-ai-chat-history {
|
|
2425
|
+
display: flex;
|
|
2426
|
+
flex-direction: column;
|
|
2427
|
+
height: 100%;
|
|
2428
|
+
}
|
|
2429
|
+
|
|
2430
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__content,
|
|
2431
|
+
.ck .ck-ai-chat-history .ck-search {
|
|
2432
|
+
display: flex;
|
|
2433
|
+
flex-direction: column;
|
|
2434
|
+
flex: 1 1 auto;
|
|
2435
|
+
min-height: 0;
|
|
2436
|
+
gap: var(--ck-spacing-medium-small);
|
|
2437
|
+
position: relative;
|
|
2438
|
+
}
|
|
2439
|
+
|
|
2440
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__content .ck-ai-chat-error {
|
|
2441
|
+
margin: var(--ck-spacing-extra-large) var(--ck-spacing-large) var(--ck-spacing-medium) var(--ck-spacing-large);
|
|
2442
|
+
}
|
|
2443
|
+
|
|
2444
|
+
.ck .ck-ai-chat-history .ck-search > .ck-labeled-field-view {
|
|
2445
|
+
margin-top: var(--ck-spacing-medium);
|
|
2446
|
+
padding: var(--ck-spacing-large) var(--ck-spacing-large) var(--ck-spacing-tiny);
|
|
2447
|
+
}
|
|
2448
|
+
|
|
2449
|
+
.ck .ck-ai-chat-history .ck-search__results {
|
|
2450
|
+
min-height: 0;
|
|
2451
|
+
flex: 1 1 auto;
|
|
2452
|
+
overflow-y: auto;
|
|
2453
|
+
overflow-x: hidden;
|
|
2454
|
+
}
|
|
2455
|
+
|
|
2456
|
+
.ck .ck-ai-chat-history .ck-dropdown .ck-dropdown__arrow {
|
|
2457
|
+
display: none;
|
|
2458
|
+
}
|
|
2459
|
+
|
|
2460
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__sections {
|
|
2461
|
+
gap: var(--ck-spacing-medium-small);
|
|
2462
|
+
}
|
|
2463
|
+
|
|
2464
|
+
.ck .ck-ai-chat-history .ck.ck-dropdown .ck-button.ck-dropdown__button:not(.ck-button_with-text) {
|
|
2465
|
+
padding: 0;
|
|
2466
|
+
}
|
|
2467
|
+
|
|
2468
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__section-title {
|
|
2469
|
+
color: var(--ck-ai-chat-color-icon);
|
|
2470
|
+
font-size: 0.85em;
|
|
2471
|
+
font-weight: 700;
|
|
2472
|
+
line-height: 1.85em;
|
|
2473
|
+
padding: 0.48em 0.9em 0 0.9em;
|
|
2474
|
+
}
|
|
2475
|
+
|
|
2476
|
+
.ck .ck-ai-chat-history .ck-confirm-view .ck-confirm-view-inner, .ck .ck-ai-chat-history .ck-ai-chat-history__item {
|
|
2477
|
+
padding: var(--ck-spacing-tiny)
|
|
2478
|
+
var(--ck-spacing-extra-large)
|
|
2479
|
+
var(--ck-spacing-tiny)
|
|
2480
|
+
var(--ck-spacing-large);
|
|
2481
|
+
}
|
|
2482
|
+
|
|
2483
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item {
|
|
2484
|
+
display: flex;
|
|
2485
|
+
position: relative;
|
|
2486
|
+
transition: transform 300ms ease;
|
|
2487
|
+
}
|
|
2488
|
+
|
|
2489
|
+
@media (prefers-reduced-motion: reduce) {
|
|
2490
|
+
|
|
2491
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item {
|
|
2492
|
+
transition: none;
|
|
2493
|
+
}
|
|
2494
|
+
}
|
|
2495
|
+
|
|
2496
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item:hover {
|
|
2497
|
+
background-color: var(--ck-ai-chat-button-active-background-color);
|
|
2498
|
+
}
|
|
2499
|
+
|
|
2500
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-title {
|
|
2501
|
+
display: inline-block;
|
|
2502
|
+
width: 100%;
|
|
2503
|
+
overflow: hidden;
|
|
2504
|
+
text-overflow: ellipsis;
|
|
2505
|
+
}
|
|
2506
|
+
|
|
2507
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item--active .ck-ai-chat-history__item-title {
|
|
2508
|
+
font-weight: 700;
|
|
2509
|
+
}
|
|
2510
|
+
|
|
2511
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-row {
|
|
2512
|
+
--ck-icon-font-size: .666em;
|
|
2513
|
+
--ck-ui-component-min-height: 1.7em;
|
|
2514
|
+
--ck-ui-component-min-width: 1.7em;
|
|
2515
|
+
|
|
2516
|
+
width: 100%;
|
|
2517
|
+
min-width: 0;
|
|
2518
|
+
margin-left: 0.3em;
|
|
2519
|
+
}
|
|
2520
|
+
|
|
2521
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-row, .ck .ck-ai-chat-history .ck-ai-chat-history__item-actions {
|
|
2522
|
+
display: flex;
|
|
2523
|
+
align-items: center;
|
|
2524
|
+
gap: 0.6em;
|
|
2525
|
+
}
|
|
2526
|
+
|
|
2527
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-actions {
|
|
2528
|
+
height: 100%;
|
|
2529
|
+
}
|
|
2530
|
+
|
|
2531
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-actions > .ck-button,
|
|
2532
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-actions > .ck-dropdown .ck-dropdown__button {
|
|
2533
|
+
opacity: .7;
|
|
2534
|
+
}
|
|
2535
|
+
|
|
2536
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-actions > .ck-button:hover, .ck .ck-ai-chat-history .ck-ai-chat-history__item-actions > .ck-dropdown .ck-dropdown__button:hover {
|
|
2537
|
+
opacity: 1;
|
|
2538
|
+
background: none;
|
|
2539
|
+
}
|
|
2540
|
+
|
|
2541
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-actions > .ck-button.ck-on, .ck .ck-ai-chat-history .ck-ai-chat-history__item-actions > .ck-dropdown .ck-dropdown__button.ck-on {
|
|
2542
|
+
background-color: var(--ck-ai-chat-button-active-background-color);
|
|
2543
|
+
color: var(--ck-ai-chat-button-hover-color);
|
|
2544
|
+
}
|
|
2545
|
+
|
|
2546
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-actions > .ck-button.ck-on svg, .ck .ck-ai-chat-history .ck-ai-chat-history__item-actions > .ck-dropdown .ck-dropdown__button.ck-on svg {
|
|
2547
|
+
color: var(--ck-ai-chat-button-active-color);
|
|
2548
|
+
}
|
|
2549
|
+
|
|
2550
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item--edit .ck-input,
|
|
2551
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item--edit .ck-input_focused {
|
|
2552
|
+
width: 100%;
|
|
2553
|
+
padding: 0;
|
|
2554
|
+
border: none;
|
|
2555
|
+
box-shadow: none;
|
|
2556
|
+
background: transparent;
|
|
2557
|
+
}
|
|
2558
|
+
|
|
2559
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item--edit {
|
|
2560
|
+
background: var(--ck-ai-chat-button-active-background-color);
|
|
2561
|
+
}
|
|
2562
|
+
|
|
2563
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item--edit .ck-ai-chat-history__item-edit .ck-input {
|
|
2564
|
+
background: var(--ck-ai-chat-button-active-background-color);
|
|
2565
|
+
}
|
|
2566
|
+
|
|
2567
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item--edit .ck-ai-chat-history__item-actions {
|
|
2568
|
+
align-items: center;
|
|
2569
|
+
}
|
|
2570
|
+
|
|
2571
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-content {
|
|
2572
|
+
display: flex;
|
|
2573
|
+
flex-direction: column;
|
|
2574
|
+
justify-content: center;
|
|
2575
|
+
align-items: flex-start;
|
|
2576
|
+
flex: 1 0 0;
|
|
2577
|
+
overflow: hidden;
|
|
2578
|
+
}
|
|
2579
|
+
|
|
2580
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-main-content {
|
|
2581
|
+
width: 100%;
|
|
2582
|
+
}
|
|
2583
|
+
|
|
2584
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-main-content, .ck .ck-ai-chat-history .ck-ai-chat-history__item-check-container {
|
|
2585
|
+
display: flex;
|
|
2586
|
+
align-items: center;
|
|
2587
|
+
height: 2em;
|
|
2588
|
+
}
|
|
2589
|
+
|
|
2590
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-check-container {
|
|
2591
|
+
--ck-icon-font-size: .5em;
|
|
2592
|
+
|
|
2593
|
+
min-width: var(--ai-active-icon-size);
|
|
2594
|
+
}
|
|
2595
|
+
|
|
2596
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__item-date {
|
|
2597
|
+
line-height: 1.385em;
|
|
2598
|
+
color: var(--ck-ai-chat-color-icon);
|
|
2599
|
+
}
|
|
2600
|
+
|
|
2601
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__empty {
|
|
2602
|
+
padding: var(--ck-spacing-tiny) var(--ck-spacing-large) var(--ck-spacing-large) var(--ck-spacing-large);
|
|
2603
|
+
}
|
|
2604
|
+
|
|
2605
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__empty .ck-ai-chat-history__empty-message {
|
|
2606
|
+
text-wrap: auto;
|
|
2607
|
+
line-height: 1.85em;
|
|
2608
|
+
margin: var(--ck-spacing-large) 0;
|
|
2609
|
+
}
|
|
2610
|
+
|
|
2611
|
+
.ck .ck-ai-chat-history .ck-ai-chat-history__empty .ck-ai-chat-history__open-chat-button {
|
|
2612
|
+
font-size: 0.9em;
|
|
2613
|
+
border: none;
|
|
2614
|
+
padding: 0 var(--ck-spacing-standard);
|
|
2615
|
+
min-height: 22px;
|
|
2616
|
+
height: 22px;
|
|
2617
|
+
|
|
2618
|
+
background-color: var(--ck-ai-background-color-action-button);
|
|
2619
|
+
color: var(--ck-ai-font-color-action-button);
|
|
2620
|
+
}
|
|
2621
|
+
|
|
2622
|
+
.ck .ck-ai-chat-history .ck-confirm-view {
|
|
2623
|
+
--ck-icon-font-size: .666em;
|
|
2624
|
+
--ck-ui-component-min-height: 1.7em;
|
|
2625
|
+
--ck-ui-component-min-width: 1.7em;
|
|
2626
|
+
}
|
|
2627
|
+
|
|
2628
|
+
.ck .ck-ai-chat-history .ck-confirm-view .ck-confirm-view-inner {
|
|
2629
|
+
flex-direction: row;
|
|
2630
|
+
align-items: center;
|
|
2631
|
+
justify-content: space-between;
|
|
2632
|
+
gap: 0.6em;
|
|
2633
|
+
flex: 1 0 0;
|
|
2634
|
+
margin-left: var(--ai-active-icon-size);
|
|
2635
|
+
}
|
|
2636
|
+
|
|
2637
|
+
.ck .ck-ai-chat-history .ck-confirm-view .ck-confirm-view-actions {
|
|
2638
|
+
display: flex;
|
|
2639
|
+
gap: 0.6em;
|
|
2640
|
+
}
|
|
2641
|
+
|
|
2642
|
+
/*
|
|
2643
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
2644
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
2645
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
2646
|
+
*
|
|
2647
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
2648
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
2649
|
+
*/
|
|
2650
|
+
|
|
2651
|
+
:root {
|
|
2652
|
+
--ck-ai-quick-actions-button-color: hsla(263, 59%, 52%, 1);
|
|
2653
|
+
--ck-ai-quick-actions-button-background-color: hsla(265, 100%, 96%, 1);
|
|
2654
|
+
}
|
|
2655
|
+
|
|
2656
|
+
.ck-ai-quick-actions {
|
|
2657
|
+
width: 300px;
|
|
2658
|
+
}
|
|
2659
|
+
|
|
2660
|
+
.ck-ai-quick-actions svg.ck-icon {
|
|
2661
|
+
width: 20px;
|
|
2662
|
+
height: 20px;
|
|
2663
|
+
}
|
|
2664
|
+
|
|
2665
|
+
:scope .ck-ai-quick-actions-dropdown,:scope .ck-ai-quick-actions-group-panel {
|
|
2666
|
+
--ck-color-list-button-hover-background: var(--ck-ai-quick-actions-button-background-color);
|
|
2667
|
+
--ck-color-button-default-hover-background: var(--ck-ai-quick-actions-button-background-color);
|
|
2668
|
+
--ck-color-button-on-background: var(--ck-ai-quick-actions-button-background-color);
|
|
2669
|
+
--ck-color-button-on-hover-background: var(--ck-ai-quick-actions-button-background-color);
|
|
2670
|
+
}
|
|
2671
|
+
|
|
2672
|
+
:scope .ck-ai-quick-actions-dropdown .ck.ck-button:not(.ck-dropdown__button),:scope .ck-ai-quick-actions-group-panel .ck.ck-button:not(.ck-dropdown__button) {
|
|
2673
|
+
border-color: transparent;
|
|
2674
|
+
box-shadow: none;
|
|
2675
|
+
}
|
|
2676
|
+
|
|
2677
|
+
:scope .ck-ai-quick-actions-dropdown .ck.ck-button:not(.ck-dropdown__button):focus,:scope .ck-ai-quick-actions-group-panel .ck.ck-button:not(.ck-dropdown__button):focus {
|
|
2678
|
+
background-color: var(--ck-ai-quick-actions-button-background-color);
|
|
2679
|
+
}
|
|
2680
|
+
|
|
2681
|
+
:scope .ck-ai-quick-actions-dropdown .ck.ck-button.ck-dropdown__button.ck-on,:scope .ck-ai-quick-actions-group-panel .ck.ck-button.ck-dropdown__button.ck-on {
|
|
2682
|
+
color: var(--ck-ai-quick-actions-button-color);
|
|
2683
|
+
}
|
|
2684
|
+
|
|
2685
|
+
/*
|
|
2686
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
2687
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
2688
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
2689
|
+
*
|
|
2690
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
2691
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
2692
|
+
*/
|
|
2693
|
+
|
|
2694
|
+
:root {
|
|
2695
|
+
/* Taken from old AI Assistant */
|
|
2696
|
+
--ck-color-ai-selection: hsl(262.5, 60%, 90%);
|
|
2697
|
+
|
|
2698
|
+
/* Primary button */
|
|
2699
|
+
--ck-ai-button-primary-color: hsla(0, 0%, 100%, 1);
|
|
2700
|
+
--ck-ai-button-primary-disabled-color: hsla(0, 0%, 100%, 1);
|
|
2701
|
+
--ck-ai-button-primary-background-color: hsla(263, 59%, 52%, 1);
|
|
2702
|
+
--ck-ai-button-primary-disabled-background-color: hsla(263, 59%, 52%, 0.5);
|
|
2703
|
+
--ck-ai-button-primary-hover-background-color: hsla(263, 59%, 40%, 1);
|
|
2704
|
+
|
|
2705
|
+
/* Secondary button */
|
|
2706
|
+
--ck-ai-button-secondary-color: hsla(263, 59%, 52%, 1);
|
|
2707
|
+
--ck-ai-button-secondary-disabled-color: hsla(263, 59%, 52%, 0.5);
|
|
2708
|
+
--ck-ai-button-secondary-background-color: hsla(0, 0%, 100%, 1);
|
|
2709
|
+
--ck-ai-button-secondary-disabled-background-color: hsla(0, 0%, 100%, 0.5);
|
|
2710
|
+
--ck-ai-button-secondary-border-color: hsla(262, 51%, 80%, 1);
|
|
2711
|
+
--ck-ai-button-secondary-disabled-border-color: hsla(262, 51%, 80%, 0.5);
|
|
2712
|
+
--ck-ai-button-secondary-hover-background-color: hsla(262, 100%, 96%, 1);
|
|
2713
|
+
--ck-ai-button-secondary-active-background-color: hsla(262, 100%, 96%, 1);
|
|
2714
|
+
}
|
|
2715
|
+
|
|
2716
|
+
.ck.ai-balloon {
|
|
2717
|
+
--ck-ai-balloon-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
2718
|
+
--ck-ai-balloon-disclaimer-text-color: hsla(0, 0%, 44%, 1);
|
|
2719
|
+
}
|
|
2720
|
+
|
|
2721
|
+
.ck.ai-balloon .ck-dialog__content {
|
|
2722
|
+
width: 580px;
|
|
2723
|
+
padding: var(--ck-spacing-large);
|
|
2724
|
+
}
|
|
2725
|
+
|
|
2726
|
+
.ck.ai-balloon .ck-ai-suggestion__header {
|
|
2727
|
+
display: none
|
|
2728
|
+
}
|
|
2729
|
+
|
|
2730
|
+
.ck.ai-balloon .ck.ck-ai-balloon__toolbar {
|
|
2731
|
+
border: none;
|
|
2732
|
+
padding: 0;
|
|
2733
|
+
margin-top: var(--ck-spacing-medium);
|
|
2734
|
+
margin-bottom: 0;
|
|
2735
|
+
}
|
|
2736
|
+
|
|
2737
|
+
.ck.ai-balloon .ck.ck-ai-balloon__toolbar .ck-button_with-text {
|
|
2738
|
+
margin-bottom: 0;
|
|
2739
|
+
margin-top: 0;
|
|
2740
|
+
}
|
|
2741
|
+
|
|
2742
|
+
.ck.ai-balloon .ck-ai-balloon__disclaimer {
|
|
2743
|
+
margin-top: var(--ck-spacing-medium);
|
|
2744
|
+
}
|
|
2745
|
+
|
|
2746
|
+
.ck.ai-balloon .ck-ai-balloon__disclaimer .ck-ai-balloon__disclaimer-content {
|
|
2747
|
+
color: var(--ck-ai-balloon-disclaimer-text-color);
|
|
2748
|
+
font-size: 0.75em;
|
|
2749
|
+
line-height: 1.025em;
|
|
2750
|
+
text-align: left;
|
|
2751
|
+
word-break: normal;
|
|
2752
|
+
text-wrap: auto;
|
|
2753
|
+
}
|
|
2754
|
+
|
|
2755
|
+
.ck.ai-balloon .ck-ai-suggestion__body {
|
|
2756
|
+
height: 150px;
|
|
2757
|
+
word-break: normal;
|
|
2758
|
+
text-wrap: auto;
|
|
2759
|
+
overflow-y: auto;
|
|
2760
|
+
}
|
|
2761
|
+
|
|
2762
|
+
.ck.ai-balloon .ck-ai-suggestion__body pre>code {
|
|
2763
|
+
white-space: pre-wrap;
|
|
2764
|
+
}
|
|
2765
|
+
|
|
2766
|
+
.ck.ai-balloon .ck-ai-suggestion__changes {
|
|
2767
|
+
height: 150px;
|
|
2768
|
+
overflow-y: auto;
|
|
2769
|
+
}
|
|
2770
|
+
|
|
2771
|
+
.ck.ai-balloon * {
|
|
2772
|
+
font-family: var(--ck-ai-balloon-font-family) !important;
|
|
2773
|
+
}
|
|
2774
|
+
|
|
2775
|
+
.ck.ai-balloon .ck-ai-suggestion__changes *,
|
|
2776
|
+
.ck.ai-balloon .ck-ai-suggestion__body *,
|
|
2777
|
+
.ck.ai-balloon .ck-ai-suggestion__change * {
|
|
2778
|
+
white-space: normal;
|
|
2779
|
+
line-height: 1.4em;
|
|
2780
|
+
}
|
|
2781
|
+
|
|
2782
|
+
.ck.ai-balloon-rotator .ck.ck-form__header {
|
|
2783
|
+
justify-content: center;
|
|
2784
|
+
position: relative;
|
|
2785
|
+
}
|
|
2786
|
+
|
|
2787
|
+
.ck.ai-balloon-rotator .ck.ck-form__header h2.ck.ck-form__header__label {
|
|
2788
|
+
flex-grow: 0;
|
|
2789
|
+
}
|
|
2790
|
+
|
|
2791
|
+
.ck.ai-balloon-rotator .ck.ck-form__header button.ck-button {
|
|
2792
|
+
margin-right: var(--ck-spacing-large);
|
|
2793
|
+
margin-left: var(--ck-spacing-large);
|
|
2794
|
+
}
|
|
2795
|
+
|
|
2796
|
+
.ck.ai-balloon-rotator .ck.ck-form__header .ck-button:last-child {
|
|
2797
|
+
position: absolute;
|
|
2798
|
+
right: var(--ck-spacing-large);
|
|
2799
|
+
}
|
|
2800
|
+
|
|
2801
|
+
.ck.ai-balloon-rotator::after {
|
|
2802
|
+
content: "";
|
|
2803
|
+
position: absolute;
|
|
2804
|
+
top: 8px;
|
|
2805
|
+
left: 8px;
|
|
2806
|
+
width: 100%;
|
|
2807
|
+
height: 100%;
|
|
2808
|
+
background: var(--ck-color-dialog-background);
|
|
2809
|
+
z-index: -1;
|
|
2810
|
+
border-radius: var(--ck-border-radius);
|
|
2811
|
+
box-shadow: var(--ck-drop-shadow), 0 0;
|
|
2812
|
+
border: 1px solid var(--ck-color-base-border);
|
|
2813
|
+
}
|
|
2814
|
+
|
|
2815
|
+
/* Buttons styles will be removed after shared code is merged. */
|
|
2816
|
+
.ck.ck-button.ck-ai-button-primary {
|
|
2817
|
+
color: var(--ck-ai-button-primary-color);
|
|
2818
|
+
background-color: var(--ck-ai-button-primary-background-color);
|
|
2819
|
+
border: none;
|
|
2820
|
+
}
|
|
2821
|
+
.ck.ck-button.ck-ai-button-primary:hover {
|
|
2822
|
+
background-color: var(--ck-ai-button-primary-hover-background-color);
|
|
2823
|
+
}
|
|
2824
|
+
.ck.ck-button.ck-ai-button-primary:disabled {
|
|
2825
|
+
color: var(--ck-ai-button-primary-disabled-color);
|
|
2826
|
+
background-color: var(--ck-ai-button-primary-disabled-background-color);
|
|
2827
|
+
cursor: not-allowed;
|
|
2828
|
+
}
|
|
2829
|
+
.ck.ck-button.ck-ai-button-secondary {
|
|
2830
|
+
color: var(--ck-ai-button-secondary-color);
|
|
2831
|
+
background-color: var(--ck-ai-button-secondary-background-color);
|
|
2832
|
+
border: 1px solid var(--ck-ai-button-secondary-border-color);
|
|
2833
|
+
}
|
|
2834
|
+
.ck.ck-button.ck-ai-button-secondary:hover {
|
|
2835
|
+
background-color: var(--ck-ai-button-secondary-hover-background-color);
|
|
2836
|
+
}
|
|
2837
|
+
.ck.ck-button.ck-ai-button-secondary:active,
|
|
2838
|
+
.ck.ck-button.ck-ai-button-secondary.ck-on {
|
|
2839
|
+
background-color: var(--ck-ai-button-secondary-active-background-color);
|
|
2840
|
+
}
|
|
2841
|
+
.ck.ck-button.ck-ai-button-secondary:disabled {
|
|
2842
|
+
color: var(--ck-ai-button-secondary-disabled-color);
|
|
2843
|
+
background-color: var(--ck-ai-button-secondary-disabled-background-color);
|
|
2844
|
+
border: 1px solid var(--ck-ai-button-secondary-disabled-border-color);
|
|
2845
|
+
cursor: not-allowed;
|
|
2846
|
+
}
|
|
2847
|
+
|
|
2848
|
+
.ck-ai-suggestion__container .ck.ck-ai-suggestion__loader {
|
|
2849
|
+
padding: var(--ck-spacing-large) !important;
|
|
2850
|
+
height: 150px;
|
|
2851
|
+
}
|
|
2852
|
+
|
|
2853
|
+
.ck-ai-suggestion__container .ck.ck-ai-suggestion__loader .ck.ck-spinner-container.ck-ai-spinner .ck-spinner {
|
|
2854
|
+
--ck-ai-spinner-size: 18px;
|
|
2855
|
+
}
|
|
2856
|
+
|
|
2857
|
+
.ck-ai-suggestion__container .ck.ck-ai-suggestion__loader .ck.ck-spinner-container.ck-ai-spinner.ck-ai-spinner_small {
|
|
2858
|
+
--ck-ai-spinner-size: 18px;
|
|
2859
|
+
}
|
|
2860
|
+
|
|
2861
|
+
.ck-ai-suggestion__container .ck.ck-ai-suggestion__loader .ck-ai-suggestion__loader-text {
|
|
2862
|
+
margin-left: var(--ck-spacing-medium);
|
|
2863
|
+
}
|
|
2864
|
+
|
|
2865
|
+
/*
|
|
2866
|
+
* Classes used by the "fake visual selection" displayed in the content
|
|
2867
|
+
* when the AI Balloon is open.
|
|
2868
|
+
*
|
|
2869
|
+
* Narrow down to <span> to prevent changing background for widgets and nested editables.
|
|
2870
|
+
*/
|
|
2871
|
+
.ck span.ck-fake-ai-selection {
|
|
2872
|
+
background: var(--ck-color-ai-selection);
|
|
2873
|
+
}
|
|
2874
|
+
|
|
2875
|
+
.ck .ck-widget.ck-fake-ai-selection {
|
|
2876
|
+
outline-color: var(--ck-color-ai-selection);
|
|
2877
|
+
}
|
|
2878
|
+
|
|
2879
|
+
.ck.ck-dialog-overlay:has(.ai-balloon) {
|
|
2880
|
+
z-index: 998;
|
|
2881
|
+
}
|
|
2882
|
+
/*
|
|
2883
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
2884
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
2885
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
2886
|
+
*
|
|
2887
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
2888
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
2889
|
+
*/
|
|
2890
|
+
|
|
2891
|
+
:root {
|
|
2892
|
+
--ck-ai-check-list-item-hover-border-color: hsla(262, 64%, 78%, 1);
|
|
2893
|
+
--ck-ai-check-list-item-active-border-color: hsla(263, 59%, 52%, 1);
|
|
2894
|
+
--ck-ai-check-list-item-title-color: var(--ck-color-text);
|
|
2895
|
+
--ck-ai-check-list-item-description-color: hsla(0, 0%, 44%, 1);
|
|
2896
|
+
--ck-ai-check-list-item-title-icon-color: hsla(0, 0%, 44%, 1);
|
|
2897
|
+
--ck-ai-check-list-model-dropdown-width: 426px;
|
|
2898
|
+
--ck-ai-check-list-model-dropdown-max-height: 340px;
|
|
2899
|
+
--ck-ai-check-list-model-dropdown-arrow-drop-shadow: 0 -2px 0px var(--ck-color-shadow-drop);
|
|
2900
|
+
}
|
|
2901
|
+
|
|
2902
|
+
.ck.ck-ai-review-mode * {
|
|
2903
|
+
font-family: var(--ck-ai-chat-font-family) !important;
|
|
2904
|
+
}
|
|
2905
|
+
|
|
2906
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list {
|
|
2907
|
+
position: relative;
|
|
2908
|
+
height: 100%;
|
|
2909
|
+
overflow: auto;
|
|
2910
|
+
}
|
|
2911
|
+
|
|
2912
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item {
|
|
2913
|
+
padding: var(--ck-spacing-extra-large) var(--ck-spacing-large);
|
|
2914
|
+
border-bottom: 1px solid var(--ck-color-base-border);
|
|
2915
|
+
box-shadow: 3px 0px 0px 0px transparent inset;
|
|
2916
|
+
opacity: 0;
|
|
2917
|
+
visibility: hidden;
|
|
2918
|
+
|
|
2919
|
+
transition: box-shadow 0.3s ease-in-out;
|
|
2920
|
+
}
|
|
2921
|
+
|
|
2922
|
+
@media (prefers-reduced-motion: reduce) {
|
|
2923
|
+
|
|
2924
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item {
|
|
2925
|
+
transition-duration: 0s;
|
|
2926
|
+
}
|
|
2927
|
+
}
|
|
2928
|
+
|
|
2929
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-description {
|
|
2930
|
+
color: var(--ck-ai-check-list-item-description-color);
|
|
2931
|
+
}
|
|
2932
|
+
|
|
2933
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-title-text,
|
|
2934
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-description {
|
|
2935
|
+
white-space: normal;
|
|
2936
|
+
line-height: 1.3;
|
|
2937
|
+
}
|
|
2938
|
+
|
|
2939
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item:hover {
|
|
2940
|
+
cursor: pointer;
|
|
2941
|
+
}
|
|
2942
|
+
|
|
2943
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item:hover .ck-ai-review-mode__check-list-item-title-text,
|
|
2944
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item:hover .ck-ai-review-mode__check-list-item-description {
|
|
2945
|
+
cursor: pointer;
|
|
2946
|
+
}
|
|
2947
|
+
|
|
2948
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item.ck-ai-review-mode__check-list-item_rendered {
|
|
2949
|
+
opacity: 1;
|
|
2950
|
+
visibility: visible;
|
|
2951
|
+
|
|
2952
|
+
transition: box-shadow 0.3s ease-in-out,
|
|
2953
|
+
opacity 0.1s calc(0.05s * var(--ck-ai-check-list-item-index)),
|
|
2954
|
+
visibility 0.1s calc(0.05s * var(--ck-ai-check-list-item-index));
|
|
2955
|
+
}
|
|
2956
|
+
|
|
2957
|
+
@media (prefers-reduced-motion: reduce) {
|
|
2958
|
+
|
|
2959
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item.ck-ai-review-mode__check-list-item_rendered {
|
|
2960
|
+
opacity: 1;
|
|
2961
|
+
visibility: visible;
|
|
2962
|
+
}
|
|
2963
|
+
}
|
|
2964
|
+
|
|
2965
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item.ck-ai-review-mode__check-list-item_selected {
|
|
2966
|
+
box-shadow: 3px 0px 0px 0px var(--ck-ai-check-list-item-active-border-color) inset;
|
|
2967
|
+
}
|
|
2968
|
+
|
|
2969
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-title {
|
|
2970
|
+
display: flex;
|
|
2971
|
+
justify-content: space-between;
|
|
2972
|
+
margin-block-end: var(--ck-spacing-tiny);
|
|
2973
|
+
}
|
|
2974
|
+
|
|
2975
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-title > .ck-ai-review-mode__check-list-item-title-text {
|
|
2976
|
+
flex-grow: 1;
|
|
2977
|
+
color: var(--ck-ai-check-list-item-title-color);
|
|
2978
|
+
font-weight: 700;
|
|
2979
|
+
}
|
|
2980
|
+
|
|
2981
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-title > .ck.ck-icon.ck-ai-review-mode__check-list-item-title-icon {
|
|
2982
|
+
--ck-icon-size: 20px;
|
|
2983
|
+
|
|
2984
|
+
flex-shrink: 0;
|
|
2985
|
+
margin-inline-start: var(--ck-spacing-small);
|
|
2986
|
+
color: var(--ck-ai-check-list-item-title-icon-color);
|
|
2987
|
+
|
|
2988
|
+
opacity: 0;
|
|
2989
|
+
visibility: hidden;
|
|
2990
|
+
|
|
2991
|
+
transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
|
|
2992
|
+
}
|
|
2993
|
+
|
|
2994
|
+
@media (prefers-reduced-motion: reduce) {
|
|
2995
|
+
|
|
2996
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-title > .ck.ck-icon.ck-ai-review-mode__check-list-item-title-icon {
|
|
2997
|
+
transition-duration: 0s;
|
|
2998
|
+
}
|
|
2999
|
+
}
|
|
3000
|
+
|
|
3001
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item:not(.ck-ai-review-mode__check-list-item_selected):hover {
|
|
3002
|
+
box-shadow: 3px 0px 0px 0px var(--ck-ai-check-list-item-hover-border-color) inset;
|
|
3003
|
+
}
|
|
3004
|
+
|
|
3005
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item:not(.ck-ai-review-mode__check-list-item_selected):hover .ck-ai-review-mode__check-list-item-title > .ck.ck-icon.ck-ai-review-mode__check-list-item-title-icon {
|
|
3006
|
+
opacity: 1;
|
|
3007
|
+
visibility: visible;
|
|
3008
|
+
}
|
|
3009
|
+
|
|
3010
|
+
/* Parameterized form view. */
|
|
3011
|
+
|
|
3012
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-parameterized .ck.ck-form__row {
|
|
3013
|
+
padding-left: 0;
|
|
3014
|
+
padding-right: 0;
|
|
3015
|
+
}
|
|
3016
|
+
|
|
3017
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-parameterized .ck.ck-form__row > .ck.ck-ai-review-mode__check-list-item-parameterized-form-element {
|
|
3018
|
+
flex: 1;
|
|
3019
|
+
}
|
|
3020
|
+
|
|
3021
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-parameterized .ck.ck-form__row > .ck.ck-ai-review-mode__check-list-item-parameterized-form-element > *:first-child {
|
|
3022
|
+
width: 100%;
|
|
3023
|
+
}
|
|
3024
|
+
|
|
3025
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-parameterized .ck.ck-form__row > .ck.ck-ai-review-mode__check-list-item-parameterized-form-element.ck-ai-review-mode__check-list-item-parameterized-form-element_dropdown .ck-button.ck-dropdown__button {
|
|
3026
|
+
border-color: hsl(216, 5%, 81%);
|
|
3027
|
+
}
|
|
3028
|
+
|
|
3029
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-parameterized .ck.ck-form__row > .ck.ck-ai-review-mode__check-list-item-parameterized-form-element.ck-ai-review-mode__check-list-item-parameterized-form-element_dropdown .ck-button.ck-dropdown__button > .ck-button__label {
|
|
3030
|
+
width: 100%;
|
|
3031
|
+
}
|
|
3032
|
+
|
|
3033
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-parameterized .ck.ck-form__row .ck.ck-button {
|
|
3034
|
+
flex-shrink: 0;
|
|
3035
|
+
}
|
|
3036
|
+
|
|
3037
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-custom-actions .ck.ck-form__row .ck.ck-input.ck-textarea.ck-review-mode__prompt-input {
|
|
3038
|
+
width: 100%;
|
|
3039
|
+
}
|
|
3040
|
+
|
|
3041
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-custom-actions .ck.ck-form__row .ck-ai-review-mode__check-list-item-custom-actions-footer {
|
|
3042
|
+
display: flex;
|
|
3043
|
+
width: 100%;
|
|
3044
|
+
align-items: center;
|
|
3045
|
+
justify-content: space-between;
|
|
3046
|
+
}
|
|
3047
|
+
|
|
3048
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-custom-actions .ck.ck-form__row .ck-ai-review-mode__check-list-item-custom-actions-footer .ck-ai-review-mode__check-list-item-parameterized-custom-actions-buttons {
|
|
3049
|
+
display: flex;
|
|
3050
|
+
gap: var(--ck-spacing-small);
|
|
3051
|
+
}
|
|
3052
|
+
|
|
3053
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown > .ck.ck-button.ck-dropdown__button {
|
|
3054
|
+
font-size: .9em;
|
|
3055
|
+
}
|
|
3056
|
+
|
|
3057
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown > .ck.ck-button.ck-dropdown__button.ck-on,
|
|
3058
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown > .ck.ck-button.ck-dropdown__button:active {
|
|
3059
|
+
background-color: var(--ck-ai-button-secondary-active-background-color);
|
|
3060
|
+
color: var(--ck-ai-background-color-action-button);
|
|
3061
|
+
}
|
|
3062
|
+
|
|
3063
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown > .ck.ck-button.ck-dropdown__button > .ck.ck-button__label {
|
|
3064
|
+
width: auto;
|
|
3065
|
+
}
|
|
3066
|
+
|
|
3067
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel {
|
|
3068
|
+
width: var(--ck-ai-check-list-model-dropdown-width);
|
|
3069
|
+
padding-top: var(--ck-spacing-standard);
|
|
3070
|
+
top: calc(100% + var(--ck-balloon-arrow-height));
|
|
3071
|
+
bottom: auto;
|
|
3072
|
+
}
|
|
3073
|
+
|
|
3074
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel.ck-dropdown__panel_se::before,
|
|
3075
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel.ck-dropdown__panel_se::after {
|
|
3076
|
+
content: '';
|
|
3077
|
+
position: absolute;
|
|
3078
|
+
left: calc(2 * var(--ck-balloon-arrow-half-width));
|
|
3079
|
+
top: calc(-1 * var(--ck-balloon-arrow-height) + 2px);
|
|
3080
|
+
width: 0;
|
|
3081
|
+
height: 0;
|
|
3082
|
+
border-style: solid;
|
|
3083
|
+
border-width: 0 var(--ck-balloon-arrow-height) var(--ck-balloon-arrow-half-width) var(--ck-balloon-arrow-half-width);
|
|
3084
|
+
border-color: transparent transparent var(--ck-color-panel-background) transparent;
|
|
3085
|
+
}
|
|
3086
|
+
|
|
3087
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel.ck-dropdown__panel_se::before {
|
|
3088
|
+
z-index: var(--ck-balloon-panel-arrow-z-index);
|
|
3089
|
+
margin-bottom: calc(-1 * var(--ck-balloon-border-width));
|
|
3090
|
+
filter: drop-shadow(var(--ck-ai-check-list-model-dropdown-arrow-drop-shadow));
|
|
3091
|
+
}
|
|
3092
|
+
|
|
3093
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel.ck-dropdown__panel_se::after {
|
|
3094
|
+
z-index: calc(var(--ck-balloon-panel-arrow-z-index) + 1);
|
|
3095
|
+
margin-bottom: calc(var(--ck-balloon-arrow-offset) - var(--ck-balloon-border-width));
|
|
3096
|
+
}
|
|
3097
|
+
|
|
3098
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel.ck-dropdown__panel_se > .ck-list {
|
|
3099
|
+
max-height: var(--ck-ai-check-list-model-dropdown-max-height);
|
|
3100
|
+
overflow-y: scroll;
|
|
3101
|
+
}
|
|
3102
|
+
|
|
3103
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel > .ck.ck-list {
|
|
3104
|
+
gap: var(--ck-spacing-standard);
|
|
3105
|
+
}
|
|
3106
|
+
|
|
3107
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel > .ck.ck-list > .ck.ck-list__item > .ck.ck-button.ck-list-item-button {
|
|
3108
|
+
align-items: baseline;
|
|
3109
|
+
}
|
|
3110
|
+
|
|
3111
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel > .ck.ck-list > .ck.ck-list__item > .ck.ck-button.ck-list-item-button .ck-list-item-button__check-holder {
|
|
3112
|
+
flex-shrink: 0;
|
|
3113
|
+
}
|
|
3114
|
+
|
|
3115
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel > .ck.ck-list > .ck.ck-list__item > .ck.ck-button.ck-list-item-button .ck-ai-review-mode__check-list-item-model-dropdown-name {
|
|
3116
|
+
line-height: 1.3;
|
|
3117
|
+
font-weight: 500;
|
|
3118
|
+
}
|
|
3119
|
+
|
|
3120
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel > .ck.ck-list > .ck.ck-list__item > .ck.ck-button.ck-list-item-button .ck-ai-review-mode__check-list-item-model-dropdown-description {
|
|
3121
|
+
padding-top: var(--ck-spacing-tiny);
|
|
3122
|
+
line-height: 1.3;
|
|
3123
|
+
}
|
|
3124
|
+
|
|
3125
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-list > .ck-ai-review-mode__check-list-item .ck-ai-review-mode__check-list-item-model-dropdown .ck-dropdown__panel > .ck.ck-list > .ck.ck-list__item > .ck.ck-button.ck-list-item-button .ck-ai-review-mode__check-list-item-model-dropdown-description > span {
|
|
3126
|
+
color: var(--ck-ai-chat-color-icon);
|
|
3127
|
+
line-height: 1;
|
|
3128
|
+
white-space: normal;
|
|
3129
|
+
}
|
|
3130
|
+
|
|
3131
|
+
/*
|
|
3132
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
3133
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
3134
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
3135
|
+
*
|
|
3136
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
3137
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
3138
|
+
*/
|
|
3139
|
+
|
|
3140
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run {
|
|
3141
|
+
position: relative;
|
|
3142
|
+
height: 100%;
|
|
3143
|
+
overflow: auto;
|
|
3144
|
+
display: flex;
|
|
3145
|
+
flex-direction: column;
|
|
3146
|
+
}
|
|
3147
|
+
|
|
3148
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run:has( .ck-ai-review-mode__check-run-skeleton-container:not(.ck-hidden) ) {
|
|
3149
|
+
overflow: hidden;
|
|
3150
|
+
}
|
|
3151
|
+
|
|
3152
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result {
|
|
3153
|
+
opacity: 0;
|
|
3154
|
+
visibility: hidden;
|
|
3155
|
+
box-shadow: 3px 0px 0px 0px transparent inset;
|
|
3156
|
+
padding: var(--ck-spacing-extra-large) var(--ck-spacing-large);
|
|
3157
|
+
|
|
3158
|
+
animation: ck-ai-check-run-list-item-show 0.25s 0.1s forwards;
|
|
3159
|
+
|
|
3160
|
+
transition: box-shadow 0.3s ease-in-out;
|
|
3161
|
+
transition-behavior: allow-discrete;
|
|
3162
|
+
}
|
|
3163
|
+
|
|
3164
|
+
@media (prefers-reduced-motion: reduce) {
|
|
3165
|
+
|
|
3166
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result {
|
|
3167
|
+
animation: none;
|
|
3168
|
+
opacity: 1;
|
|
3169
|
+
visibility: visible;
|
|
3170
|
+
transition-duration: 0s;
|
|
3171
|
+
}
|
|
3172
|
+
}
|
|
3173
|
+
|
|
3174
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result:not(:first-child) {
|
|
3175
|
+
border-top: 1px solid var(--ck-color-base-border);
|
|
3176
|
+
}
|
|
3177
|
+
|
|
3178
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result:last-child {
|
|
3179
|
+
border-bottom: 1px solid var(--ck-color-base-border);
|
|
3180
|
+
}
|
|
3181
|
+
|
|
3182
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result .ck-suggestion-marker {
|
|
3183
|
+
white-space: break-spaces;
|
|
3184
|
+
}
|
|
3185
|
+
|
|
3186
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result:hover {
|
|
3187
|
+
box-shadow: 3px 0px 0px 0px var(--ck-ai-check-list-item-hover-border-color) inset;
|
|
3188
|
+
}
|
|
3189
|
+
|
|
3190
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result.ck-ai-review-mode__check-run-result_active {
|
|
3191
|
+
box-shadow: 3px 0px 0px 0px var(--ck-ai-check-list-item-active-border-color) inset;
|
|
3192
|
+
}
|
|
3193
|
+
|
|
3194
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result > .ck-ai-review-mode__check-run-result-response {
|
|
3195
|
+
overflow: hidden;
|
|
3196
|
+
}
|
|
3197
|
+
|
|
3198
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result > .ck-ai-review-mode__check-run-result-response > * {
|
|
3199
|
+
white-space: normal;
|
|
3200
|
+
}
|
|
3201
|
+
|
|
3202
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result > .ck-ai-review-mode__check-run-result-response img {
|
|
3203
|
+
max-width: 125px;
|
|
3204
|
+
max-height: 125px;
|
|
3205
|
+
}
|
|
3206
|
+
|
|
3207
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result > .ck-ai-review-mode__check-run-result-footer {
|
|
3208
|
+
margin-top: var(--ck-spacing-standard);
|
|
3209
|
+
display: flex;
|
|
3210
|
+
justify-content: space-between;
|
|
3211
|
+
align-items: center;
|
|
3212
|
+
gap: var(--ck-spacing-standard);
|
|
3213
|
+
}
|
|
3214
|
+
|
|
3215
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result > .ck-ai-review-mode__check-run-result-footer > .ck-ai-review-mode__check-run-result-action-buttons {
|
|
3216
|
+
display: flex;
|
|
3217
|
+
gap: var(--ck-spacing-standard);
|
|
3218
|
+
flex-grow: 1;
|
|
3219
|
+
}
|
|
3220
|
+
|
|
3221
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result > .ck-ai-review-mode__check-run-result-footer .ck.ck-button.ck-ai-review-mode__check-run-result-info-button {
|
|
3222
|
+
--ck-icon-size: 16px;
|
|
3223
|
+
--ck-ui-component-min-height: 1.75em;
|
|
3224
|
+
|
|
3225
|
+
max-height: var(--ck-ui-component-min-height);
|
|
3226
|
+
margin-left: auto;
|
|
3227
|
+
}
|
|
3228
|
+
|
|
3229
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-result.ck-ai-review-mode__check-run-result_removing {
|
|
3230
|
+
animation: ck-ai-check-run-item-remove 0.2s forwards;
|
|
3231
|
+
}
|
|
3232
|
+
|
|
3233
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-results-header {
|
|
3234
|
+
display: flex;
|
|
3235
|
+
justify-content: space-between;
|
|
3236
|
+
align-items: center;
|
|
3237
|
+
gap: var(--ck-spacing-standard);
|
|
3238
|
+
|
|
3239
|
+
padding: var(--ck-spacing-extra-large) var(--ck-spacing-large);
|
|
3240
|
+
border-bottom: 1px solid var(--ck-color-base-border);
|
|
3241
|
+
}
|
|
3242
|
+
|
|
3243
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-results-header .ck-ai-review-mode__check-run-results-header-title {
|
|
3244
|
+
align-self: center;
|
|
3245
|
+
font-weight: bold;
|
|
3246
|
+
white-space: nowrap;
|
|
3247
|
+
overflow: hidden;
|
|
3248
|
+
max-width: 100%;
|
|
3249
|
+
text-overflow: ellipsis;
|
|
3250
|
+
}
|
|
3251
|
+
|
|
3252
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-results-header .ck-ai-review-mode__check-run-results-header-buttons {
|
|
3253
|
+
display: flex;
|
|
3254
|
+
gap: var(--ck-spacing-standard);
|
|
3255
|
+
flex-shrink: 0;
|
|
3256
|
+
align-items: center;
|
|
3257
|
+
/* To prevent jumping when visibility of buttons is changing.
|
|
3258
|
+
TODO: probably it will be replaced with different loader UI. */
|
|
3259
|
+
min-height: 30px;
|
|
3260
|
+
}
|
|
3261
|
+
|
|
3262
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-results-wrapper {
|
|
3263
|
+
position: relative;
|
|
3264
|
+
height: 100%;
|
|
3265
|
+
overflow: auto;
|
|
3266
|
+
}
|
|
3267
|
+
|
|
3268
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-results-wrapper:has( .ck-ai-review-mode__check-run-skeleton-container:not(.ck-hidden) ) {
|
|
3269
|
+
overflow: hidden;
|
|
3270
|
+
}
|
|
3271
|
+
|
|
3272
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-skeleton-container {
|
|
3273
|
+
position: absolute;
|
|
3274
|
+
width: 100%;
|
|
3275
|
+
top: 0;
|
|
3276
|
+
height: 100%;
|
|
3277
|
+
}
|
|
3278
|
+
|
|
3279
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-skeleton-container .ck-ai-review-mode__check-run-skeleton-item {
|
|
3280
|
+
position: static;
|
|
3281
|
+
height: auto;
|
|
3282
|
+
padding: var(--ck-spacing-extra-large) var(--ck-spacing-large);
|
|
3283
|
+
border-bottom: 1px solid var(--ck-color-base-border);
|
|
3284
|
+
}
|
|
3285
|
+
|
|
3286
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-skeleton-container .ck-ai-review-mode__check-run-skeleton-item.ck-ai-skeleton {
|
|
3287
|
+
--ck-ai-skeleton-gap: var(--ck-spacing-small);
|
|
3288
|
+
}
|
|
3289
|
+
|
|
3290
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-error-container {
|
|
3291
|
+
display: flex;
|
|
3292
|
+
flex-direction: column;
|
|
3293
|
+
align-items: flex-end;
|
|
3294
|
+
gap: var(--ck-spacing-medium-small);
|
|
3295
|
+
padding: var(--ck-spacing-large) var(--ck-spacing-large) var(--ck-spacing-standard) var(--ck-spacing-large);
|
|
3296
|
+
}
|
|
3297
|
+
|
|
3298
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-error-container.ck-ai-review-mode__check-run-error-container_border-bottom {
|
|
3299
|
+
border-bottom: 1px solid var(--ck-color-base-border);
|
|
3300
|
+
}
|
|
3301
|
+
|
|
3302
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__check-run .ck-ai-review-mode__check-run-error-container .ck-ai-review-mode__check-run-error-retry-button {
|
|
3303
|
+
font-size: 11.7px;
|
|
3304
|
+
min-height: unset;
|
|
3305
|
+
border: 1px solid var(--ck-ai-border-color-button);
|
|
3306
|
+
border-radius: var(--ck-border-radius);
|
|
3307
|
+
gap: var(--ck-spacing-small);
|
|
3308
|
+
color: var(--ck-ai-chat-color-text);
|
|
3309
|
+
}
|
|
3310
|
+
|
|
3311
|
+
@keyframes ck-ai-check-run-list-item-show {
|
|
3312
|
+
0% {
|
|
3313
|
+
opacity: 0;
|
|
3314
|
+
visibility: hidden;
|
|
3315
|
+
}
|
|
3316
|
+
100% {
|
|
3317
|
+
opacity: 1;
|
|
3318
|
+
visibility: visible;
|
|
3319
|
+
}
|
|
3320
|
+
}
|
|
3321
|
+
|
|
3322
|
+
@keyframes ck-ai-check-run-item-remove {
|
|
3323
|
+
0% {
|
|
3324
|
+
opacity: 1;
|
|
3325
|
+
visibility: visible;
|
|
3326
|
+
display: block;
|
|
3327
|
+
}
|
|
3328
|
+
100% {
|
|
3329
|
+
opacity: 0;
|
|
3330
|
+
visibility: hidden;
|
|
3331
|
+
display: none;
|
|
3332
|
+
}
|
|
3333
|
+
}
|
|
3334
|
+
|
|
3335
|
+
/*
|
|
3336
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
3337
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
3338
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
3339
|
+
*
|
|
3340
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
3341
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
3342
|
+
*/
|
|
3343
|
+
|
|
3344
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__review-completed .ck-ai-review-mode__review-completed-header {
|
|
3345
|
+
display: flex;
|
|
3346
|
+
justify-content: space-between;
|
|
3347
|
+
align-items: center;
|
|
3348
|
+
gap: var(--ck-spacing-standard);
|
|
3349
|
+
|
|
3350
|
+
padding: var(--ck-spacing-extra-large) var(--ck-spacing-large);
|
|
3351
|
+
border-bottom: 1px solid var(--ck-color-base-border);
|
|
3352
|
+
}
|
|
3353
|
+
|
|
3354
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__review-completed .ck-ai-review-mode__review-completed-header .ck-ai-review-mode__review-completed-header-title {
|
|
3355
|
+
align-self: center;
|
|
3356
|
+
white-space: nowrap;
|
|
3357
|
+
overflow: hidden;
|
|
3358
|
+
max-width: 100%;
|
|
3359
|
+
text-overflow: ellipsis;
|
|
3360
|
+
}
|
|
3361
|
+
|
|
3362
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__review-completed .ck-ai-review-mode__review-completed-header .ck-ai-review-mode__review-completed-header-buttons {
|
|
3363
|
+
display: flex;
|
|
3364
|
+
gap: var(--ck-spacing-standard);
|
|
3365
|
+
flex-shrink: 0;
|
|
3366
|
+
}
|
|
3367
|
+
|
|
3368
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__review-completed .ck-ai-review-mode__review-completed-content {
|
|
3369
|
+
padding: var(--ck-spacing-extra-large) var(--ck-spacing-extra-large) 0 var(--ck-spacing-extra-large);
|
|
3370
|
+
text-align: center;
|
|
3371
|
+
}
|
|
3372
|
+
|
|
3373
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__review-completed .ck-ai-review-mode__review-completed-content .ck-ai-review-mode__review-completed-content-icon {
|
|
3374
|
+
font-size: 20px;
|
|
3375
|
+
line-height: 20px;
|
|
3376
|
+
}
|
|
3377
|
+
|
|
3378
|
+
.ck.ck-ai-review-mode .ck-ai-review-mode__review-completed .ck-ai-review-mode__review-completed-content .ck-ai-review-mode__review-completed-content-text {
|
|
3379
|
+
margin-top: var(--ck-spacing-large);
|
|
3380
|
+
text-align: center;
|
|
3381
|
+
white-space: normal;
|
|
3382
|
+
}
|
|
3383
|
+
|
|
3384
|
+
/*
|
|
3385
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
3386
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
3387
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
3388
|
+
*
|
|
3389
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
3390
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
3391
|
+
*/
|
|
3392
|
+
|
|
3393
|
+
/*
|
|
3394
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
3395
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
3396
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
3397
|
+
*
|
|
3398
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
3399
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
3400
|
+
*/
|
|
3401
|
+
|
|
3402
|
+
.ck-ai-header {
|
|
3403
|
+
/* Custom values unlike the rest of editor UI. */
|
|
3404
|
+
--ck-ui-component-min-height: 1.7em;
|
|
3405
|
+
--ck-ui-component-min-width: 1.7em;
|
|
3406
|
+
|
|
3407
|
+
/* Custom value. It defaults to the toolbar component height so they look fine on next to each other. */
|
|
3408
|
+
--ck-form-header-height: 3em;
|
|
3409
|
+
--ck-form-header-small-icon-color: hsla(0, 0%, 20%, 1);
|
|
3410
|
+
}
|
|
3411
|
+
|
|
3412
|
+
.ck-ai-header > .ck-button {
|
|
3413
|
+
margin-inline-start: var(--ck-spacing-standard);
|
|
3414
|
+
}
|
|
3415
|
+
|
|
3416
|
+
.ck-ai-header > .ck-button > .ck-button__icon {
|
|
3417
|
+
/* Custom value unlike the rest of editor UI (defaults to 16px). See how it's used in the icon.css */
|
|
3418
|
+
--ck-icon-font-size: .666em;
|
|
3419
|
+
|
|
3420
|
+
color: var(--ck-ai-chat-color-icon);
|
|
3421
|
+
}
|
|
3422
|
+
|
|
3423
|
+
.ck-ai-header > .ck.ck-button.ck-ai-chat__start-conversation {
|
|
3424
|
+
/* Custom value unlike the rest of editor UI (derived from --ck-font-size-base, defaults to 13px). */
|
|
3425
|
+
font-size: 11.7px;
|
|
3426
|
+
min-height: unset;
|
|
3427
|
+
border: 1px solid var(--ck-ai-border-color-button);
|
|
3428
|
+
border-radius: var(--ck-border-radius);
|
|
3429
|
+
gap: var(--ck-spacing-small);
|
|
3430
|
+
color: var(--ck-ai-chat-color-text);
|
|
3431
|
+
}
|
|
3432
|
+
|
|
3433
|
+
.ck-ai-header > .ck.ck-button.ck-ai-chat__start-conversation:hover {
|
|
3434
|
+
background-color: var(--ck-ai-chat-button-active-background-color);
|
|
3435
|
+
}
|
|
3436
|
+
|
|
3437
|
+
.ck-ai-header > .ck.ck-button.ck-ai-chat__start-conversation > .ck-button__label {
|
|
3438
|
+
/* Custom value unlike the rest of editor UI. */
|
|
3439
|
+
line-height: 1.4em;
|
|
3440
|
+
}
|
|
3441
|
+
|
|
3442
|
+
.ck-ai-header > .ck.ck-button.ck-ai-chat__start-conversation > .ck-button__icon {
|
|
3443
|
+
/* Custom value unlike the rest of editor UI (defaults to 14px). See how it's used in the icon.css */
|
|
3444
|
+
--ck-icon-font-size: .632em;
|
|
3445
|
+
|
|
3446
|
+
margin-inline-end: 0;
|
|
3447
|
+
color: var(--ck-ai-chat-color-text);
|
|
3448
|
+
}
|
|
3449
|
+
|
|
3450
|
+
.ck-ai-header > .ck.ck-button.ck-ai-chat__start-conversation > span.ck-button__label {
|
|
3451
|
+
position: relative;
|
|
3452
|
+
top: 1px;
|
|
3453
|
+
}
|
|
3454
|
+
|
|
3455
|
+
.ck-ai-header.ck-ai-header_small > .ck.ck-button.ck-button-back {
|
|
3456
|
+
margin-inline-start: 0;
|
|
3457
|
+
margin-inline-end: var(--ck-spacing-small);
|
|
3458
|
+
}
|
|
3459
|
+
|
|
3460
|
+
.ck-ai-header.ck-ai-header_small > .ck.ck-button.ck-button-back > .ck-button__icon {
|
|
3461
|
+
/* Custom value unlike the rest of editor UI (defaults to 16px). See how it's used in the icon.css */
|
|
3462
|
+
--ck-icon-font-size: 13px;
|
|
3463
|
+
|
|
3464
|
+
color: var(--ck-form-header-small-icon-color);
|
|
3465
|
+
}
|
|
3466
|
+
|
|
3467
|
+
.ck-ai-header.ck-ai-header_small .ck-form__header__label {
|
|
3468
|
+
--ck-font-size-base: 13px;
|
|
3469
|
+
--ck-font-face: var(--ck-ai-chat-font-family);
|
|
3470
|
+
|
|
3471
|
+
font-weight: 500;
|
|
3472
|
+
}
|
|
3473
|
+
|
|
3474
|
+
.ck-ai-header .ck-form__header__label:not(:last-child) {
|
|
3475
|
+
margin-inline-end: var(--ck-spacing-small);
|
|
3476
|
+
}
|
|
3477
|
+
|
|
3478
|
+
.ck {
|
|
3479
|
+
--ck-color-ai-review-mode-suggestion: hsla(263, 59%, 52%, 0.5);
|
|
3480
|
+
}
|
|
3481
|
+
|
|
3482
|
+
.ck .ck-ai-review-mode {
|
|
3483
|
+
max-height: 100%;
|
|
3484
|
+
height: 100%;
|
|
3485
|
+
display: flex;
|
|
3486
|
+
flex-direction: column;
|
|
3487
|
+
}
|
|
3488
|
+
|
|
3489
|
+
.ck.ck-ai-review-mode-highlights span.ck-ai_review-mode-marker_add {
|
|
3490
|
+
border-bottom: 3px solid var(--ck-color-ai-review-mode-suggestion);
|
|
3491
|
+
}
|
|
3492
|
+
|
|
3493
|
+
.ck.ck-ai-review-mode-highlights span.ck-ai_review-mode-marker_hide {
|
|
3494
|
+
display: none;
|
|
3495
|
+
}
|
|
3496
|
+
|
|
3497
|
+
.ck.ck-ai-review-mode-highlights span.ck-ai_review-mode-marker_strikethrough {
|
|
3498
|
+
position: relative;
|
|
3499
|
+
}
|
|
3500
|
+
|
|
3501
|
+
.ck.ck-ai-review-mode-highlights span.ck-ai_review-mode-marker_strikethrough:before {
|
|
3502
|
+
border-bottom: 3px solid var(--ck-color-ai-review-mode-suggestion);
|
|
3503
|
+
position: absolute;
|
|
3504
|
+
content: "";
|
|
3505
|
+
width: 100%;
|
|
3506
|
+
height: 60%;
|
|
3507
|
+
}
|
|
3508
|
+
|
|
3509
|
+
.ck.ck-ai-review-mode-highlights span.ck-ai_review-mode-marker_underline {
|
|
3510
|
+
border-bottom: 3px solid var(--ck-color-ai-review-mode-suggestion);
|
|
3511
|
+
}
|
|
3512
|
+
|
|
3513
|
+
.ck.ck-ai-review-mode-diff span.ck-ai_review-mode-marker_add {
|
|
3514
|
+
white-space: break-spaces;
|
|
3515
|
+
border-top: 3px solid var(--ck-color-suggestion-marker-insertion-border);
|
|
3516
|
+
border-bottom: 3px solid var(--ck-color-suggestion-marker-insertion-border);
|
|
3517
|
+
background: var(--ck-color-suggestion-marker-insertion-background);
|
|
3518
|
+
}
|
|
3519
|
+
|
|
3520
|
+
.ck.ck-ai-review-mode-diff span.ck-ai_review-mode-marker_hide,
|
|
3521
|
+
.ck.ck-ai-review-mode-diff span.ck-ai_review-mode-marker_strikethrough {
|
|
3522
|
+
white-space: break-spaces;
|
|
3523
|
+
border-top: 3px solid var(--ck-color-suggestion-marker-deletion-border);
|
|
3524
|
+
border-bottom: 3px solid var(--ck-color-suggestion-marker-deletion-border);
|
|
3525
|
+
text-decoration: line-through;
|
|
3526
|
+
text-decoration-color: var(--ck-color-suggestion-marker-deletion-stroke);
|
|
3527
|
+
text-decoration-thickness: 3px;
|
|
3528
|
+
background: var(--ck-color-suggestion-marker-deletion-background);
|
|
3529
|
+
}
|
|
3530
|
+
|
|
3531
|
+
.ck.ck-ai-review-mode-diff span.ck-ai_review-mode-marker_underline {
|
|
3532
|
+
border: none;
|
|
3533
|
+
}
|
|
3534
|
+
|
|
394
3535
|
/*
|
|
395
3536
|
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
396
3537
|
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
@@ -728,6 +3869,59 @@
|
|
|
728
3869
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
729
3870
|
*/
|
|
730
3871
|
|
|
3872
|
+
/* We need specificity 020 to beat .ck.ck-button. */
|
|
3873
|
+
.ck.ck-button.ck-confirm-view-submit {
|
|
3874
|
+
color: var(--ck-color-button-save);
|
|
3875
|
+
}
|
|
3876
|
+
|
|
3877
|
+
.ck.ck-button.ck-confirm-view-cancel {
|
|
3878
|
+
color: var(--ck-color-button-cancel);
|
|
3879
|
+
}
|
|
3880
|
+
|
|
3881
|
+
.ck .ck-confirm-view-active {
|
|
3882
|
+
transform: translate3d( -100%, 0, 0 );
|
|
3883
|
+
transition: all 300ms linear;
|
|
3884
|
+
}
|
|
3885
|
+
|
|
3886
|
+
.ck .ck-confirm-view {
|
|
3887
|
+
font-size: var(--ck-font-size-base);
|
|
3888
|
+
position: absolute;
|
|
3889
|
+
display: flex;
|
|
3890
|
+
justify-content: flex-start;
|
|
3891
|
+
top: 0;
|
|
3892
|
+
left: 100%;
|
|
3893
|
+
width: 100%;
|
|
3894
|
+
height: 100%;
|
|
3895
|
+
background-color: var(--ck-color-light-red);
|
|
3896
|
+
}
|
|
3897
|
+
|
|
3898
|
+
.ck .ck-confirm-view .ck-confirm-view-inner {
|
|
3899
|
+
display: flex;
|
|
3900
|
+
flex-direction: column;
|
|
3901
|
+
align-items: center;
|
|
3902
|
+
justify-content: center;
|
|
3903
|
+
padding-top: var(--ck-spacing-standard);
|
|
3904
|
+
height: 100%;
|
|
3905
|
+
width: 100%;
|
|
3906
|
+
|
|
3907
|
+
/* Maximum height of confirmation (in case with such long comment). */
|
|
3908
|
+
max-height: 400px;
|
|
3909
|
+
}
|
|
3910
|
+
|
|
3911
|
+
.ck .ck-confirm-view p {
|
|
3912
|
+
font-weight: bold;
|
|
3913
|
+
margin: 0;
|
|
3914
|
+
}
|
|
3915
|
+
|
|
3916
|
+
/*
|
|
3917
|
+
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
3918
|
+
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
3919
|
+
* all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
|
|
3920
|
+
*
|
|
3921
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
3922
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
3923
|
+
*/
|
|
3924
|
+
|
|
731
3925
|
/*
|
|
732
3926
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
|
733
3927
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
@@ -1522,10 +4716,6 @@ With track-changes feature enabled, we need to distinguish various types of anno
|
|
|
1522
4716
|
}
|
|
1523
4717
|
}
|
|
1524
4718
|
|
|
1525
|
-
.ck .ck-comment__wrapper.ck-comment--remove-confirmation {
|
|
1526
|
-
transform: translate3d( -100%, 0, 0 );
|
|
1527
|
-
}
|
|
1528
|
-
|
|
1529
4719
|
.ck .ck-comment__wrapper:first-of-type {
|
|
1530
4720
|
border-top-right-radius: var(--ck-border-radius);
|
|
1531
4721
|
border-top-left-radius: var(--ck-border-radius);
|
|
@@ -1552,14 +4742,6 @@ With track-changes feature enabled, we need to distinguish various types of anno
|
|
|
1552
4742
|
background-color: var(--ck-color-comment-separator);
|
|
1553
4743
|
}
|
|
1554
4744
|
|
|
1555
|
-
.ck .ck-comment--remove {
|
|
1556
|
-
background-color: var(--ck-color-comment-remove-background);
|
|
1557
|
-
}
|
|
1558
|
-
|
|
1559
|
-
.ck .ck-comment--remove::after {
|
|
1560
|
-
opacity: 0;
|
|
1561
|
-
}
|
|
1562
|
-
|
|
1563
4745
|
.ck .ck-comment--edit {
|
|
1564
4746
|
background-color: var(--ck-color-comment-input-background);
|
|
1565
4747
|
}
|
|
@@ -1943,49 +5125,15 @@ We are styling resetting list-style because of parent <ul> element. */
|
|
|
1943
5125
|
--ck-color-thread-header-active-background: var(--ck-color-unlinked-active-background);
|
|
1944
5126
|
}
|
|
1945
5127
|
|
|
1946
|
-
.ck .ck-thread--remove-confirmation .ck-thread__container {
|
|
1947
|
-
transform: translate3d( -100%, 0, 0 );
|
|
1948
|
-
}
|
|
1949
|
-
|
|
1950
5128
|
/* We need specificity 020 to beat .ck.ck-button. */
|
|
1951
|
-
.ck.ck-button.ck-
|
|
5129
|
+
.ck.ck-button.ck-confirm-view-submit {
|
|
1952
5130
|
color: var(--ck-color-button-save);
|
|
1953
5131
|
}
|
|
1954
5132
|
|
|
1955
|
-
.ck.ck-button.ck-
|
|
5133
|
+
.ck.ck-button.ck-confirm-view-cancel {
|
|
1956
5134
|
color: var(--ck-color-button-cancel);
|
|
1957
5135
|
}
|
|
1958
5136
|
|
|
1959
|
-
.ck .ck-thread__remove-confirm {
|
|
1960
|
-
font-size: var(--ck-font-size-base);
|
|
1961
|
-
position: absolute;
|
|
1962
|
-
display: flex;
|
|
1963
|
-
justify-content: flex-start;
|
|
1964
|
-
top: 0;
|
|
1965
|
-
left: 100%;
|
|
1966
|
-
width: 100%;
|
|
1967
|
-
height: 100%;
|
|
1968
|
-
background-color: var(--ck-color-comment-remove-background);
|
|
1969
|
-
}
|
|
1970
|
-
|
|
1971
|
-
.ck .ck-thread__remove-confirm .ck-thread__remove-confirm-inner {
|
|
1972
|
-
display: flex;
|
|
1973
|
-
flex-direction: column;
|
|
1974
|
-
align-items: center;
|
|
1975
|
-
justify-content: center;
|
|
1976
|
-
padding-top: var(--ck-spacing-standard);
|
|
1977
|
-
height: 100%;
|
|
1978
|
-
width: 100%;
|
|
1979
|
-
|
|
1980
|
-
/* Maximum height of confirmation (in case with such long comment). */
|
|
1981
|
-
max-height: 400px;
|
|
1982
|
-
}
|
|
1983
|
-
|
|
1984
|
-
.ck .ck-thread__remove-confirm p {
|
|
1985
|
-
font-weight: bold;
|
|
1986
|
-
margin: 0;
|
|
1987
|
-
}
|
|
1988
|
-
|
|
1989
5137
|
/*
|
|
1990
5138
|
* What you're currently looking at is the source code of a legally protected, proprietary software.
|
|
1991
5139
|
* CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
|
|
@@ -4593,7 +7741,7 @@ See: ckeditor5-theme-lark/theme/ckeditor5-ui/components/editorui/editorui.css. *
|
|
|
4593
7741
|
|
|
4594
7742
|
/* A confirmation that shows up when attempting to delete a revision */
|
|
4595
7743
|
|
|
4596
|
-
.ck.ck-revision-history-sidebar__revision-wrapper .ck-
|
|
7744
|
+
.ck.ck-revision-history-sidebar__revision-wrapper .ck-confirm-view {
|
|
4597
7745
|
display: flex;
|
|
4598
7746
|
flex-direction: row;
|
|
4599
7747
|
justify-content: space-around;
|
|
@@ -4611,14 +7759,14 @@ See: ckeditor5-theme-lark/theme/ckeditor5-ui/components/editorui/editorui.css. *
|
|
|
4611
7759
|
user-select: none;
|
|
4612
7760
|
}
|
|
4613
7761
|
|
|
4614
|
-
.ck.ck-revision-history-sidebar__revision-wrapper .ck-
|
|
7762
|
+
.ck.ck-revision-history-sidebar__revision-wrapper .ck-confirm-view .ck-confirm-view-inner {
|
|
4615
7763
|
text-align: center;
|
|
4616
7764
|
margin-top: var(--ck-spacing-small);
|
|
4617
7765
|
|
|
4618
7766
|
/* Confirmation message */
|
|
4619
7767
|
}
|
|
4620
7768
|
|
|
4621
|
-
.ck.ck-revision-history-sidebar__revision-wrapper .ck-
|
|
7769
|
+
.ck.ck-revision-history-sidebar__revision-wrapper .ck-confirm-view .ck-confirm-view-inner p {
|
|
4622
7770
|
margin: 0;
|
|
4623
7771
|
font-weight: bold;
|
|
4624
7772
|
color: var(--ck-color-text);
|
|
@@ -4626,21 +7774,21 @@ See: ckeditor5-theme-lark/theme/ckeditor5-ui/components/editorui/editorui.css. *
|
|
|
4626
7774
|
|
|
4627
7775
|
/* Confirmation buttons */
|
|
4628
7776
|
|
|
4629
|
-
.ck.ck-revision-history-sidebar__revision-wrapper .ck-
|
|
7777
|
+
.ck.ck-revision-history-sidebar__revision-wrapper .ck-confirm-view .ck-confirm-view-inner .ck-confirm-view-actions {
|
|
4630
7778
|
display: flex;
|
|
4631
7779
|
flex-direction: row;
|
|
4632
7780
|
justify-content: space-evenly;
|
|
4633
7781
|
}
|
|
4634
7782
|
|
|
4635
|
-
.ck.ck-revision-history-sidebar__revision-wrapper .ck-
|
|
7783
|
+
.ck.ck-revision-history-sidebar__revision-wrapper .ck-confirm-view .ck-confirm-view-inner .ck-confirm-view-actions .ck.ck-button:hover, .ck.ck-revision-history-sidebar__revision-wrapper .ck-confirm-view .ck-confirm-view-inner .ck-confirm-view-actions .ck.ck-button:focus, .ck.ck-revision-history-sidebar__revision-wrapper .ck-confirm-view .ck-confirm-view-inner .ck-confirm-view-actions .ck.ck-button:active {
|
|
4636
7784
|
background: var(--ck-revision-history-revision-delete-confirmation-active-button-background);
|
|
4637
7785
|
}
|
|
4638
7786
|
|
|
4639
|
-
.ck.ck-revision-history-sidebar__revision-wrapper .ck-
|
|
7787
|
+
.ck.ck-revision-history-sidebar__revision-wrapper .ck-confirm-view .ck-confirm-view-inner .ck-confirm-view-actions .ck.ck-button.ck-confirm-view-submit {
|
|
4640
7788
|
color: var(--ck-color-button-save);
|
|
4641
7789
|
}
|
|
4642
7790
|
|
|
4643
|
-
.ck.ck-revision-history-sidebar__revision-wrapper .ck-
|
|
7791
|
+
.ck.ck-revision-history-sidebar__revision-wrapper .ck-confirm-view .ck-confirm-view-inner .ck-confirm-view-actions .ck.ck-button.ck-confirm-view-cancel {
|
|
4644
7792
|
color: var(--ck-color-button-cancel);
|
|
4645
7793
|
}
|
|
4646
7794
|
|