@ckeditor/ckeditor5-image 42.0.1-alpha.1 → 42.0.1-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index-content.css +24 -0
  2. package/dist/index-editor.css +33 -0
  3. package/package.json +3 -3
package/dist/index-content.css CHANGED
@@ -17,72 +17,91 @@ background-color: var(--ck-color-image-caption-background);
17
17
  padding: .6em;
18
18
  font-size: .75em;
19
19
  outline-offset: -1px;
20
+
20
21
  }
21
22
  .ck-content img.image_resized {
22
23
  height: auto;
24
+
23
25
  }
24
26
  .ck-content .image.image_resized {
25
27
  max-width: 100%;
26
28
  display: block;
27
29
  box-sizing: border-box;
30
+
28
31
  }
29
32
  .ck-content .image.image_resized img {
30
33
  width: 100%;
34
+
31
35
  }
32
36
  .ck-content .image.image_resized > figcaption {
33
37
  display: block;
38
+
34
39
  }
35
40
  .ck-content .image.image-style-block-align-left {
36
41
  max-width: calc(100% - var(--ck-image-style-spacing));
42
+
37
43
  }
38
44
  .ck-content .image.image-style-align-left {
39
45
  clear: none;
46
+
40
47
  }
41
48
  .ck-content .image.image-style-side {
42
49
  float: right;
43
50
  margin-left: var(--ck-image-style-spacing);
44
51
  max-width: 50%;
52
+
45
53
  }
46
54
  .ck-content .image.image-style-align-left {
47
55
  float: left;
48
56
  margin-right: var(--ck-image-style-spacing);
57
+
49
58
  }
50
59
  .ck-content .image.image-style-align-right {
51
60
  float: right;
52
61
  margin-left: var(--ck-image-style-spacing);
62
+
53
63
  }
54
64
  .ck-content .image.image-style-block-align-right {
55
65
  margin-right: 0;
56
66
  margin-left: auto;
67
+
57
68
  }
58
69
  .ck-content .image.image-style-block-align-left {
59
70
  margin-left: 0;
60
71
  margin-right: auto;
72
+
61
73
  }
62
74
  .ck-content .image-style-align-center {
63
75
  margin-left: auto;
64
76
  margin-right: auto;
77
+
65
78
  }
66
79
  .ck-content .image-style-align-left {
67
80
  float: left;
68
81
  margin-right: var(--ck-image-style-spacing);
82
+
69
83
  }
70
84
  .ck-content .image-style-align-right {
71
85
  float: right;
72
86
  margin-left: var(--ck-image-style-spacing);
87
+
73
88
  }
74
89
  .ck-content p + .image.image-style-align-left {
75
90
  margin-top: 0;
91
+
76
92
  }
77
93
  .ck-content .image-inline.image-style-align-left {
78
94
  margin-top: var(--ck-inline-image-style-spacing);
79
95
  margin-bottom: var(--ck-inline-image-style-spacing);
96
+
80
97
  }
81
98
  .ck-content .image-inline.image-style-align-left {
82
99
  margin-right: var(--ck-inline-image-style-spacing);
100
+
83
101
  }
84
102
  .ck-content .image-inline.image-style-align-right {
85
103
  margin-left: var(--ck-inline-image-style-spacing);
104
+
86
105
  }
87
106
  .ck-content .image {
88
107
  display: table;
@@ -90,6 +109,7 @@ clear: both;
90
109
  text-align: center;
91
110
  margin: 0.9em auto;
92
111
  min-width: 50px;
112
+
93
113
  }
94
114
  .ck-content .image img {
95
115
  display: block;
@@ -97,17 +117,21 @@ margin: 0 auto;
97
117
  max-width: 100%;
98
118
  min-width: 100%;
99
119
  height: auto;
120
+
100
121
  }
101
122
  .ck-content .image-inline {
102
123
  display: inline-flex;
103
124
  max-width: 100%;
104
125
  align-items: flex-start;
126
+
105
127
  }
106
128
  .ck-content .image-inline picture {
107
129
  display: flex;
130
+
108
131
  }
109
132
  .ck-content .image-inline picture {
110
133
  flex-grow: 1;
111
134
  flex-shrink: 1;
112
135
  max-width: 100%;
136
+
113
137
  }
package/dist/index-editor.css CHANGED
@@ -3,58 +3,74 @@
3
3
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
4
  */
5
5
  :root {
6
+
6
7
  }
7
8
  .ck.ck-image-insert-url {
8
9
  width: 400px;
9
10
  padding: var(--ck-spacing-large) var(--ck-spacing-large) 0;
11
+
10
12
  }
11
13
  .ck.ck-image-insert-url .ck-image-insert-url__action-row {
12
14
  display: grid;
13
15
  grid-template-columns: repeat(2, 1fr);
16
+
14
17
  }
15
18
  .ck.ck-editor__editable td .image-inline.image_resized img {
16
19
  max-width: 100%;
20
+
17
21
  }
18
22
  [dir="ltr"] .ck.ck-button.ck-button_with-text.ck-resize-image-button .ck-button__icon {
19
23
  margin-right: var(--ck-spacing-standard);
24
+
20
25
  }
21
26
  [dir="rtl"] .ck.ck-button.ck-button_with-text.ck-resize-image-button .ck-button__icon {
22
27
  margin-left: var(--ck-spacing-standard);
28
+
23
29
  }
24
30
  .ck.ck-dropdown .ck-button.ck-resize-image-button .ck-button__label {
25
31
  width: 4em;
32
+
26
33
  }
27
34
  .ck.ck-image-custom-resize-form {
28
35
  display: flex;
29
36
  flex-direction: row;
30
37
  flex-wrap: nowrap;
31
38
  align-items: flex-start;
39
+
32
40
  }
33
41
  .ck.ck-image-custom-resize-form .ck-labeled-field-view {
34
42
  display: inline-block;
43
+
35
44
  }
36
45
  .ck.ck-image-custom-resize-form .ck-label {
37
46
  display: none;
47
+
38
48
  }
39
49
  .ck.ck-splitbutton.ck-splitbutton_flatten:hover > .ck-splitbutton__action:not(.ck-disabled) {
40
50
  background-color: var(--ck-color-button-on-background);
51
+
41
52
  }
42
53
  .ck.ck-splitbutton.ck-splitbutton_flatten:hover > .ck-splitbutton__action:not(.ck-disabled)::after {
43
54
  display: none;
55
+
44
56
  }
45
57
  .ck.ck-splitbutton.ck-splitbutton_flatten.ck-splitbutton_open:hover > .ck-splitbutton__action:not(.ck-disabled) {
46
58
  background-color: var(--ck-color-button-on-hover-background);
59
+
47
60
  }
48
61
  .ck.ck-text-alternative-form {
49
62
  display: flex;
50
63
  flex-direction: row;
51
64
  flex-wrap: nowrap;
65
+
52
66
  }
53
67
  .ck.ck-text-alternative-form .ck-labeled-field-view {
54
68
  display: inline-block;
69
+
55
70
  }
56
71
  .ck.ck-text-alternative-form .ck-label {
57
72
  display: none;
73
+
58
74
  }
59
75
  .ck-vertical-form .ck-button::after {
60
76
  content: "";
@@ -64,17 +80,21 @@ right: -1px;
64
80
  top: -1px;
65
81
  bottom: -1px;
66
82
  z-index: 1;
83
+
67
84
  }
68
85
  .ck-vertical-form .ck-button:focus::after {
69
86
  display: none;
87
+
70
88
  }
71
89
  .ck.ck-editor__editable .image {
72
90
  position: relative;
91
+
73
92
  }
74
93
  .ck.ck-editor__editable .image .ck-progress-bar {
75
94
  position: absolute;
76
95
  top: 0;
77
96
  left: 0;
97
+
78
98
  }
79
99
  .ck-image-upload-complete-icon {
80
100
  display: block;
@@ -83,10 +103,12 @@ top: min(var(--ck-spacing-medium), 6%);
83
103
  right: min(var(--ck-spacing-medium), 6%);
84
104
  border-radius: 50%;
85
105
  z-index: 1;
106
+
86
107
  }
87
108
  .ck-image-upload-complete-icon::after {
88
109
  content: "";
89
110
  position: absolute;
111
+
90
112
  }
91
113
  .ck .ck-upload-placeholder-loader {
92
114
  position: absolute;
@@ -95,10 +117,12 @@ align-items: center;
95
117
  justify-content: center;
96
118
  top: 0;
97
119
  left: 0;
120
+
98
121
  }
99
122
  .ck .ck-upload-placeholder-loader::before {
100
123
  content: '';
101
124
  position: relative;
125
+
102
126
  }
103
127
  .ck.ck-editor__editable .image > figcaption.ck-placeholder::before {
104
128
  padding-left: inherit;
@@ -106,28 +130,37 @@ padding-right: inherit;
106
130
  white-space: nowrap;
107
131
  overflow: hidden;
108
132
  text-overflow: ellipsis;
133
+
109
134
  }
110
135
  .ck.ck-editor__editable .image {
111
136
  z-index: 1;
137
+
112
138
  }
113
139
  .ck.ck-editor__editable .image.ck-widget_selected {
114
140
  z-index: 2;
141
+
115
142
  }
116
143
  .ck.ck-editor__editable .image-inline {
117
144
  z-index: 1;
145
+
118
146
  }
119
147
  .ck.ck-editor__editable .image-inline.ck-widget_selected {
120
148
  z-index: 2;
149
+
121
150
  }
122
151
  .ck.ck-editor__editable .image-inline.ck-widget_selected ::selection {
123
152
  display: none;
153
+
124
154
  }
125
155
  .ck.ck-editor__editable .image-inline img {
126
156
  height: auto;
157
+
127
158
  }
128
159
  .ck.ck-editor__editable td .image-inline img {
129
160
  max-width: none;
161
+
130
162
  }
131
163
  .ck.ck-editor__editable img.image_placeholder {
132
164
  background-size: 100% 100%;
165
+
133
166
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ckeditor/ckeditor5-image",
3
- "version": "42.0.1-alpha.1",
3
+ "version": "42.0.1-alpha.2",
4
4
  "description": "Image feature for CKEditor 5.",
5
5
  "keywords": [
6
6
  "ckeditor",
@@ -13,8 +13,8 @@
13
13
  "type": "module",
14
14
  "main": "src/index.js",
15
15
  "dependencies": {
16
- "@ckeditor/ckeditor5-ui": "42.0.1-alpha.1",
17
- "ckeditor5": "42.0.1-alpha.1",
16
+ "@ckeditor/ckeditor5-ui": "42.0.1-alpha.2",
17
+ "ckeditor5": "42.0.1-alpha.2",
18
18
  "lodash-es": "4.17.21"
19
19
  },
20
20
  "author": "CKSource (http://cksource.com/)",