"keyframes" addon doesn't like sheet()

[TheBosZ]

In process of converting our project from sass, I ran across a problem with how I was implementing Keyframes for an animation.

I was just using sheet() for all my rules, but noticed that the keyframes addon didn't work.

I switched to using rule() and it worked fine.

I thought sheet() was just a fancy wrapper around rule. If it is, it should handle keyframes the same as rule(). If not, maybe note that in the documentation?

[streamich]

How do you use it? Can you paste an example?

[TheBosZ]

Here's an embed: https://runkit.com/embed/w12vm65kiqky

Note that the .sheet() call generates class names instead of keyframes.

[streamich]

I see, currently sheet treats every key at top level as a class name. I suspect this would work, if you nested @keyframes inside a class name:

nano.sheet({
  foo: {
    '@keyframes ...': {}
  }
});

But then it does not make much sense. In any case, I think we can make keyframes work in sheet as a top level key easily.

[TheBosZ]

I don't know if I should make a separate post, but the keyframes and virtual addons don't work together. The virtual addon tries to virtualize the keyframes and messes it up.

EDIT: It looks like it's a problem with virtual. I'll make a new ticket.