import ContestInfoTag from "../../../../ContestInfoTag/index.js";
import { ContestName } from "../../../../index.js";
import { useContainerResponsiveValues } from "../../../../../../hooks/breakpoint/index.js";
import classes from './styles.module.scss';
const GeneralHeader = function GeneralHeader(props) {
  const {
    contestId
  } = props;
  const infoTagSize = useContainerResponsiveValues({
    xs: '000',
    md: '100',
    lg: '200'
  });
  return <div className={classes.container}>
      <h3 className={classes.title}>
        <ContestName id={contestId} />
      </h3>
      <div className={classes.info}>
        <ContestInfoTag size={infoTagSize} showRating={false} contestId={contestId} />
      </div>
    </div>;
};
export default GeneralHeader;