Add attribute support
Opened this issue · 1 comments
lukeapage commented
from: kss-node/kss-node#52
What if my modifiers are not always class names?
E.g. I often use ARIA role attributes as modifiers:
.btn[aria-disabled="true"] { ... }
I did not find any practicable solution to document those.
Didel commented
How about we just use the same notation as in the css attribute selector (https://www.w3schools.com/css/css_attribute_selectors.asp) :
/*
Component with attributes
.active - The component when it also has the '.active' class.
:hover - The hover styling for this component.
[disabled] - The component with the disabled attribute.
[disabled]:hover - the component with the disabled attribute when it is hovered.
[width="500"] - The component with the width attribute that has a value of 500.
[href^="mailto"] - The component if the href attribute starts with 'mailto'.
*/