import styled from 'styled-components';

export const BlockColumnWrapper = styled.div<{
  columnWidth: number;
  numColumns: number;
}>`
  display: grid;
  grid-template-columns: repeat(
    ${({ numColumns }) => numColumns},
    ${({ columnWidth }) => columnWidth}px
  );
  grid-column-gap: 4px;
`;

export const InnerGrid = styled.div`
  display: flex;
  flex-direction: column;
`;

export const SelectableBlockSpacer = styled.div`
  margin: 2px;
`;