import React from 'react';
import { Grid } from '@/atoms/grid';
import { Typo } from '@/atoms/typo';
import { type CurriculumSectionTitleContents } from '@/types/curriculumContents.type';

function SectionTitle(props: CurriculumSectionTitleContents): React.ReactNode {
  const { title, duration } = props;
  return (
    <Grid align="center" columns="1fr auto" px="3" py="2">
      <Typo color="gray">{title}</Typo>
      <Typo color="gray" variant="caption">
        {duration}분
      </Typo>
    </Grid>
  );
}

export default SectionTitle;
