@comparaonline/ui-transitions

Helpers to build CSS transitions

Usage no npm install needed!

<script type="module">
  import comparaonlineUiTransitions from 'https://cdn.skypack.dev/@comparaonline/ui-transitions';
</script>

README

@comparaonline/ui-transitions

Helpers to build CSS transitions

Installation

yarn add @comparaonline/ui-transitions

Usage

import transitions from '@comparaonline/ui-transitions';

It returns an object with the following data

{
  easing: {
    easeIn: 'cubic-bezier(0.4,0,1,1)',
    easeInOut: 'cubic-bezier(0.4,0,0.2,1)',
    easeOut: 'cubic-bezier(0,0,0.2,1)',
    sharp: 'cubic-bezier(0.4,0,0.6,1)'
  },
  duration: {
    shortest: 150,
    shorter: 200,
    short: 250,
    standard: 300,
    complex: 375,
    enteringScreen: 225,
    leavingScreen: 195
  }
}