overleaf/services/web/frontend/js/features/settings/components/emails/header.tsx
ilkin-overleaf a9436039b6 Merge pull request #17702 from overleaf/ii-bs5-to-bs3-classname-helper
[web] Bootstrap class name helper

GitOrigin-RevId: 9c2042aa2ea0e4d3828b32c321336e1c3a4a0ef8
2024-04-04 08:04:11 +00:00

52 lines
1.2 KiB
TypeScript

import { useTranslation } from 'react-i18next'
import { Row, Col } from 'react-bootstrap'
import EmailCell from './cell'
import classnames from 'classnames'
import { bsClassName } from '@/features/utils/bootstrap-5'
function Header() {
const { t } = useTranslation()
return (
<>
<Row>
<Col
md={4}
className={bsClassName({
bs5: 'd-none d-sm-block',
bs3: 'hidden-xs',
})}
>
<EmailCell>
<strong>{t('email')}</strong>
</EmailCell>
</Col>
<Col
md={8}
className={bsClassName({
bs5: 'd-none d-sm-block',
bs3: 'hidden-xs',
})}
>
<EmailCell>
<strong>{t('institution_and_role')}</strong>
</EmailCell>
</Col>
</Row>
<div
className={classnames(
bsClassName({ bs5: 'd-none d-sm-block', bs3: 'hidden-xs' }),
'horizontal-divider'
)}
/>
<div
className={classnames(
bsClassName({ bs5: 'd-none d-sm-block', bs3: 'hidden-xs' }),
'horizontal-divider'
)}
/>
</>
)
}
export default Header