I’m building a web toy using the kotlinx DSL, and trying to do the equivalent of adding transition: color 1s. I expect that within a css {} block, I should either be setting transition or be setting transitionProperty + transitionDuration.
Is this right? If so, how? The Transition(), TransitionProperty() and TransitionDuration() constructors don’t seem to take any arguments, and there don’t seem to be any class properties to refer to. I wonder if maybe my IntelliJ is somehow misconfigured, because the source on github does have constructors with parameters.
So I had a very weird time with this, but I eventually found A way to do it. Not sure if this will or would benefit anyone since this was a while back but I found out you can do it like this:
// this in the setup of the css code
val transitions = Transitions()
transitions += Transition("transform", 0.3.s, Timing.easeOut)
transitions += Transition("box-shadow", 0.3.s, Timing.ease)
transitions += Transition("background-color", 0.4.s, Timing.ease)
// on whichever property the transition belongs to
transition = transitions
I’m sure there are better ways to do it other than how I did but so far this is what I learned. Also jetbrains should add the link to the api docs in their actual ktor documentation: HTML DSL | Ktor Documentation
CSS dsl API
EDIT
I found you can also use Transitions().apply {this += Transition(...), ...}
There should at least be some examples in these API docs or in the ktor documentation site
I wonder if it can be expressed as a chain of .add() calls. I will have to fire up the old app and see. It sort of stalled here because engine and unit tests are fun, but UI is such a pita.
