Newer
Older
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
import Button from '@material-ui/core/Button'
import GasBillIcon from 'assets/icons/visu/onboarding/gas_bill.svg'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import React from 'react'
import { decoreText } from 'utils/decoreText'
import '../connection.scss'
interface GrdfBillProps {
togglePartnerConnectionModal: () => void
}
const GrdfBill = ({ togglePartnerConnectionModal }: GrdfBillProps) => {
const { t } = useI18n()
return (
<div className="connection-form">
<p className={'connection-form-title grdfgrandlyon text-20-bold'}>
{t('auth.grdfgrandlyon.no_account.title')}
</p>
<StyledIcon icon={GasBillIcon} size={180} />
<p className={'connection-form-subtitle grdfgrandlyon text-16-regular'}>
{decoreText(t('auth.grdfgrandlyon.bill'))}
</p>
<div className="connection-form-button">
<Button
aria-label={t('auth.grdfgrandlyon.accessibility.connect')}
onClick={togglePartnerConnectionModal}
classes={{
root: 'btn-highlight',
label: 'text-16-bold',
}}
>
{t('auth.grdfgrandlyon.connect')}
</Button>
</div>
</div>
)
}
export default GrdfBill