webapp/src/components/Discours/Banner.tsx
2024-07-04 00:25:03 +03:00

34 lines
1.1 KiB
TypeScript

import { clsx } from 'clsx'
import { useUI } from '~/context/ui'
import { useLocalize } from '../../context/localize'
import { Image } from '../_shared/Image'
import styles from './Banner.module.scss'
export default () => {
const { t } = useLocalize()
const { showModal } = useUI()
return (
<div class={styles.discoursBanner}>
<div class="wide-container">
<div class="row">
<div class={clsx(styles.discoursBannerContent, 'col-lg-10')}>
<h3>{t('Discours exists because of our common effort')}</h3>
<p>
<a href="/guide/support">{t('Support us')}</a>
<a href="/edit/new">{t('Become an author')}</a>
<a href={''} onClick={() => showModal('auth')}>
{t('Join the community')}
</a>
</p>
</div>
<div class={clsx(styles.discoursBannerImage, 'col-lg-12 offset-lg-2')}>
<Image src="production/image/discours-banner.jpg" alt={t('Discours')} width={600} />
</div>
</div>
</div>
</div>
)
}