function-name-case.md

Pattern: Inconsistent function name case

Issue: -

Description

Specify lowercase or uppercase for function names. Camel case function names, e.g. translateX, are accounted for when the lower option is used.

Examples

"lower"

The following patterns are considered violations:

a {
  width: Calc(5% - 10em);
}

a {
  width: cAlC(5% - 10em);
}

a {
  width: CALC(5% - 10em);
}

a {
  background: -WEBKIT-RADIAL-GRADIENT(red, green, blue);
}

The following patterns are not considered violations:

a {
  width: calc(5% - 10em);
}

a {
  background: -webkit-radial-gradient(red, green, blue);
}

"upper"

The following patterns are considered violations:

a {
  width: Calc(5% - 10em);
}

a {
  width: cAlC(5% - 10em);
}

a {
  width: calc(5% - 10em);
}

a {
  background: -webkit-radial-gradient(red, green, blue);
}

The following patterns are not considered violations:

a {
  width: CALC(5% - 10em);
}

a {
  background: -WEBKIT-RADIAL-GRADIENT(red, green, blue);
}

Configuration

ignoreFunctions: ["/regex/", "non-regex"]

Ignore case of function names.

For example, with "lower".

Given:

["some-function", "/^get.*$/"]

The following patterns are considered violations:

a {
  color: sOmE-FuNcTiOn();
}

a {
  color: some-other-function();
}

a {
  color: GetColor();
}

a {
  color: GET_COLOR();
}

The following patterns are not considered violations:

a {
  display: some-function();
}

a {
  display: getColor();
}

a {
  display: get_color();
}

Further Reading

• stylelint - function-name-case