// node modules
import { createUseStyles } from "react-jss";

export const useStyles = createUseStyles({
   enter: {
       opacity: 0,
       transform: 'translateX(20px)',
   },
   enterActive: {
       opacity: 1,
       transform: 'translateX(0)',
       transition: ({ theme: { timeout } }: any) => `opacity ${timeout}ms, transform ${timeout}ms`,
       transitionTimingFunction: 'ease-out'
   },
   exit: {
       opacity: 1
   },
   exitActive: {
       opacity: 0,
       transform: 'translate(20px)',
       transition: ({ theme: { timeout } }: any) => `opacity ${timeout}ms, transform ${timeout}ms`,
   }
});
