Entry Animation

Reference

shilp.config.jscopy to clipboard
/** @type {import('shilpcss/types').ShilpConfig} */
const shilpConfig = {
  source: "react",

  properties: {
    animate: {
      enter: {
        property: "<v>",
        special: true,
        values: {
          DEFAULT: `
            animation-name: enter<i>;
            animation-duration: 0.25s<i>;
          `,
          unset: `
            --entr-opct: unset<i>;
            --entr-scl: unset<i>;
            --entr-rtt: unset<i>;
            --entr-mv-x: unset<i>;
            --entr-mv-y: unset<i>;
          `,
        },
      },
    },
  },
};

export default shilpConfig;