@ckeditor/ckeditor5-theme-lark 0.0.0-internal-20241017.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (110) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/LICENSE.md +17 -0
  3. package/README.md +22 -0
  4. package/dist/index-content.css +12 -0
  5. package/dist/index-editor.css +3653 -0
  6. package/dist/index.css +5335 -0
  7. package/dist/index.css.map +1 -0
  8. package/dist/index.js +6 -0
  9. package/dist/index.js.map +1 -0
  10. package/package.json +32 -0
  11. package/theme/ckeditor5-clipboard/clipboard.css +89 -0
  12. package/theme/ckeditor5-code-block/codeblock.css +28 -0
  13. package/theme/ckeditor5-editor-classic/classiceditor.css +48 -0
  14. package/theme/ckeditor5-engine/placeholder.css +39 -0
  15. package/theme/ckeditor5-find-and-replace/findandreplaceform.css +194 -0
  16. package/theme/ckeditor5-heading/heading.css +15 -0
  17. package/theme/ckeditor5-horizontal-line/horizontalline.css +10 -0
  18. package/theme/ckeditor5-html-embed/htmlembed.css +156 -0
  19. package/theme/ckeditor5-image/imageinsert.css +66 -0
  20. package/theme/ckeditor5-image/imageupload.css +4 -0
  21. package/theme/ckeditor5-image/imageuploadicon.css +108 -0
  22. package/theme/ckeditor5-image/imageuploadloader.css +50 -0
  23. package/theme/ckeditor5-image/imageuploadprogress.css +33 -0
  24. package/theme/ckeditor5-link/link.css +30 -0
  25. package/theme/ckeditor5-link/linkactions.css +84 -0
  26. package/theme/ckeditor5-link/linkform.css +61 -0
  27. package/theme/ckeditor5-link/linkimage.css +43 -0
  28. package/theme/ckeditor5-list/listproperties.css +62 -0
  29. package/theme/ckeditor5-list/liststyles.css +40 -0
  30. package/theme/ckeditor5-media-embed/mediaembedediting.css +109 -0
  31. package/theme/ckeditor5-mention/mention.css +14 -0
  32. package/theme/ckeditor5-restricted-editing/restrictedediting.css +69 -0
  33. package/theme/ckeditor5-special-characters/charactergrid.css +51 -0
  34. package/theme/ckeditor5-special-characters/characterinfo.css +26 -0
  35. package/theme/ckeditor5-special-characters/specialcharacters.css +32 -0
  36. package/theme/ckeditor5-style/style.css +8 -0
  37. package/theme/ckeditor5-style/stylegrid.css +98 -0
  38. package/theme/ckeditor5-style/stylegroup.css +16 -0
  39. package/theme/ckeditor5-style/stylepanel.css +14 -0
  40. package/theme/ckeditor5-table/colorinput.css +103 -0
  41. package/theme/ckeditor5-table/form.css +32 -0
  42. package/theme/ckeditor5-table/formrow.css +36 -0
  43. package/theme/ckeditor5-table/inserttable.css +46 -0
  44. package/theme/ckeditor5-table/tablecellproperties.css +25 -0
  45. package/theme/ckeditor5-table/tableediting.css +27 -0
  46. package/theme/ckeditor5-table/tableform.css +90 -0
  47. package/theme/ckeditor5-table/tableproperties.css +26 -0
  48. package/theme/ckeditor5-table/tableselection.css +47 -0
  49. package/theme/ckeditor5-ui/components/autocomplete/autocomplete.css +36 -0
  50. package/theme/ckeditor5-ui/components/button/button.css +167 -0
  51. package/theme/ckeditor5-ui/components/button/listitembutton.css +42 -0
  52. package/theme/ckeditor5-ui/components/button/switchbutton.css +134 -0
  53. package/theme/ckeditor5-ui/components/collapsible/collapsible.css +42 -0
  54. package/theme/ckeditor5-ui/components/colorgrid/colorgrid.css +94 -0
  55. package/theme/ckeditor5-ui/components/colorselector/colorselector.css +70 -0
  56. package/theme/ckeditor5-ui/components/dialog/dialog.css +49 -0
  57. package/theme/ckeditor5-ui/components/dialog/dialogactions.css +14 -0
  58. package/theme/ckeditor5-ui/components/dropdown/dropdown.css +126 -0
  59. package/theme/ckeditor5-ui/components/dropdown/listdropdown.css +33 -0
  60. package/theme/ckeditor5-ui/components/dropdown/menu/dropdownmenubutton.css +89 -0
  61. package/theme/ckeditor5-ui/components/dropdown/menu/dropdownmenulistitem.css +12 -0
  62. package/theme/ckeditor5-ui/components/dropdown/menu/dropdownmenulistitembutton.css +36 -0
  63. package/theme/ckeditor5-ui/components/dropdown/menu/dropdownmenupanel.css +52 -0
  64. package/theme/ckeditor5-ui/components/dropdown/splitbutton.css +112 -0
  65. package/theme/ckeditor5-ui/components/dropdown/toolbardropdown.css +8 -0
  66. package/theme/ckeditor5-ui/components/editorui/accessibilityhelp.css +103 -0
  67. package/theme/ckeditor5-ui/components/editorui/editorui.css +69 -0
  68. package/theme/ckeditor5-ui/components/formheader/formheader.css +32 -0
  69. package/theme/ckeditor5-ui/components/icon/icon.css +42 -0
  70. package/theme/ckeditor5-ui/components/input/input.css +81 -0
  71. package/theme/ckeditor5-ui/components/label/label.css +8 -0
  72. package/theme/ckeditor5-ui/components/labeledfield/labeledfieldview.css +127 -0
  73. package/theme/ckeditor5-ui/components/labeledinput/labeledinput.css +17 -0
  74. package/theme/ckeditor5-ui/components/list/list.css +114 -0
  75. package/theme/ckeditor5-ui/components/menubar/menubar.css +15 -0
  76. package/theme/ckeditor5-ui/components/menubar/menubarmenu.css +13 -0
  77. package/theme/ckeditor5-ui/components/menubar/menubarmenubutton.css +98 -0
  78. package/theme/ckeditor5-ui/components/menubar/menubarmenulistitem.css +12 -0
  79. package/theme/ckeditor5-ui/components/menubar/menubarmenulistitembutton.css +36 -0
  80. package/theme/ckeditor5-ui/components/menubar/menubarmenupanel.css +70 -0
  81. package/theme/ckeditor5-ui/components/panel/balloonpanel.css +207 -0
  82. package/theme/ckeditor5-ui/components/panel/balloonrotator.css +33 -0
  83. package/theme/ckeditor5-ui/components/panel/fakepanel.css +46 -0
  84. package/theme/ckeditor5-ui/components/panel/stickypanel.css +16 -0
  85. package/theme/ckeditor5-ui/components/responsive-form/responsiveform.css +82 -0
  86. package/theme/ckeditor5-ui/components/search/search.css +106 -0
  87. package/theme/ckeditor5-ui/components/spinner/spinner.css +32 -0
  88. package/theme/ckeditor5-ui/components/textarea/textarea.css +12 -0
  89. package/theme/ckeditor5-ui/components/toolbar/blocktoolbar.css +14 -0
  90. package/theme/ckeditor5-ui/components/toolbar/toolbar.css +203 -0
  91. package/theme/ckeditor5-ui/components/tooltip/tooltip.css +38 -0
  92. package/theme/ckeditor5-ui/globals/_colors.css +123 -0
  93. package/theme/ckeditor5-ui/globals/_disabled.css +11 -0
  94. package/theme/ckeditor5-ui/globals/_focus.css +31 -0
  95. package/theme/ckeditor5-ui/globals/_fonts.css +16 -0
  96. package/theme/ckeditor5-ui/globals/_reset.css +97 -0
  97. package/theme/ckeditor5-ui/globals/_rounded.css +11 -0
  98. package/theme/ckeditor5-ui/globals/_shadow.css +21 -0
  99. package/theme/ckeditor5-ui/globals/_spacing.css +14 -0
  100. package/theme/ckeditor5-ui/globals/globals.css +13 -0
  101. package/theme/ckeditor5-ui/mixins/_button.css +29 -0
  102. package/theme/ckeditor5-widget/widget.css +195 -0
  103. package/theme/ckeditor5-widget/widgetresize.css +44 -0
  104. package/theme/ckeditor5-widget/widgettypearound.css +302 -0
  105. package/theme/index.css +97 -0
  106. package/theme/mixins/_disabled.css +11 -0
  107. package/theme/mixins/_focus.css +13 -0
  108. package/theme/mixins/_rounded.css +19 -0
  109. package/theme/mixins/_shadow.css +18 -0
  110. package/theme/theme.css +4 -0
@@ -0,0 +1,69 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ :root {
7
+ --ck-color-restricted-editing-exception-background: hsla(31, 100%, 65%, .2);
8
+ --ck-color-restricted-editing-exception-hover-background: hsla(31, 100%, 65%, .35);
9
+ --ck-color-restricted-editing-exception-brackets: hsla(31, 100%, 40%, .4);
10
+ --ck-color-restricted-editing-selected-exception-background: hsla(31, 100%, 65%, .5);
11
+ --ck-color-restricted-editing-selected-exception-brackets: hsla(31, 100%, 40%, .6);
12
+ }
13
+
14
+ .ck-editor__editable .restricted-editing-exception {
15
+ transition: .2s ease-in-out background;
16
+ background-color: var(--ck-color-restricted-editing-exception-background);
17
+ border: 1px solid;
18
+ border-image: linear-gradient(
19
+ to right,
20
+ var(--ck-color-restricted-editing-exception-brackets) 0%,
21
+ var(--ck-color-restricted-editing-exception-brackets) 5px,
22
+ hsla(0, 0%, 0%, 0) 6px,
23
+ hsla(0, 0%, 0%, 0) calc(100% - 6px),
24
+ var(--ck-color-restricted-editing-exception-brackets) calc(100% - 5px),
25
+ var(--ck-color-restricted-editing-exception-brackets) 100%
26
+ ) 1;
27
+
28
+ @media (prefers-reduced-motion: reduce) {
29
+ transition: none;
30
+ }
31
+
32
+ &.restricted-editing-exception_selected {
33
+ background-color: var(--ck-color-restricted-editing-selected-exception-background);
34
+ border-image: linear-gradient(
35
+ to right,
36
+ var(--ck-color-restricted-editing-selected-exception-brackets) 0%,
37
+ var(--ck-color-restricted-editing-selected-exception-brackets) 5px,
38
+ var(--ck-color-restricted-editing-selected-exception-brackets) calc(100% - 5px),
39
+ var(--ck-color-restricted-editing-selected-exception-brackets) 100%
40
+ ) 1;
41
+ }
42
+
43
+ &.restricted-editing-exception_collapsed {
44
+ /* Empty exception should have the same width as exception with at least 1 char */
45
+ padding-left: 1ch;
46
+ }
47
+ }
48
+
49
+ .ck-restricted-editing_mode_restricted {
50
+ cursor: default;
51
+
52
+ /* We also have to override all elements inside the restricted editable to prevent cursor switching between default and text
53
+ during the pointer movement. */
54
+ & * {
55
+ cursor: default;
56
+ }
57
+
58
+ & .restricted-editing-exception {
59
+ cursor: text;
60
+
61
+ & * {
62
+ cursor: text;
63
+ }
64
+
65
+ &:hover {
66
+ background: var(--ck-color-restricted-editing-exception-hover-background);
67
+ }
68
+ }
69
+ }
@@ -0,0 +1,51 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ @import "@ckeditor/ckeditor5-ui/theme/mixins/_rwd.css";
7
+ @import "../mixins/_rounded.css";
8
+
9
+ :root {
10
+ --ck-character-grid-tile-size: 24px;
11
+ }
12
+
13
+ .ck.ck-character-grid {
14
+ overflow-y: auto;
15
+ overflow-x: hidden;
16
+
17
+ & .ck-character-grid__tiles {
18
+ grid-template-columns: repeat(auto-fill, minmax(var(--ck-character-grid-tile-size), 1fr));
19
+ margin: var(--ck-spacing-standard) var(--ck-spacing-large);
20
+ grid-gap: var(--ck-spacing-standard);
21
+ }
22
+
23
+ & .ck-character-grid__tile {
24
+ width: var(--ck-character-grid-tile-size);
25
+ height: var(--ck-character-grid-tile-size);
26
+ min-width: var(--ck-character-grid-tile-size);
27
+ min-height: var(--ck-character-grid-tile-size);
28
+ font-size: 1.5em;
29
+ padding: 0;
30
+ transition: .2s ease box-shadow;
31
+ border: 0;
32
+
33
+ @media (prefers-reduced-motion: reduce) {
34
+ transition: none;
35
+ }
36
+
37
+ &:focus:not( .ck-disabled ),
38
+ &:hover:not( .ck-disabled ) {
39
+ /* Disable the default .ck-button's border ring. */
40
+ border: 0;
41
+ box-shadow: inset 0 0 0 1px var(--ck-color-base-background), 0 0 0 2px var(--ck-color-focus-border);
42
+ }
43
+
44
+ /* Make sure the glyph is rendered in the center of the button */
45
+ & .ck-button__label {
46
+ line-height: var(--ck-character-grid-tile-size);
47
+ width: 100%;
48
+ text-align: center;
49
+ }
50
+ }
51
+ }
@@ -0,0 +1,26 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ @import "@ckeditor/ckeditor5-ui/theme/mixins/_rwd.css";
7
+
8
+ .ck.ck-character-info {
9
+ padding: var(--ck-spacing-small) var(--ck-spacing-large);
10
+ border-top: 1px solid var(--ck-color-base-border);
11
+
12
+ & > * {
13
+ text-transform: uppercase;
14
+ font-size: var(--ck-font-size-small);
15
+ }
16
+
17
+ & .ck-character-info__name {
18
+ max-width: 280px;
19
+ text-overflow: ellipsis;
20
+ overflow: hidden;
21
+ }
22
+
23
+ & .ck-character-info__code {
24
+ opacity: .6;
25
+ }
26
+ }
@@ -0,0 +1,32 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ @import "@ckeditor/ckeditor5-ui/theme/mixins/_dir.css";
7
+ @import "@ckeditor/ckeditor5-ui/theme/mixins/_rwd.css";
8
+
9
+ .ck.ck-special-characters-navigation {
10
+
11
+ & > .ck-label {
12
+ max-width: 160px;
13
+ text-overflow: ellipsis;
14
+ overflow: hidden;
15
+ }
16
+
17
+ & > .ck-dropdown .ck-dropdown__panel {
18
+ /* There could be dozens of categories available. Use scroll to prevent a 10e6px dropdown. */
19
+ max-height: 250px;
20
+ overflow-y: auto;
21
+ overflow-x: hidden;
22
+ }
23
+
24
+ @mixin ck-media-phone {
25
+ max-width: 190px;
26
+
27
+ & > .ck-form__header__label {
28
+ text-overflow: ellipsis;
29
+ overflow: hidden;
30
+ }
31
+ }
32
+ }
@@ -0,0 +1,8 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ .ck.ck-dropdown.ck-style-dropdown.ck-style-dropdown_multiple-active > .ck-button > .ck-button__label {
7
+ font-style: italic;
8
+ }
@@ -0,0 +1,98 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ :root {
7
+ --ck-style-panel-button-width: 120px;
8
+ --ck-style-panel-button-height: 80px;
9
+ --ck-style-panel-button-label-background: hsl(0, 0%, 94.1%);
10
+ --ck-style-panel-button-hover-label-background: hsl(0, 0%, 92.1%);
11
+ --ck-style-panel-button-hover-border-color: hsl(0, 0%, 70%);
12
+ }
13
+
14
+ .ck.ck-style-panel .ck-style-grid {
15
+ row-gap: var(--ck-spacing-large);
16
+ column-gap: var(--ck-spacing-large);
17
+
18
+ & .ck-style-grid__button {
19
+ --ck-color-button-default-hover-background: var(--ck-color-base-background);
20
+ --ck-color-button-default-active-background: var(--ck-color-base-background);
21
+
22
+ padding: 0;
23
+ width: var(--ck-style-panel-button-width);
24
+ height: var(--ck-style-panel-button-height);
25
+
26
+ /* Let default .ck-button :focus styles apply */
27
+ &:not(:focus) {
28
+ border: 1px solid var(--ck-color-base-border);
29
+ }
30
+
31
+ & .ck-button__label {
32
+ height: 22px;
33
+ line-height: 22px;
34
+ width: 100%;
35
+ padding: 0 var(--ck-spacing-medium);
36
+ overflow: hidden;
37
+ text-overflow: ellipsis;
38
+ flex-shrink: 0;
39
+ }
40
+
41
+ & .ck-style-grid__button__preview {
42
+ width: 100%;
43
+ overflow: hidden;
44
+ opacity: .9;
45
+
46
+ padding: var(--ck-spacing-medium);
47
+ background: var(--ck-color-base-background);
48
+ border: 2px solid var(--ck-color-base-background);
49
+ }
50
+
51
+ &.ck-disabled {
52
+ --ck-color-button-default-disabled-background: var(--ck-color-base-foreground);
53
+
54
+ /* Let default .ck-button :focus styles apply */
55
+ &:not(:focus) {
56
+ border-color: var(--ck-style-panel-button-label-background);
57
+ }
58
+
59
+ & .ck-style-grid__button__preview {
60
+ opacity: .4;
61
+
62
+ border-color: var(--ck-color-base-foreground);
63
+ filter: saturate(.3);
64
+ }
65
+ }
66
+
67
+ &.ck-on {
68
+ border-color: var(--ck-color-base-active);
69
+
70
+ & .ck-button__label {
71
+ box-shadow: 0 -1px 0 var(--ck-color-base-active);
72
+ z-index: 1; /* Stay on top of the preview with the shadow. */
73
+ }
74
+
75
+ &:hover {
76
+ border-color: var(--ck-color-base-active-focus);
77
+ }
78
+ }
79
+
80
+ &:not(.ck-on) {
81
+ & .ck-button__label {
82
+ background: var(--ck-style-panel-button-label-background);
83
+ }
84
+
85
+ &:hover .ck-button__label {
86
+ background: var(--ck-style-panel-button-hover-label-background);
87
+ }
88
+ }
89
+
90
+ &:hover:not(.ck-disabled):not(.ck-on) {
91
+ border-color: var(--ck-style-panel-button-hover-border-color);
92
+
93
+ & .ck-style-grid__button__preview {
94
+ opacity: 1;
95
+ }
96
+ }
97
+ }
98
+ }
@@ -0,0 +1,16 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ .ck.ck-style-panel .ck-style-panel__style-group {
7
+ & > .ck-label {
8
+ margin: var(--ck-spacing-large) 0;
9
+ }
10
+
11
+ &:first-child {
12
+ & > .ck-label {
13
+ margin-top: 0;
14
+ }
15
+ }
16
+ }
@@ -0,0 +1,14 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ :root {
7
+ --ck-style-panel-max-height: 470px;
8
+ }
9
+
10
+ .ck.ck-style-panel {
11
+ padding: var(--ck-spacing-large);
12
+ overflow-y: auto;
13
+ max-height: var(--ck-style-panel-max-height);
14
+ }
@@ -0,0 +1,103 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ @import "@ckeditor/ckeditor5-ui/theme/mixins/_dir.css";
7
+ @import "../mixins/_rounded.css";
8
+
9
+ .ck.ck-input-color {
10
+ & > .ck.ck-input-text {
11
+ @mixin ck-dir ltr {
12
+ border-top-right-radius: 0;
13
+ border-bottom-right-radius: 0;
14
+ }
15
+
16
+ @mixin ck-dir rtl {
17
+ border-top-left-radius: 0;
18
+ border-bottom-left-radius: 0;
19
+ }
20
+
21
+ /* Make sure the focused input is always on top of the dropdown button so its
22
+ outline and border are never cropped (also when the input is read-only). */
23
+ &:focus {
24
+ z-index: 0;
25
+ }
26
+ }
27
+
28
+ & > .ck.ck-dropdown {
29
+ & > .ck.ck-button.ck-input-color__button {
30
+ padding: 0;
31
+
32
+ @mixin ck-dir ltr {
33
+ border-top-left-radius: 0;
34
+ border-bottom-left-radius: 0;
35
+
36
+ &:not(:focus) {
37
+ border-left: 1px solid transparent;
38
+ }
39
+ }
40
+
41
+ @mixin ck-dir rtl {
42
+ border-top-right-radius: 0;
43
+ border-bottom-right-radius: 0;
44
+
45
+ &:not(:focus) {
46
+ border-right: 1px solid transparent;
47
+ }
48
+ }
49
+
50
+ &.ck-disabled {
51
+ background: var(--ck-color-input-disabled-background);
52
+ }
53
+
54
+ & > .ck.ck-input-color__button__preview {
55
+ @mixin ck-rounded-corners;
56
+
57
+ width: 20px;
58
+ height: 20px;
59
+ border: 1px solid var(--ck-color-input-border);
60
+
61
+ & > .ck.ck-input-color__button__preview__no-color-indicator {
62
+ top: -30%;
63
+ left: 50%;
64
+ height: 150%;
65
+ width: 8%;
66
+ background: hsl(0, 100%, 50%);
67
+ border-radius: 2px;
68
+ transform: rotate(45deg);
69
+ transform-origin: 50%;
70
+ }
71
+ }
72
+ }
73
+ }
74
+
75
+ & .ck.ck-input-color__remove-color {
76
+ width: 100%;
77
+ padding: calc(var(--ck-spacing-standard) / 2) var(--ck-spacing-standard);
78
+
79
+ border-bottom-left-radius: 0;
80
+ border-bottom-right-radius: 0;
81
+
82
+ &:not(:focus) {
83
+ border-bottom: 1px solid var(--ck-color-input-border);
84
+ }
85
+
86
+ @mixin ck-dir ltr {
87
+ border-top-right-radius: 0;
88
+ }
89
+
90
+ @mixin ck-dir rtl {
91
+ border-top-left-radius: 0;
92
+ }
93
+
94
+ & .ck.ck-icon {
95
+ margin-right: var(--ck-spacing-standard);
96
+
97
+ @mixin ck-dir rtl {
98
+ margin-right: 0;
99
+ margin-left: var(--ck-spacing-standard);
100
+ }
101
+ }
102
+ }
103
+ }
@@ -0,0 +1,32 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ .ck.ck-form {
7
+ padding: 0 0 var(--ck-spacing-large);
8
+
9
+ &:focus {
10
+ /* See: https://github.com/ckeditor/ckeditor5/issues/4773 */
11
+ outline: none;
12
+ }
13
+
14
+ & .ck.ck-input-text {
15
+ min-width: 100%;
16
+ width: 0;
17
+ }
18
+
19
+ & .ck.ck-dropdown {
20
+ min-width: 100%;
21
+
22
+ & .ck-dropdown__button {
23
+ &:not(:focus) {
24
+ border: 1px solid var(--ck-color-base-border);
25
+ }
26
+
27
+ & .ck-button__label {
28
+ width: 100%;
29
+ }
30
+ }
31
+ }
32
+ }
@@ -0,0 +1,36 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ @import "@ckeditor/ckeditor5-ui/theme/mixins/_dir.css";
7
+
8
+ .ck.ck-form__row {
9
+ padding: var(--ck-spacing-standard) var(--ck-spacing-large) 0;
10
+
11
+ /* Ignore labels that work as fieldset legends */
12
+ & > *:not(.ck-label) {
13
+ & + * {
14
+ @mixin ck-dir ltr {
15
+ margin-left: var(--ck-spacing-large);
16
+ }
17
+
18
+ @mixin ck-dir rtl {
19
+ margin-right: var(--ck-spacing-large);
20
+ }
21
+ }
22
+ }
23
+
24
+ & > .ck-label {
25
+ width: 100%;
26
+ min-width: 100%;
27
+ }
28
+
29
+ &.ck-table-form__action-row {
30
+ margin-top: var(--ck-spacing-large);
31
+
32
+ & .ck-button .ck-button__label {
33
+ color: var(--ck-color-text);
34
+ }
35
+ }
36
+ }
@@ -0,0 +1,46 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ :root {
7
+ --ck-insert-table-dropdown-padding: 10px;
8
+ --ck-insert-table-dropdown-box-height: 11px;
9
+ --ck-insert-table-dropdown-box-width: 12px;
10
+ --ck-insert-table-dropdown-box-margin: 1px;
11
+ }
12
+
13
+ .ck .ck-insert-table-dropdown__grid {
14
+ /* The width of a container should match 10 items in a row so there will be a 10x10 grid. */
15
+ width: calc(var(--ck-insert-table-dropdown-box-width) * 10 + var(--ck-insert-table-dropdown-box-margin) * 20 + var(--ck-insert-table-dropdown-padding) * 2);
16
+ padding: var(--ck-insert-table-dropdown-padding) var(--ck-insert-table-dropdown-padding) 0;
17
+ }
18
+
19
+ .ck .ck-insert-table-dropdown__label,
20
+ .ck[dir=rtl] .ck-insert-table-dropdown__label {
21
+ text-align: center;
22
+ }
23
+
24
+ .ck .ck-insert-table-dropdown-grid-box {
25
+ min-width: var(--ck-insert-table-dropdown-box-width);
26
+ min-height: var(--ck-insert-table-dropdown-box-height);
27
+ margin: var(--ck-insert-table-dropdown-box-margin);
28
+ border: 1px solid var(--ck-color-base-border);
29
+ border-radius: 1px;
30
+ outline: none;
31
+ transition: none;
32
+
33
+ @media (prefers-reduced-motion: reduce) {
34
+ transition: none;
35
+ }
36
+
37
+ &:focus {
38
+ box-shadow: none;
39
+ }
40
+
41
+ &.ck-on {
42
+ border-color: var(--ck-color-focus-border);
43
+ background: var(--ck-color-focus-outer-shadow);
44
+ }
45
+ }
46
+
@@ -0,0 +1,25 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ .ck.ck-table-cell-properties-form {
7
+ width: 320px;
8
+
9
+ & .ck-form__row {
10
+ &.ck-table-cell-properties-form__padding-row {
11
+ align-self: flex-end;
12
+ padding: 0;
13
+ width: 25%;
14
+ }
15
+
16
+ &.ck-table-cell-properties-form__alignment-row {
17
+ & .ck.ck-toolbar {
18
+ background: none;
19
+
20
+ /* Compensate for missing input label that would push the margin (toolbar has no inputs). */
21
+ margin-top: var(--ck-spacing-standard);
22
+ }
23
+ }
24
+ }
25
+ }
@@ -0,0 +1,27 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ :root {
7
+ --ck-color-selector-focused-cell-background: hsla(212, 90%, 80%, .3);
8
+ }
9
+
10
+ .ck-widget.table {
11
+ & td,
12
+ & th {
13
+ /**
14
+ * While setting outline is fine, the border should not be modified here
15
+ * because it overrides the default table cell border color which is not expected.
16
+ * So do not use `@mixin ck-focus-ring;` here, or any other border styles.
17
+ * See more: https://github.com/ckeditor/ckeditor5/issues/16979
18
+ */
19
+ &.ck-editor__nested-editable.ck-editor__nested-editable_focused,
20
+ &.ck-editor__nested-editable:focus {
21
+ /* A very slight background to highlight the focused cell */
22
+ background: var(--ck-color-selector-focused-cell-background);
23
+ outline: 1px solid var(--ck-color-focus-border);
24
+ outline-offset: -1px; /* progressive enhancement - no IE support */
25
+ }
26
+ }
27
+ }
@@ -0,0 +1,90 @@
1
+ /*
2
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+
6
+ @import "../mixins/_rounded.css";
7
+
8
+ :root {
9
+ --ck-table-properties-error-arrow-size: 6px;
10
+ --ck-table-properties-min-error-width: 150px;
11
+ }
12
+
13
+ .ck.ck-table-form {
14
+ & .ck-form__row {
15
+ &.ck-table-form__border-row {
16
+ & .ck-labeled-field-view {
17
+ & > .ck-label {
18
+ font-size: var(--ck-font-size-tiny);
19
+ text-align: center;
20
+ }
21
+ }
22
+
23
+ & .ck-table-form__border-style,
24
+ & .ck-table-form__border-width {
25
+ width: 80px;
26
+ min-width: 80px;
27
+ max-width: 80px;
28
+ }
29
+ }
30
+
31
+ &.ck-table-form__dimensions-row {
32
+ padding: 0;
33
+
34
+ & .ck-table-form__dimensions-row__width,
35
+ & .ck-table-form__dimensions-row__height {
36
+ margin: 0
37
+ }
38
+
39
+ & .ck-table-form__dimension-operator {
40
+ align-self: flex-end;
41
+ display: inline-block;
42
+ height: var(--ck-ui-component-min-height);
43
+ line-height: var(--ck-ui-component-min-height);
44
+ margin: 0 var(--ck-spacing-small);
45
+ }
46
+ }
47
+ }
48
+
49
+ & .ck.ck-labeled-field-view {
50
+ padding-top: var(--ck-spacing-standard);
51
+
52
+ & .ck.ck-labeled-field-view__status {
53
+ @mixin ck-rounded-corners;
54
+
55
+ background: var(--ck-color-base-error);
56
+ color: var(--ck-color-base-background);
57
+ padding: var(--ck-spacing-small) var(--ck-spacing-medium);
58
+ min-width: var(--ck-table-properties-min-error-width);
59
+ text-align: center;
60
+
61
+ /* The arrow pointing towards the field. */
62
+ &::after {
63
+ border-color: transparent transparent var(--ck-color-base-error) transparent;
64
+ border-width: 0 var(--ck-table-properties-error-arrow-size) var(--ck-table-properties-error-arrow-size) var(--ck-table-properties-error-arrow-size);
65
+ border-style: solid;
66
+ }
67
+
68
+ animation: ck-table-form-labeled-view-status-appear .15s ease both;
69
+
70
+ @media (prefers-reduced-motion: reduce) {
71
+ animation: none;
72
+ }
73
+ }
74
+
75
+ /* Hide the error balloon when the field is blurred. Makes the experience much more clear. */
76
+ & .ck-input.ck-error:not(:focus) + .ck.ck-labeled-field-view__status {
77
+ display: none;
78
+ }
79
+ }
80
+ }
81
+
82
+ @keyframes ck-table-form-labeled-view-status-appear {
83
+ 0% {
84
+ opacity: 0;
85
+ }
86
+
87
+ 100% {
88
+ opacity: 1;
89
+ }
90
+ }