add docs for stylelint rule syntax (#849)

Author: romainmenke

plugins/postcss-conditional-values/README.md

@@ -119,6 +119,25 @@ color: csstools-if(--a-condition yellow else red);
 csstools-if(<custom-property-name> <declaration-value> else <declaration-value>);
 ```
 
+#### [Stylelint](https://stylelint.io/user-guide/rules/declaration-property-value-no-unknown/#propertiessyntax--property-syntax-)
+
+Stylelint is able to check for unknown property values.
+Setting the correct configuration for this rule makes it possible to check even non-standard syntax.
+
+```js
+	// Disallow unknown values for properties within declarations.
+	'declaration-property-value-no-unknown': [
+		true,
+		{
+			propertiesSyntax: {
+				color: '| csstools-if( <custom-property-name> <\'color\'> else <\'color\'> )',
+				'background-color': '| csstools-if( <custom-property-name> <\'background-color\'> else <\'background-color\'> )',
+				// ... more properties ...
+			},
+		},
+	],
+```
+
 ### `true` and `false` keywords
 
 The `true` and `false` keywords are syntactic sugar for `initial` and `<space>`.

plugins/postcss-conditional-values/docs/README.md

@@ -73,6 +73,25 @@ color: csstools-if(--a-condition yellow else red);
 csstools-if(<custom-property-name> <declaration-value> else <declaration-value>);
 ```
 
+#### [Stylelint](https://stylelint.io/user-guide/rules/declaration-property-value-no-unknown/#propertiessyntax--property-syntax-)
+
+Stylelint is able to check for unknown property values.
+Setting the correct configuration for this rule makes it possible to check even non-standard syntax.
+
+```js
+	// Disallow unknown values for properties within declarations.
+	'declaration-property-value-no-unknown': [
+		true,
+		{
+			propertiesSyntax: {
+				color: '| csstools-if( <custom-property-name> <\'color\'> else <\'color\'> )',
+				'background-color': '| csstools-if( <custom-property-name> <\'background-color\'> else <\'background-color\'> )',
+				// ... more properties ...
+			},
+		},
+	],
+```
+
 ### `true` and `false` keywords
 
 The `true` and `false` keywords are syntactic sugar for `initial` and `<space>`.

plugins/postcss-design-tokens/README.md

@@ -379,6 +379,27 @@ design-token() = design-token( <token-path> [ to <unit> ]? )
 The plugin can convert `px` to `rem` and `rem` to `px` via the [`unitsandvalues`](#unitsandvalues) plugin options.
 When a design token is unit-less any `unit` can be assigned with `to`.
 
+#### [Stylelint](https://stylelint.io/user-guide/rules/declaration-property-value-no-unknown/#propertiessyntax--property-syntax-)
+
+Stylelint is able to check for unknown property values.
+Setting the correct configuration for this rule makes it possible to check even non-standard syntax.
+
+```js
+	// Disallow unknown values for properties within declarations.
+	'declaration-property-value-no-unknown': [
+		true,
+		{
+			propertiesSyntax: {
+				color: '| <design-token()>',
+				// ... more properties ...
+			},
+			typesSyntax: {
+				'<design-token()>': 'design-token( <string> [ to <ident> ]? )',
+			},
+		},
+	],
+```
+
 ## Further reading
 
 - [Why we think PostCSS Design Tokens is needed]

plugins/postcss-design-tokens/docs/README.md

@@ -248,6 +248,27 @@ design-token() = design-token( <token-path> [ to <unit> ]? )
 The plugin can convert `px` to `rem` and `rem` to `px` via the [`unitsandvalues`](#unitsandvalues) plugin options.
 When a design token is unit-less any `unit` can be assigned with `to`.
 
+#### [Stylelint](https://stylelint.io/user-guide/rules/declaration-property-value-no-unknown/#propertiessyntax--property-syntax-)
+
+Stylelint is able to check for unknown property values.
+Setting the correct configuration for this rule makes it possible to check even non-standard syntax.
+
+```js
+	// Disallow unknown values for properties within declarations.
+	'declaration-property-value-no-unknown': [
+		true,
+		{
+			propertiesSyntax: {
+				color: '| <design-token()>',
+				// ... more properties ...
+			},
+			typesSyntax: {
+				'<design-token()>': 'design-token( <string> [ to <ident> ]? )',
+			},
+		},
+	],
+```
+
 ## Further reading
 
 - [Why we think PostCSS Design Tokens is needed]