import styled from 'styled-components';
import {spacing} from '@propellerads/stylevariables';

const StyledEmptyState = styled.div`
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 ${spacing * 5}px;
`;

const StyledEmptyStateIcon = styled.div`
  margin-bottom: ${spacing * 9}px;
`;

const StyledEmptyStateDescription = styled.div`
  margin-bottom: ${spacing * 4}px;
`;

const StyledEmptyStateActions = styled.div`
  margin-top: ${spacing * 5}px;
`;

export {
  StyledEmptyState,
  StyledEmptyStateIcon,
  StyledEmptyStateDescription,
  StyledEmptyStateActions,
};