diff --git a/.stylelintrc b/.stylelintrc index 6cd8ecd2c98..594ca3ac82c 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -1,7 +1,7 @@ { "extends": "stylelint-config-ckeditor5", "plugins": [ - "stylelint-plugin-ckeditor5-rules/lib/license-header" + "stylelint-plugin-ckeditor5-rules" ], "ignoreFiles": [ "**/dist/**", diff --git a/docs/framework/contributing/code-style.md b/docs/framework/contributing/code-style.md index 7505f7f48fa..2021ae9d54f 100644 --- a/docs/framework/contributing/code-style.md +++ b/docs/framework/contributing/code-style.md @@ -1228,3 +1228,29 @@ This rule ensures that SVG files are imported and exported only in the `@ckedito ### Valid changelog entries This rule ensures that changelog entry files are populated with proper data and a clear description of the change. For a full guide on how to populate changelog entries, see the {@link framework/contributing/changelog-entries Changelog entries} guide. + +## CKEditor 5 custom Stylelint rules + +In addition to the rules provided by Stylelint, CKEditor 5 uses a few custom rules described below. + +### Names of CSS variables within `.ck-content`: `ckeditor5-rules/ck-content-variable-name` + +This rule aims to enforce convention of all variables targeting styling of elements within the editor (`.ck-content`) using a common prefix (`--ck-content-*`) + +👎  Example of incorrect code for this rule: + +```css +.ck-content { + width: var(--variable-name); +} +``` + +👍  Example of correct code for this rule: + +```css +.ck-content { + width: var(--ck-content-variable-name); +} +``` + +[History of the change.](https://github.com/ckeditor/ckeditor5/issues/18805) diff --git a/package.json b/package.json index ff2ce978395..27a0528caf0 100644 --- a/package.json +++ b/package.json @@ -135,9 +135,9 @@ "date-fns": "^4.0.0", "esbuild": "^0.25.0", "eslint": "^9.26.0", - "eslint-config-ckeditor5": "^11.0.0", + "eslint-config-ckeditor5": "^12.0.0", "eslint-formatter-stylish": "^8.40.0", - "eslint-plugin-ckeditor5-rules": "^11.0.0", + "eslint-plugin-ckeditor5-rules": "^12.0.0", "eslint-plugin-import": "^2.31.0", "estree-walker": "^3.0.3", "fs-extra": "^11.0.0", @@ -160,7 +160,7 @@ "schema-utils": "^4.2.0", "sharp": "^0.34.2", "stylelint": "^16.0.0", - "stylelint-config-ckeditor5": "^11.0.0", + "stylelint-config-ckeditor5": "^12.0.0", "svgo": "^3.3.2", "table": "^6.8.1", "terser-webpack-plugin": "^5.0.0",