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

export function routerTransition() {
  return fadeOutAndIn();
}

export function fadeOutAndIn() {
  return trigger('routerTransition', [
    transition(':enter', [
      style({opacity: '0', position: 'fixed', width: '100%'}),
      animate('0.15s ease-in-out', style({opacity: '1', position: 'fixed', width: '100%'}))
    ]),
    transition(':leave', [
      style({opacity: '1', position: 'fixed', width: '100%'}),
      animate('0.15s ease-in-out', style({opacity: '0', position: 'fixed', width: '100%'}))
    ])
  ]);
}