import styled from 'styled-components/macro';

import { ZIndex } from '../../constans/zIndex';

export const StyledPopper = styled.div`
  z-index: ${ZIndex.Dropdown};
`;

export const animationDuration = 100;

export const StyledContainer = styled.div`
  &.enter {
    opacity: 0;
  }

  &.enter-active {
    opacity: 1;
    transition: opacity ${animationDuration}ms linear;
  }

  &.exit {
    opacity: 1;
  }

  &.exit-active {
    opacity: 0;
    transition: opacity ${animationDuration}ms linear;
  }
`;