Skip to content

Commit

Permalink
Docs (ckeditor5): Updated the content styles stylesheet.
Browse files Browse the repository at this point in the history
  • Loading branch information
pomek committed Mar 24, 2021
1 parent f709ee5 commit a4fc581
Show file tree
Hide file tree
Showing 2 changed files with 69 additions and 60 deletions.
124 changes: 64 additions & 60 deletions docs/builds/guides/integration/content-styles.md
Original file line number Diff line number Diff line change
Expand Up @@ -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
*/

Expand Down Expand Up @@ -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);
Expand All @@ -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;
Expand All @@ -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%;
Expand All @@ -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 {
Expand Down Expand Up @@ -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);
Expand Down
5 changes: 5 additions & 0 deletions scripts/docs/content-styles-details.json
Original file line number Diff line number Diff line change
Expand Up @@ -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",
Expand Down Expand Up @@ -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",
Expand Down

0 comments on commit a4fc581

Please sign in to comment.