storybook-addon-pseudo-states
storybook-addon-pseudo-states copied to clipboard
Ignore comment to prevent CSS generation (or negate `:not(:focus)`)
trafficstars
We have an element that uses a :not(:focus) rule with visually-hidden styling.
This works fine in production but in Storybook the rules are almost always applied.
I was hoping v3.1.1 would fix it, but it made the issue even harder to work around. Prior we had one additional rule, now we have two: :not(:focus), :not(.pseudo-focus), :not(.pseudo-focus-all *).
This means to test this element not having the rules applied we have to add .pseudo-focus-all to a parent, .pseudo-focus to the element itself, as well as actually focussing the element.
Is there a way to ignore some CSS? (and not add the extra rules) Maybe something like:
:not(:focus) {
/* pseudo-state-ignore */
@include visually-hidden;
}
thanks
Ron