Skip to main content

function-name-case

Specify lowercase or uppercase for function names.

a { width: calc(5% - 10em); }
/** ↑
* This function */

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

The fix option can automatically fix all of the problems reported by this rule.

The message secondary option can accept the arguments of this rule.

Options

string: "lower"|"upper"

"lower"

The following patterns are considered problems:

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 problems:

a {
width: calc(5% - 10em);
}
a {
background: -webkit-radial-gradient(red, green, blue);
}

"upper"

The following patterns are considered problems:

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 problems:

a {
width: CALC(5% - 10em);
}
a {
background: -WEBKIT-RADIAL-GRADIENT(red, green, blue);
}

Optional secondary options

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

Ignore case of function names.

For example, with "lower".

Given:

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

The following patterns are considered problems:

a {
color: --sOmE-FuNcTiOn();
}
a {
color: --GetColor();
}
a {
color: --GET_COLOR();
}

The following patterns are not considered problems:

a {
display: --some-function();
}
a {
display: --getColor();
}
a {
display: --get_color();
}