I wanted to create theme like this:
extendTheme({
textStyles: {
title: {
fontSize: "40px",
fontWeight: "500",
letterSpacing: '-0.6px',
lineHeight: '48px'
}
},
transition: {
custom: {
property: 'transform',
duration: '0.5s',
easing: 'ease-in-out'
}
}
})
and then just use my transition like
<Box textStyle={'title'} transition={'custom.transform'} /* or transition='custom', whatever */>
or anything like that, but I can't really define it in the way that I could just use variable in jsx. Is there a way to do it?