blob: 1de02815f3fcd3674ea791d5fed7900e652a7a14 [file] [log] [blame] [view]
# value-keyword-case
Specify lowercase or uppercase for keywords values.
```css
a { display: block; }
/** ↑
* These values */
```
This rule ignores [`<custom-idents>`](https://developer.mozilla.org/en/docs/Web/CSS/custom-ident) of known properties. Values which are paired with non-properties (e.g. `$vars` and custom properties), and do not conform to the primary option, can be ignored using the `ignoreValues: []` secondary option.
The `--fix` option on the [command line](../../../docs/user-guide/cli.md#autofixing-errors) can automatically fix all of the problems reported by this rule.
## Options
`string`: `"lower"|"upper"`
### `"lower"`
The following patterns are considered violations:
```css
a {
display: Block;
}
```
```css
a {
display: bLoCk;
}
```
```css
a {
display: BLOCK;
}
```
```css
a {
transition: -WEBKIT-TRANSFORM 2s;
}
```
The following patterns are *not* considered violations:
```css
a {
display: block;
}
```
```css
a {
transition: -webkit-transform 2s;
}
```
### `"upper"`
The following patterns are considered violations:
```css
a {
display: Block;
}
```
```css
a {
display: bLoCk;
}
```
```css
a {
display: block;
}
```
```css
a {
transition: -webkit-transform 2s;
}
```
The following patterns are *not* considered violations:
```css
a {
display: BLOCK;
}
```
```css
a {
transition: -WEBKIT-TRANSFORM 2s;
}
```
## Optional secondary options
### `ignoreKeywords: ["/regex/", /regex/, "non-regex"]`
Ignore case of keywords values.
For example, with `"lower"`.
Given:
```js
["Block", "/^(f|F)lex$/"]
```
The following patterns are considered violations:
```css
a {
display: bLoCk;
}
```
```css
a {
display: BLOCK;
}
```
```css
a {
display: fLeX;
}
```
```css
a {
display: FLEX;
}
```
The following patterns are *not* considered violations:
```css
a {
display: block;
}
```
```css
a {
display: Block;
}
```
```css
a {
display: flex;
}
```
```css
a {
display: Flex;
}
```
### `ignoreProperties: ["/regex/", /regex/, "non-regex"]`
Ignore case of the values of the listed properties.
For example, with `"lower"`.
```js
["/^(b|B)ackground$/", "display"]
```
The following patterns are considered violations:
```css
a {
text-align: LEFT;
}
```
```css
a {
text-align: Left;
}
```
The following patterns are *not* considered violations:
```css
a {
display: bloCk;
}
```
```css
a {
display: BloCk;
}
```
```css
a {
display: BLOCK;
}
```
```css
a {
display: block;
}
```
```css
a {
background: Red;
}
```
```css
a {
Background: deepPink;
}
```