Adds a utility createRule
function that creates CSSRule
objects. The .createRule
function offers the following features:
- It creates plain
CSSRule
s and ones that with media query. - It places
CSSRules
s with media query into a different style sheet, because placing them in the same style sheet throws. - It adds to the rule object index property
rule.index
, which is that rule's insertion index in the style sheet. - In case rule has media query, the returned media query rule will still have top
level
.style
and.styleMap
properties, which can be used to set the styling.
nano.createRule(selector, mediaQueryAtRulePrelude?);
Create CSSRule
object.
const rule = nano.createRule('.my-component');
const rule = nano.createRule('.my-component', '@media only screen and (max-width: 600px)');
Use rule
object to set CSS.
rule.style.color = 'red';
rule.style.setProperty('color', 'green');
Simply install cssom
addon.
Read more about the Addon Installation.