import { trigger, style, transition, animate, query, state } from '@angular/animations';

export const circleAnimation = trigger('circle', [
  state(
    'one',
    style({
      opacity: 0,
      height: 0,
    })
  ),
  state(
    'two',
    style({
      opacity: 1,
      height: '*',
      marginBottom: '20px',
    })
  ),
  transition('one => two', [
    animate(
      '300ms 400ms ease-out',
      style({
        opacity: 1,
        height: '*',
        marginBottom: '20px',
      })
    ),
  ]),
]);
