import styled from '@emotion/styled';
import PropTypes from 'prop-types';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
function PageHeader({
  title = '',
  subTitle = ''
}) {
  return /*#__PURE__*/_jsxs(Content, {
    children: [/*#__PURE__*/_jsx("div", {
      className: "title",
      children: title
    }), /*#__PURE__*/_jsx("div", {
      className: "sub-title",
      children: subTitle
    })]
  });
}
const Content = styled.div`
  text-align: center;

  .title {
    font-size: 24px;
    font-weight: 400;
    color: ${props => props.theme.palette.common.black};
  }

  .sub-title {
    margin: 0 auto;
    max-width: 90%;
    font-size: 14px;
    color: ${props => props.theme.palette.grey[600]};
  }
`;
export default PageHeader;
PageHeader.propTypes = {
  title: PropTypes.string,
  subTitle: PropTypes.string
};