Add standard timing functions
For e.g. ease-in-out
Example with JSS:
import {easeInOut} from 'css-functions'
const styles = {
container: {
transition: {
duration: 0.5,
timingFunction: easeInOUt,
}
}
}
@kof and where for example, should be placed frames function?
it can be in timing and you will use it as
import { timing } from 'css-functions'
const styles = {
container: {
transition: {
timingFunction: timing.frames(10),
}
}
}
or this function should be also available as
import { frames } from 'css-functions'
Just thought about it, actually ease-in-out is not a function call, its the function name or a constant. Not sure if they are actually a good fit here.
A cubic-bezier(0.1, 0.7, 1.0, 0.1) timing function is on the other hand a function call.
Also in css all those things are in a global name space, we don't even need to scope them, they can't conflict: import {easeInOut} from 'css-functions' would be actually just fine.
It just doesn't make much sense to import them, because there is not much benefit vs. just using a string directly.