Ajout modal nous contacter
Jérémy Rialland
Jérémy Rialland
parent
e9a8c69acd
commit
5780b17514
|
|
@ -0,0 +1,71 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
|
||||
import { Message, PopoverWithTrigger } from '@/design-system'
|
||||
import { H2 } from '@/design-system/typography/heading'
|
||||
import { Link, StyledLink } from '@/design-system/typography/link'
|
||||
import { Li, Ul } from '@/design-system/typography/list'
|
||||
import { Body } from '@/design-system/typography/paragraphs'
|
||||
|
||||
export default function Contact() {
|
||||
const { t } = useTranslation()
|
||||
|
||||
return (
|
||||
<PopoverWithTrigger
|
||||
trigger={(buttonProps) => (
|
||||
<Link {...buttonProps} aria-haspopup="dialog" noUnderline>
|
||||
<Trans i18nKey="contact.title">Nous contacter</Trans>
|
||||
</Link>
|
||||
)}
|
||||
title={t('contact.title', 'Nous contacter')}
|
||||
small
|
||||
>
|
||||
<Trans i18nKey="contact.email">
|
||||
<Body>
|
||||
Vous pouvez nous contacter via notre module de retours via le boutton
|
||||
👋 en haut à droite de votre ecran ou directement par mail à l'adresse
|
||||
suivante :{' '}
|
||||
<StyledLink
|
||||
href="mailto:contact@mon-entreprise.beta.gouv.fr"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
contact@mon-entreprise.beta.gouv.fr
|
||||
</StyledLink>
|
||||
</Body>
|
||||
</Trans>
|
||||
<Message type="info" icon>
|
||||
<Trans i18nKey="contact.info">
|
||||
<Body>
|
||||
Nous sommes une petite équipe uniquement affectée au développement
|
||||
du site mon-entreprise.urssaf.fr et des simulateurs associés.
|
||||
<br />
|
||||
Par conséquent, nous n'avons pas accès à la situation personnelle
|
||||
des cotisants (pour des raisons de confidentialité), et nous ne
|
||||
pouvons légalement pas donner de conseil sur une situation
|
||||
spécifique.
|
||||
</Body>
|
||||
</Trans>
|
||||
</Message>
|
||||
<Trans i18nKey="contact.urssaf">
|
||||
<Body>
|
||||
Si vous souhaitez contacter votre Urssaf, vous pouvez utiliser les
|
||||
canaux habituels :
|
||||
</Body>
|
||||
<Ul>
|
||||
<Li>
|
||||
par téléphone :{' '}
|
||||
<Link href="https://www.urssaf.fr/portail/home/votre-urssaf/contacts-telephoniques.html">
|
||||
www.urssaf.fr/portail/home/votre-urssaf/contacts-telephoniques.html
|
||||
</Link>
|
||||
</Li>
|
||||
<Li>
|
||||
par message :{' '}
|
||||
<Link href="https://www.contact.urssaf.fr">
|
||||
www.contact.urssaf.fr
|
||||
</Link>
|
||||
</Li>
|
||||
</Ul>
|
||||
</Trans>
|
||||
</PopoverWithTrigger>
|
||||
)
|
||||
}
|
||||
|
|
@ -3,6 +3,7 @@ import { Trans, useTranslation } from 'react-i18next'
|
|||
import { useLocation } from 'react-router-dom'
|
||||
import styled, { css } from 'styled-components'
|
||||
|
||||
import Contact from '@/components/Contact'
|
||||
import FeedbackButton from '@/components/Feedback'
|
||||
import LegalNotice from '@/components/LegalNotice'
|
||||
import { ForceThemeProvider } from '@/components/utils/DarkModeContext'
|
||||
|
|
@ -191,6 +192,9 @@ export default function Footer() {
|
|||
<FooterColumn>
|
||||
<nav title="Troisième colonne du menu">
|
||||
<ul>
|
||||
<StyledLi>
|
||||
<Contact />
|
||||
</StyledLi>
|
||||
<StyledLi>
|
||||
<LegalNotice />
|
||||
</StyledLi>
|
||||
|
|
|
|||
|
|
@ -4612,6 +4612,34 @@ entreprise . activités . commerciale . débit de tabac:
|
|||
question.fr: Exercez-vous une activité de vente de tabac ?
|
||||
titre.en: '[automatic] tobacco shop'
|
||||
titre.fr: débit de tabac
|
||||
entreprise . activités . principale:
|
||||
avec:
|
||||
code APE:
|
||||
description.en: |
|
||||
[automatic] The APE code identifies the company's main activity.
|
||||
It consists of 5 digits.
|
||||
description.fr: >
|
||||
Le code APE est un code qui permet d'identifier l'activité
|
||||
principale de l'entreprise.
|
||||
|
||||
Il est composé de 5 chiffres.
|
||||
titre.en: '[automatic] APE code'
|
||||
titre.fr: code APE
|
||||
code guichet:
|
||||
description.en: >
|
||||
[automatic] The "guichet" code is used to identify the main
|
||||
activity when declaring a new
|
||||
|
||||
the new company via the one-stop shop
|
||||
description.fr: >
|
||||
Le code guichet est utilisé pour identifier l'activité
|
||||
principale lors de la déclaration de
|
||||
|
||||
la nouvelle entreprise via le guichet unique
|
||||
titre.en: '[automatic] counter code'
|
||||
titre.fr: code guichet
|
||||
titre.en: '[automatic] Main activity'
|
||||
titre.fr: Activité principale
|
||||
entreprise . activités . revenus mixtes:
|
||||
avec:
|
||||
proportions:
|
||||
|
|
@ -4810,8 +4838,8 @@ entreprise . catégorie juridique:
|
|||
entreprise . catégorie juridique . EI:
|
||||
avec:
|
||||
EI:
|
||||
titre.en: '[automatic] EI'
|
||||
titre.fr: EI
|
||||
titre.en: '[automatic] sole proprietorship'
|
||||
titre.fr: entreprise individuelle
|
||||
auto-entrepreneur:
|
||||
question.en: '[automatic] Are you an auto-entrepreneur?'
|
||||
question.fr: Êtes-vous auto-entrepreneur ?
|
||||
|
|
@ -4956,6 +4984,9 @@ entreprise . catégorie juridique . SELAS:
|
|||
entreprise . catégorie juridique . SNC:
|
||||
titre.en: '[automatic] General partnership'
|
||||
titre.fr: Société en nom collectif
|
||||
entreprise . catégorie juridique . association:
|
||||
titre.en: '[automatic] association'
|
||||
titre.fr: association
|
||||
entreprise . catégorie juridique . autre:
|
||||
description.en: >
|
||||
[automatic] This simulator does not yet manage all types of
|
||||
|
|
|
|||
|
|
@ -643,6 +643,20 @@ components:
|
|||
form:
|
||||
share:
|
||||
checkbox: I want to share my latest simulation to help you better answer me.
|
||||
contact:
|
||||
email: "<0>You can contact us via our returns module using the 👋 button at the
|
||||
top right of your screen or directly by e-mail at the following address:
|
||||
<2>contact@mon-entreprise.beta.gouv.fr</2></0>"
|
||||
info: <0>We are a small team dedicated solely to the development of the
|
||||
mon-entreprise.urssaf.fr website and the associated simulators.<1></1>As a
|
||||
result, we have no access to the personal situation of contributors (for
|
||||
confidentiality reasons), and we cannot legally give advice on a specific
|
||||
situation.</0>
|
||||
title: Contact us
|
||||
urssaf: "<0>If you wish to contact your Urssaf, you can use the usual
|
||||
channels:</0><1><0>by telephone:
|
||||
<2>www.urssaf.fr/portail/home/votre-urssaf/contacts-telephoniques.html</2><\
|
||||
/0><1>by message: <2>www.contact.urssaf.fr</2></1></1>"
|
||||
conversation:
|
||||
multiple-answer:
|
||||
aria-label: Multiple choices
|
||||
|
|
|
|||
|
|
@ -646,6 +646,20 @@ components:
|
|||
share:
|
||||
checkbox: Je souhaite partager ma dernière simulation pour vous aider à mieux me
|
||||
répondre.
|
||||
contact:
|
||||
email: "<0>Vous pouvez nous contacter via notre module de retours via le boutton
|
||||
👋 en haut à droite de votre ecran ou directement par mail à l'adresse
|
||||
suivante : <2>contact@mon-entreprise.beta.gouv.fr</2></0>"
|
||||
info: <0>Nous sommes une petite équipe uniquement affectée au développement du
|
||||
site mon-entreprise.urssaf.fr et des simulateurs associés.<1></1>Par
|
||||
conséquent, nous n'avons pas accès à la situation personnelle des cotisants
|
||||
(pour des raisons de confidentialité), et nous ne pouvons légalement pas
|
||||
donner de conseil sur une situation spécifique.</0>
|
||||
title: Nous contacter
|
||||
urssaf: "<0>Si vous souhaitez contacter votre Urssaf, vous pouvez utiliser les
|
||||
canaux habituels :</0><1><0>par téléphone :
|
||||
<2>www.urssaf.fr/portail/home/votre-urssaf/contacts-telephoniques.html</2><\
|
||||
/0><1>par message : <2>www.contact.urssaf.fr</2></1></1>"
|
||||
conversation:
|
||||
multiple-answer:
|
||||
aria-label: Choix multiples
|
||||
|
|
|
|||
Loading…
Reference in New Issue