import { StaticCalendarButton } from '../../../StaticCalendar';
import { styled } from '../../../styled';
import { Typography } from '../../../Typography';
import { CalendarGridPositions } from '../enums/calendarGridPositions';
export const HeadButton = styled(StaticCalendarButton) `
  display: block;
  grid-area: ${CalendarGridPositions.Head};

  &::first-letter {
    text-transform: capitalize;
  }

  ${({ theme }) => theme.breakpoints.down('sm')} {
    padding: unset;
  }
`;
export const HeadText = styled(Typography) `
  display: block;
  grid-area: ${CalendarGridPositions.Head};
  align-self: center;

  text-align: center;

  &::first-letter {
    text-transform: capitalize;
  }

  ${({ theme }) => theme.breakpoints.down('sm')} {
    font-weight: ${({ theme }) => theme.typography.fontWeightMedium};
  }
`;
