@ckeditor/ckeditor5-theme-lark 44.3.0-alpha.7 → 45.0.0-alpha.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.
- package/dist/index-editor.css +334 -111
- package/dist/index.css +441 -157
- package/dist/index.css.map +1 -1
- package/package.json +2 -2
- package/theme/ckeditor5-bookmark/bookmark.css +48 -0
- package/theme/ckeditor5-bookmark/bookmarkform.css +20 -0
- package/theme/ckeditor5-bookmark/bookmarktoolbar.css +19 -0
- package/theme/ckeditor5-image/imagecustomresizeform.css +22 -0
- package/theme/ckeditor5-image/textalternativeform.css +22 -0
- package/theme/ckeditor5-link/linkform.css +38 -41
- package/theme/ckeditor5-link/linkproperties.css +20 -0
- package/theme/ckeditor5-link/linkprovideritems.css +50 -0
- package/theme/ckeditor5-link/linktoolbar.css +60 -0
- package/theme/ckeditor5-table/formrow.css +1 -9
- package/theme/ckeditor5-table/tablelayout.css +153 -0
- package/theme/ckeditor5-ui/components/form/form.css +4 -0
- package/theme/ckeditor5-ui/components/formheader/formheader.css +14 -0
- package/theme/ckeditor5-ui/components/labeledfield/labeledfieldview.css +4 -0
- package/theme/ckeditor5-widget/widget.css +13 -0
- package/theme/ckeditor5-widget/widgettypearound.css +29 -13
- package/theme/index.css +9 -2
- package/theme/ckeditor5-link/linkactions.css +0 -84
- package/theme/ckeditor5-table/form.css +0 -32
package/dist/index.css
CHANGED
@@ -1718,6 +1718,17 @@ of the component, floating–point numbers have been used which, for the default
|
|
1718
1718
|
--ck-font-size-base: 15px;
|
1719
1719
|
font-weight: bold;
|
1720
1720
|
}
|
1721
|
+
/* Padding when back button is hidden */
|
1722
|
+
.ck.ck-form__header:has(.ck-button-back.ck-hidden) {
|
1723
|
+
padding-inline: var(--ck-spacing-large) var(--ck-spacing-large);
|
1724
|
+
}
|
1725
|
+
/* Padding when back button is visible */
|
1726
|
+
.ck.ck-form__header:has(.ck-button-back:not(.ck-hidden)) {
|
1727
|
+
padding-inline: var(--ck-spacing-small) var(--ck-spacing-small);
|
1728
|
+
}
|
1729
|
+
.ck.ck-form__header > .ck-button-back {
|
1730
|
+
margin-inline-end: var(--ck-spacing-small);
|
1731
|
+
}
|
1721
1732
|
/*
|
1722
1733
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
1723
1734
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
@@ -1984,6 +1995,9 @@ of the component, floating–point numbers have been used which, for the default
|
|
1984
1995
|
.ck.ck-labeled-field-view.ck-labeled-field-view_empty:not(.ck-labeled-field-view_focused):not(.ck-labeled-field-view_placeholder) > .ck.ck-labeled-field-view__input-wrapper > .ck-dropdown + .ck-label {
|
1985
1996
|
max-width: calc(var(--ck-labeled-field-empty-unfocused-max-width) - var(--ck-dropdown-arrow-size) - var(--ck-spacing-standard));
|
1986
1997
|
}
|
1998
|
+
.ck.ck-labeled-field-view.ck-labeled-field-view_full-width {
|
1999
|
+
flex-grow: 1;
|
2000
|
+
}
|
1987
2001
|
/*
|
1988
2002
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
1989
2003
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
@@ -2652,6 +2666,10 @@ of the component, floating–point numbers have been used which, for the default
|
|
2652
2666
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
2653
2667
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
2654
2668
|
*/
|
2669
|
+
/*
|
2670
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
2671
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
2672
|
+
*/
|
2655
2673
|
.ck-vertical-form > .ck-button:nth-last-child(2)::after {
|
2656
2674
|
border-right: 1px solid var(--ck-color-base-border);
|
2657
2675
|
}
|
@@ -3120,6 +3138,40 @@ of the component, floating–point numbers have been used which, for the default
|
|
3120
3138
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3121
3139
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3122
3140
|
*/
|
3141
|
+
:root {
|
3142
|
+
--ck-bookmark-icon-hover-fill-color: var(--ck-color-widget-hover-border);
|
3143
|
+
--ck-bookmark-icon-selected-fill-color: var(--ck-color-focus-border);
|
3144
|
+
--ck-bookmark-icon-animation-duration: var(--ck-widget-handler-animation-duration);
|
3145
|
+
--ck-bookmark-icon-animation-curve: var(--ck-widget-handler-animation-curve);
|
3146
|
+
}
|
3147
|
+
.ck .ck-bookmark.ck-widget {
|
3148
|
+
display: inline-block;
|
3149
|
+
outline: none;
|
3150
|
+
}
|
3151
|
+
.ck .ck-bookmark.ck-widget .ck-bookmark__icon .ck-icon__fill {
|
3152
|
+
transition: fill var(--ck-bookmark-icon-animation-duration) var(--ck-bookmark-icon-animation-curve);
|
3153
|
+
}
|
3154
|
+
.ck .ck-bookmark.ck-widget:hover .ck-bookmark__icon .ck-icon__fill {
|
3155
|
+
fill: var(--ck-bookmark-icon-hover-fill-color);
|
3156
|
+
}
|
3157
|
+
.ck .ck-bookmark.ck-widget.ck-widget_selected .ck-bookmark__icon .ck-icon__fill {
|
3158
|
+
fill: var(--ck-bookmark-icon-selected-fill-color);
|
3159
|
+
}
|
3160
|
+
.ck .ck-bookmark.ck-widget.ck-widget_selected,
|
3161
|
+
.ck .ck-bookmark.ck-widget.ck-widget_selected:hover {
|
3162
|
+
outline: none;
|
3163
|
+
}
|
3164
|
+
.ck .ck-bookmark.ck-widget .ck-bookmark__icon {
|
3165
|
+
position: relative;
|
3166
|
+
display: block;
|
3167
|
+
/* To make it align with text baseline. */
|
3168
|
+
top: -0.1em;
|
3169
|
+
}
|
3170
|
+
.ck .ck-bookmark.ck-widget .ck-bookmark__icon .ck-icon {
|
3171
|
+
height: 1.2em;
|
3172
|
+
width: auto;
|
3173
|
+
vertical-align: middle;
|
3174
|
+
}
|
3123
3175
|
/*
|
3124
3176
|
* Classes used by the "fake visual selection" displayed in the content when an input
|
3125
3177
|
* in the bookmark UI has focus (the browser does not render the native selection in this state).
|
@@ -3134,6 +3186,54 @@ of the component, floating–point numbers have been used which, for the default
|
|
3134
3186
|
margin-right: -1px;
|
3135
3187
|
outline: solid 1px hsla(0, 0%, 100%, .5);
|
3136
3188
|
}
|
3189
|
+
/*
|
3190
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3191
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3192
|
+
*/
|
3193
|
+
/*
|
3194
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3195
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3196
|
+
*/
|
3197
|
+
:root {
|
3198
|
+
--ck-bookmark-form-width: 340px;
|
3199
|
+
}
|
3200
|
+
@media screen and (max-width: 600px) {
|
3201
|
+
:root {
|
3202
|
+
--ck-bookmark-form-width: 300px;
|
3203
|
+
}
|
3204
|
+
}
|
3205
|
+
.ck.ck-bookmark-form {
|
3206
|
+
width: var(--ck-bookmark-form-width);
|
3207
|
+
}
|
3208
|
+
/*
|
3209
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3210
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3211
|
+
*/
|
3212
|
+
/*
|
3213
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3214
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3215
|
+
*/
|
3216
|
+
/**
|
3217
|
+
* Makes element unselectable.
|
3218
|
+
*/
|
3219
|
+
.ck.ck-bookmark-toolbar__preview {
|
3220
|
+
padding: 0 var(--ck-spacing-medium);
|
3221
|
+
max-width: var(--ck-input-width);
|
3222
|
+
min-width: 3em;
|
3223
|
+
font-weight: normal;
|
3224
|
+
text-overflow: ellipsis;
|
3225
|
+
text-align: center;
|
3226
|
+
overflow: hidden;
|
3227
|
+
|
3228
|
+
-moz-user-select: none;
|
3229
|
+
|
3230
|
+
-webkit-user-select: none;
|
3231
|
+
|
3232
|
+
-ms-user-select: none;
|
3233
|
+
|
3234
|
+
user-select: none;
|
3235
|
+
cursor: default;
|
3236
|
+
}
|
3137
3237
|
/*
|
3138
3238
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3139
3239
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
@@ -3836,6 +3936,44 @@ of the component, floating–point numbers have been used which, for the default
|
|
3836
3936
|
from { opacity: 0; }
|
3837
3937
|
to { opacity: 1; }
|
3838
3938
|
}
|
3939
|
+
/*
|
3940
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3941
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3942
|
+
*/
|
3943
|
+
/*
|
3944
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3945
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3946
|
+
*/
|
3947
|
+
:root {
|
3948
|
+
--ck-text-alternative-form-width: 340px;
|
3949
|
+
}
|
3950
|
+
@media screen and (max-width: 600px) {
|
3951
|
+
:root {
|
3952
|
+
--ck-text-alternative-form-width: 300px;
|
3953
|
+
}
|
3954
|
+
}
|
3955
|
+
.ck.ck-text-alternative-form.ck-responsive-form {
|
3956
|
+
width: var(--ck-text-alternative-form-width);
|
3957
|
+
}
|
3958
|
+
/*
|
3959
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3960
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3961
|
+
*/
|
3962
|
+
/*
|
3963
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3964
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3965
|
+
*/
|
3966
|
+
:root {
|
3967
|
+
--ck-image-custom-resize-form-width: 340px;
|
3968
|
+
}
|
3969
|
+
@media screen and (max-width: 600px) {
|
3970
|
+
:root {
|
3971
|
+
--ck-image-custom-resize-form-width: 300px;
|
3972
|
+
}
|
3973
|
+
}
|
3974
|
+
.ck.ck-image-custom-resize-form.ck-responsive-form {
|
3975
|
+
width: var(--ck-image-custom-resize-form-width);
|
3976
|
+
}
|
3839
3977
|
/*
|
3840
3978
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3841
3979
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
@@ -3871,87 +4009,49 @@ of the component, floating–point numbers have been used which, for the default
|
|
3871
4009
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3872
4010
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3873
4011
|
*/
|
3874
|
-
|
3875
|
-
*
|
3876
|
-
|
3877
|
-
|
3878
|
-
|
3879
|
-
|
3880
|
-
|
3881
|
-
|
3882
|
-
|
3883
|
-
|
3884
|
-
|
3885
|
-
/**
|
3886
|
-
* A visual style of focused element's border.
|
3887
|
-
*/
|
3888
|
-
/*
|
3889
|
-
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3890
|
-
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3891
|
-
*/
|
3892
|
-
/**
|
3893
|
-
* A helper to combine multiple shadows.
|
3894
|
-
*/
|
3895
|
-
/**
|
3896
|
-
* Gives an element a drop shadow so it looks like a floating panel.
|
3897
|
-
*/
|
3898
|
-
/*
|
3899
|
-
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
3900
|
-
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3901
|
-
*/
|
3902
|
-
.ck.ck-link-actions .ck-button.ck-link-actions__preview {
|
3903
|
-
padding-left: 0;
|
3904
|
-
padding-right: 0;
|
3905
|
-
}
|
3906
|
-
.ck.ck-link-actions .ck-button.ck-link-actions__preview .ck-button__label {
|
3907
|
-
padding: 0 var(--ck-spacing-medium);
|
3908
|
-
color: var(--ck-color-link-default);
|
3909
|
-
text-overflow: ellipsis;
|
3910
|
-
cursor: pointer;
|
3911
|
-
|
3912
|
-
/* Match the box model of the link editor form's input so the balloon
|
3913
|
-
does not change width when moving between actions and the form. */
|
3914
|
-
max-width: var(--ck-input-width);
|
3915
|
-
min-width: 3em;
|
3916
|
-
text-align: center;
|
3917
|
-
}
|
3918
|
-
.ck.ck-link-actions .ck-button.ck-link-actions__preview .ck-button__label:hover {
|
3919
|
-
text-decoration: underline;
|
3920
|
-
}
|
3921
|
-
.ck.ck-link-actions .ck-button.ck-link-actions__preview,
|
3922
|
-
.ck.ck-link-actions .ck-button.ck-link-actions__preview:hover,
|
3923
|
-
.ck.ck-link-actions .ck-button.ck-link-actions__preview:focus,
|
3924
|
-
.ck.ck-link-actions .ck-button.ck-link-actions__preview:active {
|
3925
|
-
background: none;
|
3926
|
-
}
|
3927
|
-
.ck.ck-link-actions .ck-button.ck-link-actions__preview:active {
|
3928
|
-
box-shadow: none;
|
3929
|
-
}
|
3930
|
-
.ck.ck-link-actions .ck-button.ck-link-actions__preview:focus .ck-button__label {
|
3931
|
-
text-decoration: underline;
|
3932
|
-
}
|
3933
|
-
[dir="ltr"] .ck.ck-link-actions .ck-button:not(:first-child) {
|
3934
|
-
margin-left: var(--ck-spacing-standard);
|
3935
|
-
}
|
3936
|
-
[dir="rtl"] .ck.ck-link-actions .ck-button:not(:last-child) {
|
3937
|
-
margin-left: var(--ck-spacing-standard);
|
3938
|
-
}
|
3939
|
-
@media screen and (max-width: 600px) {
|
3940
|
-
.ck.ck-link-actions .ck-button.ck-link-actions__preview {
|
3941
|
-
margin: var(--ck-spacing-standard) var(--ck-spacing-standard) 0;
|
3942
|
-
}
|
4012
|
+
:root {
|
4013
|
+
--ck-link-bookmark-icon-size: calc( var(--ck-icon-size) * 0.7); /* 0.7 = 14/20 cause default the icon size is 20px */
|
4014
|
+
}
|
4015
|
+
a.ck.ck-button.ck-link-toolbar__preview {
|
4016
|
+
padding: 0 var(--ck-spacing-medium);
|
4017
|
+
color: var(--ck-color-link-default);
|
4018
|
+
cursor: pointer;
|
4019
|
+
justify-content: center;
|
4020
|
+
}
|
4021
|
+
a.ck.ck-button.ck-link-toolbar__preview .ck.ck-button__label {
|
4022
|
+
text-overflow: ellipsis;
|
3943
4023
|
|
3944
|
-
|
3945
|
-
|
3946
|
-
|
3947
|
-
}
|
3948
|
-
[dir="ltr"] .ck.ck-link-actions .ck-button:not(.ck-link-actions__preview) {
|
3949
|
-
margin-left: 0;
|
4024
|
+
/* Match the box model of the link editor form's input so the balloon
|
4025
|
+
does not change width when moving between actions and the form. */
|
4026
|
+
max-width: var(--ck-input-width);
|
3950
4027
|
}
|
3951
|
-
|
3952
|
-
|
3953
|
-
|
4028
|
+
a.ck.ck-button.ck-link-toolbar__preview,
|
4029
|
+
a.ck.ck-button.ck-link-toolbar__preview:hover,
|
4030
|
+
a.ck.ck-button.ck-link-toolbar__preview:focus,
|
4031
|
+
a.ck.ck-button.ck-link-toolbar__preview:active {
|
4032
|
+
background: none;
|
4033
|
+
}
|
4034
|
+
a.ck.ck-button.ck-link-toolbar__preview:active {
|
4035
|
+
box-shadow: none;
|
4036
|
+
}
|
4037
|
+
a.ck.ck-button.ck-link-toolbar__preview:hover,
|
4038
|
+
a.ck.ck-button.ck-link-toolbar__preview:focus {
|
4039
|
+
text-decoration: underline;
|
4040
|
+
}
|
4041
|
+
a.ck.ck-button.ck-link-toolbar__preview.ck-button_with-text .ck.ck-icon.ck-button__icon {
|
4042
|
+
width: var(--ck-link-bookmark-icon-size);
|
4043
|
+
height: var(--ck-link-bookmark-icon-size);
|
4044
|
+
}
|
4045
|
+
[dir="ltr"] a.ck.ck-button.ck-link-toolbar__preview.ck-button_with-text .ck.ck-icon.ck-button__icon {
|
4046
|
+
margin-right: var(--ck-spacing-tiny);
|
4047
|
+
margin-left: var(--ck-spacing-small);
|
4048
|
+
}
|
4049
|
+
[dir="rtl"] a.ck.ck-button.ck-link-toolbar__preview.ck-button_with-text .ck.ck-icon.ck-button__icon {
|
4050
|
+
margin-left: var(--ck-spacing-tiny);
|
4051
|
+
margin-right: var(--ck-spacing-small);
|
3954
4052
|
}
|
4053
|
+
a.ck.ck-button.ck-link-toolbar__preview:has( .ck-icon ) {
|
4054
|
+
padding-left: var(--ck-spacing-extra-tiny );
|
3955
4055
|
}
|
3956
4056
|
/*
|
3957
4057
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
@@ -3962,48 +4062,50 @@ of the component, floating–point numbers have been used which, for the default
|
|
3962
4062
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3963
4063
|
*/
|
3964
4064
|
/*
|
3965
|
-
*
|
3966
|
-
*
|
4065
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
4066
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
3967
4067
|
*/
|
3968
|
-
|
3969
|
-
|
3970
|
-
|
4068
|
+
:root {
|
4069
|
+
--ck-link-panel-width: 340px;
|
4070
|
+
/* The height of the text inside the link providers list button. */
|
4071
|
+
--ck-link-provider-list-item-text-height: calc(var(--ck-line-height-base) * var(--ck-font-size-base));
|
4072
|
+
/* The height of the link providers list item contained paddings. */
|
4073
|
+
--ck-link-provider-list-item-height: calc(var(--ck-link-provider-list-item-text-height) + var(--ck-spacing-small) + var(--ck-spacing-small));
|
3971
4074
|
}
|
3972
|
-
|
3973
|
-
|
4075
|
+
@media screen and (max-width: 600px) {
|
4076
|
+
:root {
|
4077
|
+
--ck-link-panel-width: 300px;
|
3974
4078
|
}
|
3975
|
-
.ck.ck-link-form_layout-vertical .ck-labeled-field-view .ck-input-text {
|
3976
|
-
min-width: 0;
|
3977
|
-
width: 100%;
|
3978
|
-
}
|
3979
|
-
.ck.ck-link-form_layout-vertical > .ck-button {
|
3980
|
-
padding: var(--ck-spacing-standard);
|
3981
|
-
margin: 0;
|
3982
|
-
width: 50%;
|
3983
|
-
border-radius: 0;
|
3984
4079
|
}
|
3985
|
-
|
3986
|
-
|
4080
|
+
/* Generic class that wraps each link balloon view. */
|
4081
|
+
.ck.ck-form.ck-link-form {
|
4082
|
+
width: var(--ck-link-panel-width);
|
4083
|
+
padding-bottom: 0;
|
4084
|
+
}
|
4085
|
+
@media screen and (max-width: 600px) {
|
4086
|
+
.ck.ck-form.ck-link-form.ck-responsive-form .ck-labeled-field-view {
|
4087
|
+
margin: 0;
|
3987
4088
|
}
|
3988
|
-
[dir="ltr"] .ck.ck-link-form_layout-vertical > .ck-button {
|
3989
|
-
margin-left: 0;
|
3990
|
-
}
|
3991
|
-
[dir="rtl"] .ck.ck-link-form_layout-vertical > .ck-button {
|
3992
|
-
margin-left: 0;
|
3993
4089
|
}
|
3994
|
-
|
3995
|
-
|
3996
|
-
|
3997
|
-
/*
|
3998
|
-
.ck.ck-link-form_layout-vertical .ck.ck-list {
|
3999
|
-
margin: 0 var(--ck-spacing-large);
|
4090
|
+
.ck.ck-form.ck-link-form .ck-link-form__providers-list {
|
4091
|
+
border-top: 1px solid var(--ck-color-base-border);
|
4092
|
+
|
4093
|
+
/* The list should be scrollable when there are more than 4 items. */
|
4000
4094
|
}
|
4001
|
-
.ck.ck-link-
|
4002
|
-
|
4003
|
-
|
4095
|
+
.ck.ck-form.ck-link-form .ck-link-form__providers-list:has(.ck-list__item:nth-child(n + 5)) {
|
4096
|
+
overflow: auto;
|
4097
|
+
/* Scroll should appear when there are more than 5 item on the list.
|
4098
|
+
* var(--ck-spacing-large) - is a form padding.
|
4099
|
+
* 1px - is a border width. */
|
4100
|
+
max-height: calc(var(--ck-link-provider-list-item-height) * 4 + var(--ck-spacing-large) + 1px);
|
4004
4101
|
}
|
4005
|
-
.ck.ck-link-
|
4006
|
-
|
4102
|
+
.ck.ck-form.ck-link-form .ck-link-form__providers-list .ck-link__button {
|
4103
|
+
padding: var(--ck-spacing-small) var(--ck-spacing-large);
|
4104
|
+
border-radius: 0;
|
4105
|
+
}
|
4106
|
+
.ck.ck-form.ck-link-form .ck-link-form__providers-list .ck-link__button > .ck-button__label {
|
4107
|
+
overflow: hidden;
|
4108
|
+
text-overflow: ellipsis;
|
4007
4109
|
}
|
4008
4110
|
/*
|
4009
4111
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
@@ -4044,6 +4146,67 @@ of the component, floating–point numbers have been used which, for the default
|
|
4044
4146
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
4045
4147
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
4046
4148
|
*/
|
4149
|
+
/*
|
4150
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
4151
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
4152
|
+
*/
|
4153
|
+
:root {
|
4154
|
+
--ck-link-properties-width: 340px;
|
4155
|
+
}
|
4156
|
+
@media screen and (max-width: 600px) {
|
4157
|
+
:root {
|
4158
|
+
--ck-link-properties-width: 300px;
|
4159
|
+
}
|
4160
|
+
}
|
4161
|
+
.ck.ck-link-properties {
|
4162
|
+
width: var(--ck-link-properties-width);
|
4163
|
+
}
|
4164
|
+
/*
|
4165
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
4166
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
4167
|
+
*/
|
4168
|
+
/*
|
4169
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
4170
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
4171
|
+
*/
|
4172
|
+
:root {
|
4173
|
+
--ck-link-providers-width: 340px;
|
4174
|
+
--ck-link-list-view-max-height: 240px;
|
4175
|
+
--ck-link-list-view-icon-size: calc( var(--ck-icon-size) * 0.8); /* 0.8 = 16/20 cause default the icon size is 20px */
|
4176
|
+
}
|
4177
|
+
@media screen and (max-width: 600px) {
|
4178
|
+
:root {
|
4179
|
+
--ck-link-providers-width: 300px;
|
4180
|
+
}
|
4181
|
+
}
|
4182
|
+
.ck.ck-link-providers {
|
4183
|
+
width: var(--ck-link-providers-width);
|
4184
|
+
}
|
4185
|
+
.ck.ck-link-providers .ck-form__header__label {
|
4186
|
+
overflow: hidden;
|
4187
|
+
text-overflow: ellipsis;
|
4188
|
+
}
|
4189
|
+
.ck.ck-link-providers > .ck-link-providers__list {
|
4190
|
+
max-height: min( var(--ck-link-list-view-max-height), 40vh );
|
4191
|
+
}
|
4192
|
+
.ck.ck-link-providers > .ck-link-providers__list .ck-button > .ck-icon {
|
4193
|
+
width: var(--ck-link-list-view-icon-size);
|
4194
|
+
height: var(--ck-link-list-view-icon-size);
|
4195
|
+
}
|
4196
|
+
.ck.ck-link-providers > .ck-link-providers__list .ck-button > .ck-button__label {
|
4197
|
+
overflow: hidden;
|
4198
|
+
text-overflow: ellipsis;
|
4199
|
+
white-space: nowrap;
|
4200
|
+
}
|
4201
|
+
.ck.ck-link-providers .ck-link__empty-list-info {
|
4202
|
+
padding: calc( 2 * var(--ck-spacing-large) ) var(--ck-spacing-medium);
|
4203
|
+
text-align: center;
|
4204
|
+
font-style: italic;
|
4205
|
+
}
|
4206
|
+
/*
|
4207
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
4208
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
4209
|
+
*/
|
4047
4210
|
/* When there are no list styles and there is no collapsible. */
|
4048
4211
|
.ck.ck-list-properties.ck-list-properties_without-styles {
|
4049
4212
|
padding: var(--ck-spacing-large);
|
@@ -4606,45 +4769,14 @@ of the component, floating–point numbers have been used which, for the default
|
|
4606
4769
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
4607
4770
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
4608
4771
|
*/
|
4609
|
-
.ck.ck-form {
|
4610
|
-
padding: 0 0 var(--ck-spacing-large);
|
4611
|
-
}
|
4612
|
-
.ck.ck-form:focus {
|
4613
|
-
/* See: https://github.com/ckeditor/ckeditor5/issues/4773 */
|
4614
|
-
outline: none;
|
4615
|
-
}
|
4616
|
-
.ck.ck-form .ck.ck-input-text {
|
4617
|
-
min-width: 100%;
|
4618
|
-
width: 0;
|
4619
|
-
}
|
4620
|
-
.ck.ck-form .ck.ck-dropdown {
|
4621
|
-
min-width: 100%;
|
4622
|
-
}
|
4623
|
-
.ck.ck-form .ck.ck-dropdown .ck-dropdown__button:not(:focus) {
|
4624
|
-
border: 1px solid var(--ck-color-base-border);
|
4625
|
-
}
|
4626
|
-
.ck.ck-form .ck.ck-dropdown .ck-dropdown__button .ck-button__label {
|
4627
|
-
width: 100%;
|
4628
|
-
}
|
4629
4772
|
/*
|
4630
4773
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
4631
4774
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
4632
4775
|
*/
|
4633
|
-
/*
|
4634
|
-
|
4635
|
-
|
4636
|
-
|
4637
|
-
.ck.ck-form__row {
|
4638
|
-
padding: var(--ck-spacing-standard) var(--ck-spacing-large) 0;
|
4639
|
-
|
4640
|
-
/* Ignore labels that work as fieldset legends */
|
4641
|
-
}
|
4642
|
-
[dir="ltr"] .ck.ck-form__row > *:not(.ck-label) + * {
|
4643
|
-
margin-left: var(--ck-spacing-large);
|
4644
|
-
}
|
4645
|
-
[dir="rtl"] .ck.ck-form__row > *:not(.ck-label) + * {
|
4646
|
-
margin-right: var(--ck-spacing-large);
|
4647
|
-
}
|
4776
|
+
/* Ignore labels that work as fieldset legends */
|
4777
|
+
.ck.ck-form__row > *:not(.ck-label) + * {
|
4778
|
+
margin-inline-start: var(--ck-spacing-large);
|
4779
|
+
}
|
4648
4780
|
.ck.ck-form__row > .ck-label {
|
4649
4781
|
width: 100%;
|
4650
4782
|
min-width: 100%;
|
@@ -4884,6 +5016,132 @@ of the component, floating–point numbers have been used which, for the default
|
|
4884
5016
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
4885
5017
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
4886
5018
|
*/
|
5019
|
+
:root {
|
5020
|
+
--ck-table-layout-widget-type-around-button-size: 16px;
|
5021
|
+
--ck-table-layout-widget-type-around-icon-width: 10px;
|
5022
|
+
--ck-table-layout-widget-type-around-icon-height: 8px;
|
5023
|
+
--ck-table-layout-widget-handler-icon-size: 10px;
|
5024
|
+
--ck-table-layout-default-border-color: hsl(0, 0%, 83%);
|
5025
|
+
|
5026
|
+
}
|
5027
|
+
.ck-editor__editable .table.layout-table > table {
|
5028
|
+
width: 100%;
|
5029
|
+
/* Styles to make the layout table outline visible when the layout table is inside another layout table inside edge cells.
|
5030
|
+
Currently, this solution works on every browser except Safari. */
|
5031
|
+
overflow: clip;
|
5032
|
+
overflow-clip-margin: var(--ck-widget-outline-thickness);
|
5033
|
+
|
5034
|
+
/* The default table layout style in the editing view when the border is unset. */
|
5035
|
+
}
|
5036
|
+
.ck-editor__editable .table.layout-table > table:not(
|
5037
|
+
[style*="border:"],
|
5038
|
+
[style*="border-top"],
|
5039
|
+
[style*="border-bottom"],
|
5040
|
+
[style*="border-left"],
|
5041
|
+
[style*="border-right"],
|
5042
|
+
[style*="border-width"],
|
5043
|
+
[style*="border-style"],
|
5044
|
+
[style*="border-color"]) {
|
5045
|
+
border-color: transparent;
|
5046
|
+
border-width: 0;
|
5047
|
+
outline: none;
|
5048
|
+
}
|
5049
|
+
.ck-editor__editable .table.layout-table > table > tbody > tr > td {
|
5050
|
+
box-shadow: revert;
|
5051
|
+
padding: revert;
|
5052
|
+
min-width: 2em;
|
5053
|
+
/* To make the caret visible. */
|
5054
|
+
text-indent: 1px;
|
5055
|
+
|
5056
|
+
/* Resets the `min-width` style attribute that was added by the content table style. */
|
5057
|
+
}
|
5058
|
+
.ck-editor__editable .table.layout-table > table > tbody > tr > td[style^="width:"],
|
5059
|
+
.ck-editor__editable .table.layout-table > table > tbody > tr > td[style*=" width:"],
|
5060
|
+
.ck-editor__editable .table.layout-table > table > tbody > tr > td[style*=";width:"],
|
5061
|
+
.ck-editor__editable .table.layout-table > table > tbody > tr > td[style*="'width:"] {
|
5062
|
+
min-width: auto;
|
5063
|
+
}
|
5064
|
+
/* Remove the default background color from the focused table cell. */
|
5065
|
+
.ck-editor__editable .table.layout-table > table > tbody > tr > td:focus {
|
5066
|
+
background-color: transparent;
|
5067
|
+
}
|
5068
|
+
/* The default table layout cell style in the editing view when the border is unset.
|
5069
|
+
But it need to be more strict cause of style attributes like `border-collapse`, `border-spacing`, etc. */
|
5070
|
+
.ck-editor__editable .table.layout-table > table > tbody > tr > td:not(
|
5071
|
+
[style*="border:"],
|
5072
|
+
[style*="border-top"],
|
5073
|
+
[style*="border-bottom"],
|
5074
|
+
[style*="border-left"],
|
5075
|
+
[style*="border-right"],
|
5076
|
+
[style*="border-width"],
|
5077
|
+
[style*="border-style"],
|
5078
|
+
[style*="border-color"]) {
|
5079
|
+
border-color: transparent;
|
5080
|
+
/* Resetting `border-width` property to the user agent styles. */
|
5081
|
+
border-width: 0;
|
5082
|
+
outline: var(--ck-table-layout-default-border-color) 1px dashed;
|
5083
|
+
outline-offset: -1px;
|
5084
|
+
}
|
5085
|
+
.ck-editor__editable .table.layout-table > table > tbody > tr > td:not(
|
5086
|
+
[style*="border:"],
|
5087
|
+
[style*="border-top"],
|
5088
|
+
[style*="border-bottom"],
|
5089
|
+
[style*="border-left"],
|
5090
|
+
[style*="border-right"],
|
5091
|
+
[style*="border-width"],
|
5092
|
+
[style*="border-style"],
|
5093
|
+
[style*="border-color"]):focus {
|
5094
|
+
outline: var(--ck-color-focus-border) 1px solid;
|
5095
|
+
}
|
5096
|
+
/* Reset the `width` and `text-indent` of the bogus paragraph because <td> has 1px text indent. */
|
5097
|
+
.ck-editor__editable .table.layout-table > table > tbody > tr > td > .ck-table-bogus-paragraph {
|
5098
|
+
width: calc(100% - 1px);
|
5099
|
+
text-indent: 0;
|
5100
|
+
}
|
5101
|
+
/* Widget type around overrides. */
|
5102
|
+
.ck-editor__editable .table.layout-table.ck-widget > .ck-widget__type-around {
|
5103
|
+
--ck-widget-type-around-button-size: var(--ck-table-layout-widget-type-around-button-size);
|
5104
|
+
}
|
5105
|
+
.ck-editor__editable .table.layout-table.ck-widget > .ck-widget__type-around > .ck-widget__type-around__button.ck-widget__type-around__button_before,
|
5106
|
+
.ck-editor__editable .table.layout-table.ck-widget > .ck-widget__type-around > .ck-widget__type-around__button.ck-widget__type-around__button_after {
|
5107
|
+
transform: translateY(0);
|
5108
|
+
}
|
5109
|
+
.ck-editor__editable .table.layout-table.ck-widget > .ck-widget__type-around > .ck-widget__type-around__button.ck-widget__type-around__button_before {
|
5110
|
+
margin-left: var(--ck-table-layout-widget-type-around-button-size);
|
5111
|
+
left: min(10%, 30px);
|
5112
|
+
border-radius: 0 0 100px 100px;
|
5113
|
+
}
|
5114
|
+
.ck-editor__editable .table.layout-table.ck-widget > .ck-widget__type-around > .ck-widget__type-around__button.ck-widget__type-around__button_before::after {
|
5115
|
+
border-radius: 0 0 100px 100px;
|
5116
|
+
}
|
5117
|
+
.ck-editor__editable .table.layout-table.ck-widget > .ck-widget__type-around > .ck-widget__type-around__button.ck-widget__type-around__button_after {
|
5118
|
+
border-radius: 100px 100px 0 0;
|
5119
|
+
}
|
5120
|
+
.ck-editor__editable .table.layout-table.ck-widget > .ck-widget__type-around > .ck-widget__type-around__button.ck-widget__type-around__button_after::after {
|
5121
|
+
border-radius: 100px 100px 0 0;
|
5122
|
+
}
|
5123
|
+
.ck-editor__editable .table.layout-table.ck-widget > .ck-widget__type-around > .ck-widget__type-around__button svg {
|
5124
|
+
width: var(--ck-table-layout-widget-type-around-icon-width);
|
5125
|
+
height: var(--ck-table-layout-widget-type-around-icon-height);
|
5126
|
+
}
|
5127
|
+
.ck-editor__editable .table.layout-table.ck-widget.ck-widget_with-selection-handle > .ck-widget__selection-handle {
|
5128
|
+
--ck-widget-handler-icon-size: var(--ck-table-layout-widget-handler-icon-size);
|
5129
|
+
|
5130
|
+
transform: translateY(calc(0px - var(--ck-widget-outline-thickness)));
|
5131
|
+
z-index: var(--ck-z-default);
|
5132
|
+
}
|
5133
|
+
/* Show fake caret on border not above. */
|
5134
|
+
.ck-editor__editable .table.layout-table.ck-widget.ck-widget_type-around_show-fake-caret_before > .ck-widget__type-around > .ck-widget__type-around__fake-caret {
|
5135
|
+
top: 0;
|
5136
|
+
}
|
5137
|
+
/* Show fake caret on border not below. */
|
5138
|
+
.ck-editor__editable .table.layout-table.ck-widget.ck-widget_type-around_show-fake-caret_after > .ck-widget__type-around > .ck-widget__type-around__fake-caret {
|
5139
|
+
bottom: 0;
|
5140
|
+
}
|
5141
|
+
/*
|
5142
|
+
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
5143
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
5144
|
+
*/
|
4887
5145
|
/*
|
4888
5146
|
* Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
|
4889
5147
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
@@ -4934,6 +5192,12 @@ of the component, floating–point numbers have been used which, for the default
|
|
4934
5192
|
.ck .ck-widget:hover {
|
4935
5193
|
outline-color: var(--ck-color-widget-hover-border);
|
4936
5194
|
}
|
5195
|
+
/*
|
5196
|
+
* Hide the outline of all widget parents when the widget is being hovered.
|
5197
|
+
*/
|
5198
|
+
.ck .ck-widget:has( .ck-widget:hover ) {
|
5199
|
+
outline-color: transparent;
|
5200
|
+
}
|
4937
5201
|
.ck .ck-editor__nested-editable {
|
4938
5202
|
border: 1px solid transparent;
|
4939
5203
|
|
@@ -5027,6 +5291,11 @@ of the component, floating–point numbers have been used which, for the default
|
|
5027
5291
|
.ck .ck-widget.ck-widget_with-selection-handle.ck-widget_selected > .ck-widget__selection-handle .ck-icon .ck-icon__selected-indicator, .ck .ck-widget.ck-widget_with-selection-handle.ck-widget_selected:hover > .ck-widget__selection-handle .ck-icon .ck-icon__selected-indicator {
|
5028
5292
|
opacity: 1;
|
5029
5293
|
}
|
5294
|
+
/* Hide the selection handle on mouse hover over the widget of all the widget parents. */
|
5295
|
+
.ck .ck-widget.ck-widget_with-selection-handle:has( .ck-widget:hover ) > .ck-widget__selection-handle {
|
5296
|
+
opacity: 0;
|
5297
|
+
visibility: hidden;
|
5298
|
+
}
|
5030
5299
|
/* In a RTL environment, align the selection handler to the right side of the widget */
|
5031
5300
|
/* stylelint-disable-next-line no-descending-specificity */
|
5032
5301
|
.ck[dir="rtl"] .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle {
|
@@ -5195,9 +5464,9 @@ of the component, floating–point numbers have been used which, for the default
|
|
5195
5464
|
}
|
5196
5465
|
}
|
5197
5466
|
/*
|
5198
|
-
* Show type around buttons when the widget
|
5467
|
+
* Show type around buttons when the widget is being hovered.
|
5199
5468
|
*/
|
5200
|
-
.ck .ck-widget
|
5469
|
+
.ck .ck-widget:hover > .ck-widget__type-around > .ck-widget__type-around__button {
|
5201
5470
|
opacity: 1;
|
5202
5471
|
pointer-events: auto;
|
5203
5472
|
}
|
@@ -5223,6 +5492,21 @@ of the component, floating–point numbers have been used which, for the default
|
|
5223
5492
|
border-radius: 100px;
|
5224
5493
|
background: linear-gradient(135deg, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,.3) 100%);
|
5225
5494
|
}
|
5495
|
+
/*
|
5496
|
+
* Styles of the widget when the "fake caret" is blinking (e.g. upon keyboard navigation).
|
5497
|
+
* Despite the widget being physically selected in the model, its outline should disappear.
|
5498
|
+
*/
|
5499
|
+
.ck .ck-widget.ck-widget_selected.ck-widget_type-around_show-fake-caret_before,
|
5500
|
+
.ck .ck-widget.ck-widget_selected.ck-widget_type-around_show-fake-caret_after {
|
5501
|
+
outline-color: transparent;
|
5502
|
+
}
|
5503
|
+
/*
|
5504
|
+
* Show type around buttons when the widget gets selected.
|
5505
|
+
*/
|
5506
|
+
.ck .ck-widget.ck-widget_selected > .ck-widget__type-around > .ck-widget__type-around__button {
|
5507
|
+
opacity: 1;
|
5508
|
+
pointer-events: auto;
|
5509
|
+
}
|
5226
5510
|
/*
|
5227
5511
|
* Styles for the "before" button when the widget has a selection handle. Because some space
|
5228
5512
|
* is consumed by the handle, the button must be moved slightly to the right to let it breathe.
|
@@ -5245,14 +5529,6 @@ of the component, floating–point numbers have been used which, for the default
|
|
5245
5529
|
outline: solid 1px hsla(0, 0%, 100%, .5);
|
5246
5530
|
background: var(--ck-color-base-text);
|
5247
5531
|
}
|
5248
|
-
/*
|
5249
|
-
* Styles of the widget when the "fake caret" is blinking (e.g. upon keyboard navigation).
|
5250
|
-
* Despite the widget being physically selected in the model, its outline should disappear.
|
5251
|
-
*/
|
5252
|
-
.ck .ck-widget.ck-widget_selected.ck-widget_type-around_show-fake-caret_before,
|
5253
|
-
.ck .ck-widget.ck-widget_selected.ck-widget_type-around_show-fake-caret_after {
|
5254
|
-
outline-color: transparent;
|
5255
|
-
}
|
5256
5532
|
/*
|
5257
5533
|
* When the "fake caret" is visible we simulate that the widget is not selected
|
5258
5534
|
* (despite being physically selected), so the outline color should be for the
|
@@ -5284,6 +5560,13 @@ of the component, floating–point numbers have been used which, for the default
|
|
5284
5560
|
.ck .ck-widget.ck-widget_type-around_show-fake-caret_before.ck-widget_selected.ck-widget_with-resizer > .ck-widget__resizer, .ck .ck-widget.ck-widget_type-around_show-fake-caret_after.ck-widget_selected.ck-widget_with-resizer > .ck-widget__resizer {
|
5285
5561
|
opacity: 0
|
5286
5562
|
}
|
5563
|
+
/*
|
5564
|
+
* Hide type around buttons of all widget parents when the widget is being hovered.
|
5565
|
+
*/
|
5566
|
+
.ck .ck-widget:has( .ck-widget:hover ) > .ck-widget__type-around > .ck-widget__type-around__button {
|
5567
|
+
opacity: 0;
|
5568
|
+
pointer-events: none;
|
5569
|
+
}
|
5287
5570
|
/*
|
5288
5571
|
* Styles for the "before" button when the widget has a selection handle in an RTL environment.
|
5289
5572
|
* The selection handler is aligned to the right side of the widget so there is no need to create
|
@@ -5299,6 +5582,7 @@ of the component, floating–point numbers have been used which, for the default
|
|
5299
5582
|
*
|
5300
5583
|
* See https://github.com/ckeditor/ckeditor5/issues/7263.
|
5301
5584
|
*/
|
5585
|
+
/* stylelint-disable-next-line no-descending-specificity */
|
5302
5586
|
.ck-editor__nested-editable.ck-editor__editable_selected .ck-widget.ck-widget_selected > .ck-widget__type-around > .ck-widget__type-around__button, .ck-editor__nested-editable.ck-editor__editable_selected .ck-widget:hover > .ck-widget__type-around > .ck-widget__type-around__button {
|
5303
5587
|
opacity: 0;
|
5304
5588
|
pointer-events: none;
|