import { Box, Grid, GridItem, LoadingPlaceholder } from '@nova-hf/ui';
import React from 'react';

export const StillingarLoader = () => {
  return (
    <Box marginY={8}>
      <Grid gridTemplate={{ sm: 6, md: 12 }}>
        <GridItem gridColumn={{ sm: 'span12' }}>
          <LoadingPlaceholder height={4} width="3/12" />
        </GridItem>
        <GridItem gridColumn={{ sm: 'span12' }}>
          <LoadingPlaceholder height={2} width="4/12" />
        </GridItem>
        <GridItem gridColumn={{ sm: 'span6', md: 'span4' }}>
          <LoadingPlaceholder height={5} width="100%" />
        </GridItem>
        <GridItem gridColumn={{ sm: 'span6', md: 'span4' }}>
          <LoadingPlaceholder height={5} width="100%" />
        </GridItem>
        <GridItem gridColumn={{ sm: 'span6', md: 'span4' }} />
      </Grid>
    </Box>
  );
};