From a4fc5812417278dd290ae1bd447c0d6d0609368f Mon Sep 17 00:00:00 2001 From: Kamil Piechaczek Date: Wed, 24 Mar 2021 09:00:59 +0100 Subject: [PATCH] Docs (ckeditor5): Updated the content styles stylesheet. --- .../guides/integration/content-styles.md | 124 +++++++++--------- scripts/docs/content-styles-details.json | 5 + 2 files changed, 69 insertions(+), 60 deletions(-) diff --git a/docs/builds/guides/integration/content-styles.md b/docs/builds/guides/integration/content-styles.md index 15f1a661902..119ab656255 100644 --- a/docs/builds/guides/integration/content-styles.md +++ b/docs/builds/guides/integration/content-styles.md @@ -48,8 +48,8 @@ Below there is a full list of content styles used by the editor features. You ca ```css /* - * CKEditor 5 (v26.0.0) content styles. - * Generated on Wed, 03 Mar 2021 08:21:28 GMT. + * CKEditor 5 (v27.0.0) content styles. + * Generated on Wed, 24 Mar 2021 08:00:59 GMT. * For more information, check out https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/content-styles.html */ @@ -82,6 +82,33 @@ Below there is a full list of content styles used by the editor features. You ca .ck-content .text-huge { font-size: 1.8em; } +/* ckeditor5-code-block/theme/codeblock.css */ +.ck-content pre { + padding: 1em; + color: hsl(0, 0%, 20.8%); + background: hsla(0, 0%, 78%, 0.3); + border: 1px solid hsl(0, 0%, 77%); + border-radius: 2px; + text-align: left; + direction: ltr; + tab-size: 4; + white-space: pre-wrap; + font-style: normal; + min-width: 200px; +} +/* ckeditor5-code-block/theme/codeblock.css */ +.ck-content pre code { + background: unset; + padding: 0; + border-radius: 0; +} +/* ckeditor5-horizontal-line/theme/horizontalline.css */ +.ck-content hr { + margin: 15px 0; + height: 4px; + background: hsl(0, 0%, 87%); + border: 0; +} /* ckeditor5-highlight/theme/highlight.css */ .ck-content .marker-yellow { background-color: var(--ck-highlight-marker-yellow); @@ -108,6 +135,38 @@ Below there is a full list of content styles used by the editor features. You ca color: var(--ck-highlight-pen-green); background-color: transparent; } +/* ckeditor5-image/theme/imagestyle.css */ +.ck-content .image-style-side { + float: right; + margin-left: var(--ck-image-style-spacing); + max-width: 50%; +} +/* ckeditor5-image/theme/imagestyle.css */ +.ck-content .image-style-align-left { + float: left; + margin-right: var(--ck-image-style-spacing); +} +/* ckeditor5-image/theme/imagestyle.css */ +.ck-content .image-style-align-center { + margin-left: auto; + margin-right: auto; +} +/* ckeditor5-image/theme/imagestyle.css */ +.ck-content .image-style-align-right { + float: right; + margin-left: var(--ck-image-style-spacing); +} +/* ckeditor5-image/theme/imagecaption.css */ +.ck-content .image > figcaption { + display: table-caption; + caption-side: bottom; + word-break: break-word; + color: hsl(0, 0%, 20%); + background-color: hsl(0, 0%, 97%); + padding: .6em; + font-size: .75em; + outline-offset: -1px; +} /* ckeditor5-image/theme/image.css */ .ck-content .image { display: table; @@ -122,17 +181,6 @@ Below there is a full list of content styles used by the editor features. You ca max-width: 100%; min-width: 50px; } -/* ckeditor5-image/theme/imagecaption.css */ -.ck-content .image > figcaption { - display: table-caption; - caption-side: bottom; - word-break: break-word; - color: hsl(0, 0%, 20%); - background-color: hsl(0, 0%, 97%); - padding: .6em; - font-size: .75em; - outline-offset: -1px; -} /* ckeditor5-image/theme/imageresize.css */ .ck-content .image.image_resized { max-width: 100%; @@ -147,33 +195,9 @@ Below there is a full list of content styles used by the editor features. You ca .ck-content .image.image_resized > figcaption { display: block; } -/* ckeditor5-horizontal-line/theme/horizontalline.css */ -.ck-content hr { - margin: 15px 0; - height: 4px; - background: hsl(0, 0%, 87%); - border: 0; -} -/* ckeditor5-image/theme/imagestyle.css */ -.ck-content .image-style-side { - float: right; - margin-left: var(--ck-image-style-spacing); - max-width: 50%; -} -/* ckeditor5-image/theme/imagestyle.css */ -.ck-content .image-style-align-left { - float: left; - margin-right: var(--ck-image-style-spacing); -} -/* ckeditor5-image/theme/imagestyle.css */ -.ck-content .image-style-align-center { - margin-left: auto; - margin-right: auto; -} -/* ckeditor5-image/theme/imagestyle.css */ -.ck-content .image-style-align-right { - float: right; - margin-left: var(--ck-image-style-spacing); +/* ckeditor5-language/theme/language.css */ +.ck-content span[lang] { + font-style: italic; } /* ckeditor5-block-quote/theme/blockquote.css */ .ck-content blockquote { @@ -345,26 +369,6 @@ Below there is a full list of content styles used by the editor features. You ca min-width: 15em; font-style: normal; } -/* ckeditor5-code-block/theme/codeblock.css */ -.ck-content pre { - padding: 1em; - color: hsl(0, 0%, 20.8%); - background: hsla(0, 0%, 78%, 0.3); - border: 1px solid hsl(0, 0%, 77%); - border-radius: 2px; - text-align: left; - direction: ltr; - tab-size: 4; - white-space: pre-wrap; - font-style: normal; - min-width: 200px; -} -/* ckeditor5-code-block/theme/codeblock.css */ -.ck-content pre code { - background: unset; - padding: 0; - border-radius: 0; -} /* ckeditor5-mention/theme/mention.css */ .ck-content .mention { background: var(--ck-color-mention-background); diff --git a/scripts/docs/content-styles-details.json b/scripts/docs/content-styles-details.json index a2d08653d7b..1a96ba2d389 100644 --- a/scripts/docs/content-styles-details.json +++ b/scripts/docs/content-styles-details.json @@ -33,6 +33,8 @@ "packages/ckeditor5-ckfinder/src/ckfinderediting.js": "Ckfinderediting", "packages/ckeditor5-ckfinder/src/ckfinderui.js": "Ckfinderui", "packages/ckeditor5-clipboard/src/clipboard.js": "Clipboard", + "packages/ckeditor5-clipboard/src/clipboardpipeline.js": "Clipboardpipeline", + "packages/ckeditor5-clipboard/src/dragdrop.js": "Dragdrop", "packages/ckeditor5-clipboard/src/pasteplaintext.js": "Pasteplaintext", "packages/ckeditor5-code-block/src/codeblock.js": "Codeblock", "packages/ckeditor5-code-block/src/codeblockediting.js": "Codeblockediting", @@ -94,6 +96,9 @@ "packages/ckeditor5-indent/src/indentblock.js": "Indentblock", "packages/ckeditor5-indent/src/indentediting.js": "Indentediting", "packages/ckeditor5-indent/src/indentui.js": "Indentui", + "packages/ckeditor5-language/src/textpartlanguage.js": "Textpartlanguage", + "packages/ckeditor5-language/src/textpartlanguageediting.js": "Textpartlanguageediting", + "packages/ckeditor5-language/src/textpartlanguageui.js": "Textpartlanguageui", "packages/ckeditor5-link/src/autolink.js": "Autolink", "packages/ckeditor5-link/src/link.js": "Link", "packages/ckeditor5-link/src/linkediting.js": "Linkediting",