Merge pull request #63 from ckeditor/i/6636

Fix: Font size styles should be prefixed by the `.ck-content` class. Closes ckeditor/ckeditor5#6636.
ckeditor · Apr 22, 2020 · b0b06db · b0b06db
2 parents 83a7711 + 01cdfc8
commit b0b06db
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 15 deletions.
diff --git a/docs/features/font.md b/docs/features/font.md
@@ -94,19 +94,19 @@ The CSS definition for the classes (presets) must be included in the web page st
 Here is an example of the font size CSS classes:
 
 ```css
-.text-tiny {
+.ck-content .text-tiny {
 	font-size: 0.7em;
 }
 
-.text-small {
+.ck-content .text-small {
 	font-size: 0.85em;
 }
 
-.text-big {
+.ck-content .text-big {
 	font-size: 1.4em;
 }
 
-.text-huge {
+.ck-content .text-huge {
 	font-size: 1.8em;
 }
 ```

diff --git a/theme/fontsize.css b/theme/fontsize.css
@@ -3,18 +3,24 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
-.text-tiny {
-	font-size: .7em;
-}
+/* The values should be synchronized with the "FONT_SIZE_PRESET_UNITS" object in the "/src/fontsize/utils.js" file. */
 
-.text-small {
-	font-size: .85em;
-}
+/* Styles should be prefixed with the `.ck-content` class.
+See https://github.com/ckeditor/ckeditor5/issues/6636 */
+.ck-content {
+	& .text-tiny {
+		font-size: .7em;
+	}
 
-.text-big {
-	font-size: 1.4em;
-}
+	& .text-small {
+		font-size: .85em;
+	}
+
+	& .text-big {
+		font-size: 1.4em;
+	}
 
-.text-huge {
-	font-size: 1.8em;
+	& .text-huge {
+		font-size: 1.8em;
+	}
 }