@kiwicom/smart-faq/src/SmartFAQ/common/Loader.js

// @flow

import * as React from 'react';
import styled from 'styled-components';

import SpinnerImage from '../../static/spinner@2x.png';

type Props = {|
  fullHeight?: boolean,
|};

const Wrapper = styled.div`
  display: flex;
  flex: 1;
  height: ${props => (props.fullHeight ? '100%' : 'auto')};
  justify-content: center;
  align-items: center;
`;

const Spinner = styled.img`
  width: 140px;
  animation: spin 1.5s linear infinite;
  @keyframes spin {
    0% { transform rotate(0deg); }
    100% { transform rotate(359deg); }
  }
`;

const Loader = ({ fullHeight }: Props) => (
  <Wrapper fullHeight={fullHeight}>
    <Spinner src={SpinnerImage} alt="" />
  </Wrapper>
);

export default Loader;