2.8

New feature "custom CSS properties (vars)"

inpsyde/assets now supports via Inpsyde\Assets\Style() to register custom CSS properties (vars).

The new API looks like following:

use Inpsyde\Assets\Style;

$style = new Style('foo', 'www.example.com/style.css');

// to a specific selector/element.
$style->withCssVars(
	'.some-element', 
	['white' => '#fff', 'black' => '000']
);
// or to :root
$style->withCssVars(
	':root', 
	['grey' => '#ddd']
);

The StyleHandler will automatically check if there are CSS vars available via Style::cssVars() and add them via wp_add_inline_style() to your handle.

Registered CSS vars will be automatically prefixed with -- if not present. The example from above will generate following output (prettified for the sake of readability):

<style id="foo-inline-css">
.some-element {
	--white:#fff;
	--black:#000;
}
:root {
	--grey:#ddd;
}
</style>