瀏覽代碼

Docs: Updated content styles. [skip ci]

Piotrek Koszuliński 6 年之前
父節點
當前提交
5950ee6729
共有 2 個文件被更改,包括 57 次插入46 次删除
  1. 53 46
      docs/builds/guides/integration/content-styles.md
  2. 4 0
      scripts/docs/content-styles/ckeditor.js

+ 53 - 46
docs/builds/guides/integration/content-styles.md

@@ -49,7 +49,7 @@ Below there is a full list of content styles used by editor features. You can co
 ```css
 /*
  * CKEditor 5 (v12.3.1) content styles.
- * Generated on Tue, 06 Aug 2019 09:44:26 GMT.
+ * Generated on Mon, 19 Aug 2019 11:29:42 GMT.
  * For more information, check out https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/content-styles.html
  */
 
@@ -57,6 +57,40 @@ Below there is a full list of content styles used by editor features. You can co
 	--ck-image-style-spacing: 1.5em;
 }
 
+/* ckeditor5-image/theme/image.css */
+.ck-content .image {
+	display: table;
+	clear: both;
+	text-align: center;
+	margin: 1em auto
+}
+/* ckeditor5-image/theme/image.css */
+.ck-content .image > img {
+	display: block;
+	margin: 0 auto;
+	max-width: 100%;
+	min-width: 50px;
+}
+/* ckeditor5-basic-styles/theme/code.css */
+.ck-content code {
+	background-color: hsla(0, 0%, 78%, 0.3);
+	padding: .15em;
+	border-radius: 2px;
+}
+/* ckeditor5-image/theme/imageresize.css */
+.ck-content .image.image_resized {
+	max-width: 100%;
+	display: block;
+	box-sizing: border-box
+}
+/* ckeditor5-image/theme/imageresize.css */
+.ck-content .image.image_resized img {
+	width: 100%;
+}
+/* ckeditor5-image/theme/imageresize.css */
+.ck-content .image.image_resized>figcaption {
+	display: block;
+}
 /* ckeditor5-image/theme/imagecaption.css */
 .ck-content .image > figcaption {
 	display: table-caption;
@@ -68,12 +102,6 @@ Below there is a full list of content styles used by editor features. You can co
 	font-size: .75em;
 	outline-offset: -1px;
 }
-/* ckeditor5-basic-styles/theme/code.css */
-.ck-content code {
-	background-color: hsla(0, 0%, 78%, 0.3);
-	padding: .15em;
-	border-radius: 2px;
-}
 /* ckeditor5-table/theme/table.css */
 .ck-content .table {
 	margin: 1em auto;
@@ -104,55 +132,20 @@ Below there is a full list of content styles used by editor features. You can co
 	font-weight: bold;
 	background: hsl(0, 0%, 98%);
 }
-/* ckeditor5-image/theme/image.css */
-.ck-content .image {
-	display: table;
-	clear: both;
-	text-align: center;
-	margin: 1em auto
-}
-/* ckeditor5-image/theme/image.css */
-.ck-content .image > img {
-	display: block;
-	margin: 0 auto;
-	max-width: 100%;
-	min-width: 50px;
-}
-/* ckeditor5-image/theme/imageuploadprogress.css */
-.ck-content .image {
-	position: relative;
-	overflow: hidden;
-}
-/* ckeditor5-image/theme/imageuploadprogress.css */
-.ck-content .image.ck-appear {
-	animation: fadeIn 700ms;
-}
 /* ckeditor5-image/theme/imagestyle.css */
-.ck-content .image-style-side,
-.ck-content .image-style-align-left,
-.ck-content .image-style-align-center,
-.ck-content .image-style-align-right {
+.ck-content .image-style-side:not(.image_resized), .ck-content .image-style-align-left:not(.image_resized), .ck-content .image-style-align-center:not(.image_resized), .ck-content .image-style-align-right:not(.image_resized) {
 	max-width: 50%;
 }
 /* ckeditor5-image/theme/imagestyle.css */
-.ck-content .image-style-side,
-.ck-content .image-style-align-left,
-.ck-content .image-style-align-center,
-.ck-content .image-style-align-right {
+.ck-content .image-style-side:not(.image_resized), .ck-content .image-style-align-left:not(.image_resized), .ck-content .image-style-align-center:not(.image_resized), .ck-content .image-style-align-right:not(.image_resized) {
 	max-width: 50%;
 }
 /* ckeditor5-image/theme/imagestyle.css */
-.ck-content .image-style-side,
-.ck-content .image-style-align-left,
-.ck-content .image-style-align-center,
-.ck-content .image-style-align-right {
+.ck-content .image-style-side:not(.image_resized), .ck-content .image-style-align-left:not(.image_resized), .ck-content .image-style-align-center:not(.image_resized), .ck-content .image-style-align-right:not(.image_resized) {
 	max-width: 50%;
 }
 /* ckeditor5-image/theme/imagestyle.css */
-.ck-content .image-style-side,
-.ck-content .image-style-align-left,
-.ck-content .image-style-align-center,
-.ck-content .image-style-align-right {
+.ck-content .image-style-side:not(.image_resized), .ck-content .image-style-align-left:not(.image_resized), .ck-content .image-style-align-center:not(.image_resized), .ck-content .image-style-align-right:not(.image_resized) {
 	max-width: 50%;
 }
 /* ckeditor5-image/theme/imagestyle.css */
@@ -181,9 +174,23 @@ Below there is a full list of content styles used by editor features. You can co
 	padding-right: 1.5em;
 	padding-left: 1.5em;
 	margin-left: 0;
+	margin-right: 0;
 	font-style: italic;
 	border-left: solid 5px hsl(0, 0%, 80%);
 }
+/* ckeditor5-block-quote/theme/blockquote.css */
+.ck-content[dir="rtl"] blockquote {
+	border-left: 0;
+	border-right: solid 5px hsl(0, 0%, 80%);
+}
+/* ckeditor5-image/theme/imageuploadprogress.css */
+.ck-content .image {
+	position: relative;
+}
+/* ckeditor5-image/theme/imageuploadprogress.css */
+.ck-content .image.ck-appear {
+	animation: fadeIn 700ms;
+}
 /* ckeditor5-media-embed/theme/mediaembed.css */
 .ck-content .media {
 	clear: both;

+ 4 - 0
scripts/docs/content-styles/ckeditor.js

@@ -22,11 +22,13 @@ import EasyImage from '@ckeditor/ckeditor5-easy-image/src/easyimage';
 import Heading from '@ckeditor/ckeditor5-heading/src/heading';
 import Image from '@ckeditor/ckeditor5-image/src/image';
 import ImageCaption from '@ckeditor/ckeditor5-image/src/imagecaption';
+import ImageResize from '@ckeditor/ckeditor5-image/src/imageresize';
 import ImageStyle from '@ckeditor/ckeditor5-image/src/imagestyle';
 import ImageToolbar from '@ckeditor/ckeditor5-image/src/imagetoolbar';
 import ImageUpload from '@ckeditor/ckeditor5-image/src/imageupload';
 import Link from '@ckeditor/ckeditor5-link/src/link';
 import List from '@ckeditor/ckeditor5-list/src/list';
+import TodoList from '@ckeditor/ckeditor5-list/src/todolist';
 import MediaEmbed from '@ckeditor/ckeditor5-media-embed/src/mediaembed';
 import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
 import PasteFromOffice from '@ckeditor/ckeditor5-paste-from-office/src/pastefromoffice';
@@ -56,11 +58,13 @@ ClassicEditor.builtinPlugins = [
 	Heading,
 	Image,
 	ImageCaption,
+	ImageResize,
 	ImageStyle,
 	ImageToolbar,
 	ImageUpload,
 	Link,
 	List,
+	TodoList,
 	MediaEmbed,
 	Paragraph,
 	PasteFromOffice,