From 5224f2eb471a432cd6b242dede65ffedd88dc33d Mon Sep 17 00:00:00 2001 From: Alexandre Valsamou-Stanislawski Date: Mon, 18 Oct 2021 17:52:19 +0200 Subject: [PATCH] Implemente les headers et quelques paragraphes --- mon-entreprise/source/Provider.tsx | 3 +- .../source/components/CompanyDetails.tsx | 5 +- .../source/components/FindCompany.tsx | 14 ++-- .../source/components/LegalNotice.tsx | 38 ++++----- .../source/components/MoreInfosOnUs.tsx | 13 ++-- .../source/components/PageHeader.tsx | 3 +- mon-entreprise/source/components/PaySlip.tsx | 17 ++-- .../source/components/PaySlipSections.tsx | 9 ++- .../source/components/SchemeComparaison.tsx | 77 ++++++++++--------- .../source/components/SearchButton.tsx | 5 +- .../components/ShareSimulationBanner.tsx | 3 +- .../source/components/Simulation.tsx | 5 +- .../source/components/TargetSelection.tsx | 5 +- .../source/components/conversation/Aide.tsx | 7 +- .../components/conversation/AnswerList.tsx | 9 ++- .../components/conversation/Conversation.tsx | 9 ++- .../components/conversation/Question.tsx | 7 +- .../components/layout/Footer/Privacy.tsx | 16 ++-- .../components/search/RulesInfiniteHits.tsx | 5 +- .../source/components/search/SearchRules.tsx | 5 +- .../components/search/SimulatorHits.tsx | 5 +- .../IndépendantCotisationsForfaitaires.tsx | 3 +- .../IndépendantCotisationsRégularisation.tsx | 3 +- .../IndépendantExplanation.tsx | 5 +- .../InstitutionsPartenaires.tsx | 11 +-- .../SalaryExplanation.tsx | 13 ++-- .../source/components/ui/Typography.css | 54 +------------ .../source/components/utils/markdown.tsx | 2 + .../source/design-system/global-style.ts | 11 +++ mon-entreprise/source/pages/Accessibilité.tsx | 15 ++-- mon-entreprise/source/pages/Budget/Budget.tsx | 7 +- .../source/pages/Créer/AfterRegistration.tsx | 39 +++++----- .../source/pages/Créer/CreationChecklist.tsx | 41 ++++------ .../Créer/GuideStatut/AutoEntrepreneur.tsx | 5 +- .../Créer/GuideStatut/DirectorStatus.tsx | 5 +- .../Créer/GuideStatut/MinorityDirector.tsx | 5 +- .../Créer/GuideStatut/NumberOfAssociate.tsx | 5 +- .../Créer/GuideStatut/PickLegalStatus.tsx | 5 +- .../Créer/GuideStatut/SoleProprietorship.tsx | 5 +- .../source/pages/Créer/GuideStatut/index.tsx | 5 +- mon-entreprise/source/pages/Créer/Home.tsx | 11 +-- .../source/pages/Dev/IntegrationTest.tsx | 5 +- mon-entreprise/source/pages/Dev/Personas.tsx | 16 ++-- mon-entreprise/source/pages/Dev/Sitemap.tsx | 3 +- mon-entreprise/source/pages/Documentation.tsx | 10 ++- .../ExplicationResultatFiscal.tsx | 3 +- .../AideDéclarationIndépendant/Fields.tsx | 3 +- .../RésultatSimple.tsx | 13 ++-- .../RésultatsParFormulaire.tsx | 13 ++-- .../AideDéclarationIndépendant/index.tsx | 47 +++++------ .../source/pages/Gérer/AideOrganismeLocal.tsx | 5 +- .../pages/Gérer/DemandeMobilite/EndBlock.tsx | 5 +- .../pages/Gérer/DemandeMobilite/index.tsx | 3 +- .../source/pages/Gérer/Embaucher.tsx | 44 ++++++----- mon-entreprise/source/pages/Gérer/Home.tsx | 39 ++++------ .../source/pages/Gérer/SécuritéSociale.tsx | 3 +- .../source/pages/Nouveautés/Nouveautés.tsx | 5 +- .../pages/Simulateurs/AidesEmbauche.tsx | 22 +++--- .../pages/Simulateurs/ArtisteAuteur.tsx | 5 +- .../pages/Simulateurs/AutoEntrepreneur.tsx | 11 ++- .../source/pages/Simulateurs/Dividendes.tsx | 9 +-- .../source/pages/Simulateurs/Home.tsx | 3 +- .../source/pages/Simulateurs/PAMCHome.tsx | 4 +- .../source/pages/Simulateurs/Page.tsx | 27 +++---- .../source/pages/Simulateurs/metadata.tsx | 43 ++++++----- .../ÉconomieCollaborative/Activité.tsx | 13 ++-- .../ActivitésSelection.tsx | 11 +-- .../ExceptionsExonération.tsx | 5 +- .../ÉconomieCollaborative/VotreSituation.tsx | 17 ++-- .../pages/Stats/DemandesUtilisateurs.tsx | 7 +- mon-entreprise/source/pages/Stats/Stats.tsx | 17 ++-- .../source/pages/integration/Iframe.tsx | 43 ++++++----- .../source/pages/integration/Library.tsx | 15 ++-- .../source/pages/integration/Options.tsx | 13 ++-- 74 files changed, 497 insertions(+), 495 deletions(-) diff --git a/mon-entreprise/source/Provider.tsx b/mon-entreprise/source/Provider.tsx index d7da3f937..5aea6851d 100644 --- a/mon-entreprise/source/Provider.tsx +++ b/mon-entreprise/source/Provider.tsx @@ -2,6 +2,7 @@ import { ErrorBoundary } from '@sentry/react' import { ThemeColorsProvider } from 'Components/utils/colors' import { DisableAnimationOnPrintProvider } from 'Components/utils/DisableAnimationContext' import { SitePathProvider, SitePaths } from 'Components/utils/SitePathsContext' +import { H1 } from 'DesignSystem/typography/heading' import { createBrowserHistory } from 'history' import i18next from 'i18next' import React, { createContext, useMemo } from 'react' @@ -130,7 +131,7 @@ export default function Provider({ src={logo} style={{ maxWidth: '200px', width: '100%', marginTop: '1rem' }} > -

Une erreur est survenue

+

Une erreur est survenue

L'équipe technique de mon-entreprise.fr a été automatiquement prévenue. Vous pouvez également nous contacter directement à diff --git a/mon-entreprise/source/components/CompanyDetails.tsx b/mon-entreprise/source/components/CompanyDetails.tsx index 7d23b3a3d..55a6d920c 100644 --- a/mon-entreprise/source/components/CompanyDetails.tsx +++ b/mon-entreprise/source/components/CompanyDetails.tsx @@ -2,6 +2,7 @@ import { useEffect, useMemo, useState } from 'react' import { Trans, useTranslation } from 'react-i18next' import Skeleton from 'Components/ui/Skeleton' import { Etablissement, fetchCompanyDetails } from '../api/sirene' +import { H3 } from 'DesignSystem/typography/heading' type Company = { denomination: string @@ -41,7 +42,7 @@ export default function CompanyDetails({ siren, denomination }: Etablissement) { return ( <> -

+

{denomination || company ? ( <> {denomination || @@ -53,7 +54,7 @@ export default function CompanyDetails({ siren, denomination }: Etablissement) { ) : ( )} -

+

Crée le{' '} diff --git a/mon-entreprise/source/components/FindCompany.tsx b/mon-entreprise/source/components/FindCompany.tsx index 234adbc2e..fc2442e94 100644 --- a/mon-entreprise/source/components/FindCompany.tsx +++ b/mon-entreprise/source/components/FindCompany.tsx @@ -1,5 +1,7 @@ import { useSetEntreprise } from 'Actions/companyStatusActions' import CompanyDetails from 'Components/CompanyDetails' +import { H1 } from 'DesignSystem/typography/heading' +import { Body } from 'DesignSystem/typography/paragraphs' import { useCallback, useMemo, useState } from 'react' import { Trans } from 'react-i18next' import { Etablissement, searchDenominationOrSiren } from '../api/sirene' @@ -27,16 +29,16 @@ export default function Search() { return ( <> -

+

Retrouver mon entreprise -

-

+ + Grâce à la base SIREN, les données publiques sur votre entreprise seront automatiquement disponibles pour la suite du parcours sur le site. -

+ @@ -68,9 +70,9 @@ export default function Search() { }} /> {!isLoading && searchResults === null && ( -

+ Aucun résultat -

+ )} {searchResults && diff --git a/mon-entreprise/source/components/LegalNotice.tsx b/mon-entreprise/source/components/LegalNotice.tsx index ea3380c78..c21c9e1ed 100644 --- a/mon-entreprise/source/components/LegalNotice.tsx +++ b/mon-entreprise/source/components/LegalNotice.tsx @@ -1,36 +1,38 @@ import Overlay from 'Components/Overlay' +import { H1, H2 } from 'DesignSystem/typography/heading' +import { Body } from 'DesignSystem/typography/paragraphs' import { useState } from 'react' import { Trans } from 'react-i18next' export const LegalNoticeContent = () => ( <> -

+

Mentions légales -

-

+

+

Editeur -

-

+ + Agence Centrale des Organismes de Sécurité Sociale (ACOSS)
36 rue de Valmy - 93108 Montreuil Cedex -

-

+ +

Directeur de la publication -

-

+ + M. Yann-Gaël Amghar, Directeur de l'Acoss -

-

+ +

Prestataire d'hébergement -

-

+ + Netlify
@@ -42,17 +44,17 @@ export const LegalNoticeContent = () => ( https://www.netlify.com -

-

+ +

Contact -

-

+ + contact@mon-entreprise.beta.gouv.fr -

+ ) diff --git a/mon-entreprise/source/components/MoreInfosOnUs.tsx b/mon-entreprise/source/components/MoreInfosOnUs.tsx index d9426d57c..30d52a08a 100644 --- a/mon-entreprise/source/components/MoreInfosOnUs.tsx +++ b/mon-entreprise/source/components/MoreInfosOnUs.tsx @@ -1,3 +1,4 @@ +import { H2, H3 } from 'DesignSystem/typography/heading' import { useContext } from 'react' import { useTranslation } from 'react-i18next' import { Link, useLocation } from 'react-router-dom' @@ -21,16 +22,14 @@ export default function MoreInfosOnUs() { margin-top: 3rem; `} > -

- Plus d'infos sur mon-entreprise.fr -

+

Plus d'infos sur mon-entreprise.fr

{!pathname.startsWith(sitePaths.nouveautés) && (
-

Les nouveautés

+

Les nouveautés

Qu'avons-nous mis en production ces derniers mois ?

@@ -42,7 +41,7 @@ export default function MoreInfosOnUs() {
-

Les statistiques

+

Les statistiques

Quel est notre impact ?

Découvrir
@@ -52,7 +51,7 @@ export default function MoreInfosOnUs() {
-

Le budget

+

Le budget

Quelles sont nos ressources et comment sont-elles employées ?

@@ -79,7 +78,7 @@ export default function MoreInfosOnUs() {
-

Le code source

+

Le code source

Nos travaux sont ouverts et libres de droit, ça se passe sur GitHub

diff --git a/mon-entreprise/source/components/PageHeader.tsx b/mon-entreprise/source/components/PageHeader.tsx index 9a1e01361..a606bf427 100644 --- a/mon-entreprise/source/components/PageHeader.tsx +++ b/mon-entreprise/source/components/PageHeader.tsx @@ -1,3 +1,4 @@ +import { H1 } from 'DesignSystem/typography/heading' import { ReactNode } from 'react' export default function PageHeader({ @@ -12,7 +13,7 @@ export default function PageHeader({ return (
- {titre &&

{titre}

} + {titre &&

{titre}

} {children}
diff --git a/mon-entreprise/source/components/PaySlip.tsx b/mon-entreprise/source/components/PaySlip.tsx index d4abf9d30..e3f77fbcc 100644 --- a/mon-entreprise/source/components/PaySlip.tsx +++ b/mon-entreprise/source/components/PaySlip.tsx @@ -1,6 +1,7 @@ import Value from 'Components/EngineValue' import RuleLink from 'Components/RuleLink' import { EngineContext, useEngine } from 'Components/utils/EngineContext' +import { H4, H5 } from 'DesignSystem/typography/heading' import { DottedName } from 'modele-social' import { ASTNode, formatValue, ParsedRules, reduceAST } from 'publicodes' import { RuleNode } from 'publicodes/dist/types/rule' @@ -113,25 +114,25 @@ export default function PaySlip() { {/* Section cotisations */}
-

+

Cotisations sociales -

-

+

+

Part employeur -

-

+

+

Part salarié -

+ {cotisationsBySection.map(([sectionDottedName, cotisations]) => { const section = parsedRules[sectionDottedName] return ( -
+
{section.title}{' '} -
+ {cotisations.map((cotisation) => ( ))} diff --git a/mon-entreprise/source/components/PaySlipSections.tsx b/mon-entreprise/source/components/PaySlipSections.tsx index 7f5870db7..831fdf6da 100644 --- a/mon-entreprise/source/components/PaySlipSections.tsx +++ b/mon-entreprise/source/components/PaySlipSections.tsx @@ -1,5 +1,6 @@ import Value, { Condition, ValueProps } from 'Components/EngineValue' import RuleLink from 'Components/RuleLink' +import { H4 } from 'DesignSystem/typography/heading' import { DottedName } from 'modele-social' import { isNotApplicable, isNotYetDefined } from 'publicodes' import { Trans, useTranslation } from 'react-i18next' @@ -8,9 +9,9 @@ import { useEngine } from './utils/EngineContext' export const SalaireBrutSection = () => { return (
-

+

Salaire -

+ @@ -31,9 +32,9 @@ export const SalaireNetSection = () => { const { t } = useTranslation() return (
-

+

Salaire net -

+ -

+

Assimilé salarié Le régime tout compris -

-

+

+

{' '} {hideAssimiléSalarié ? ( Entreprise Individuelle @@ -105,21 +106,21 @@ export default function SchemeComparaison({ La protection sociale à la carte -

-

+

+

Auto-entrepreneur Pour commencer sans risques -

+ -

+

Statuts juridiques possibles -

+
@@ -147,7 +148,7 @@ export default function SchemeComparaison({
-

Couverture accidents du travail

+

Couverture accidents du travail
@@ -158,29 +159,29 @@ export default function SchemeComparaison({ Non
-

+

Assurance maladie{' '} (médicaments, soins, hospitalisations) -

+
Identique pour tous
 -

+

Mutuelle santé -

+
Obligatoire
Fortement conseillée
 -

Indemnités journalières

+

Indemnités journalières
++
++
+
-

Retraite

+

Retraite
+++
++
@@ -189,7 +190,7 @@ export default function SchemeComparaison({ {showMore ? ( <> -

ACRE

+

ACRE

1 an (automatique et inconditionnelle)
@@ -199,7 +200,7 @@ export default function SchemeComparaison({
-

Déduction des charges

+

Déduction des charges

Oui (régime fiscal du réel)
@@ -213,7 +214,7 @@ export default function SchemeComparaison({ -

Paiement des cotisations

+

Paiement des cotisations

Mensuel
Provision mensuelle ou trimestrielle @@ -224,9 +225,9 @@ export default function SchemeComparaison({
Mensuel ou trimestriel
-

+

Contrats prévoyance et retraite facultatives déductibles -

+
Oui (sous certaines conditions)
@@ -238,7 +239,7 @@ export default function SchemeComparaison({ Non
-

Paiement de cotisations minimales

+

Paiement de cotisations minimales
Non @@ -250,9 +251,9 @@ export default function SchemeComparaison({ Non
-

+

Revenu minimum pour l'ouverture des droits aux prestations -

+
Oui
Non (cotisations minimales obligatoires) @@ -261,7 +262,7 @@ export default function SchemeComparaison({ {!hideAutoEntrepreneur && ( -

Plafond de chiffre d'affaires

+

Plafond de chiffre d'affaires

Non
@@ -275,9 +276,9 @@ export default function SchemeComparaison({ )} -

+

Gestion comptable, sociale, juridique... -

+
Accompagnement fortement conseillé @@ -307,9 +308,9 @@ export default function SchemeComparaison({ {!conversationStarted ? ( <> -

+

Comparer mes revenus, pension de retraite et indemnité maladie -

+ -

{t('shareSimulation.modal.title', 'Votre lien de partage')}

+

{t('shareSimulation.modal.title', 'Votre lien de partage')}

Voici le lien que vous pouvez envoyer pour accéder à votre diff --git a/mon-entreprise/source/components/Simulation.tsx b/mon-entreprise/source/components/Simulation.tsx index b14642f86..541424aeb 100644 --- a/mon-entreprise/source/components/Simulation.tsx +++ b/mon-entreprise/source/components/Simulation.tsx @@ -6,6 +6,7 @@ import ShareOrSaveSimulationBanner from 'Components/ShareSimulationBanner' import TargetSelection from 'Components/TargetSelection' import Progress from 'Components/ui/Progress' import { useSimulationProgress } from 'Components/utils/useNextQuestion' +import { H2 } from 'DesignSystem/typography/heading' import React from 'react' import { Trans } from 'react-i18next' import { useSelector } from 'react-redux' @@ -115,7 +116,7 @@ export function Questions({ `} > {progress < 1 && ( -

-

+ )}
diff --git a/mon-entreprise/source/components/TargetSelection.tsx b/mon-entreprise/source/components/TargetSelection.tsx index 0e6e28622..340994fec 100644 --- a/mon-entreprise/source/components/TargetSelection.tsx +++ b/mon-entreprise/source/components/TargetSelection.tsx @@ -10,6 +10,7 @@ import { useInversionFail, } from 'Components/utils/EngineContext' import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { H2 } from 'DesignSystem/typography/heading' import { DottedName } from 'modele-social' import { Names } from 'modele-social/dist/names' import { EvaluatedNode, formatValue, reduceAST, RuleNode } from 'publicodes' @@ -47,9 +48,9 @@ export default function TargetSelection({ showPeriodSwitch = true }) {
{nom && ( -

+

{nom} -

+ )}
{index === 0 && showPeriodSwitch && } diff --git a/mon-entreprise/source/components/conversation/Aide.tsx b/mon-entreprise/source/components/conversation/Aide.tsx index ee67c7d1b..f9a81ede1 100644 --- a/mon-entreprise/source/components/conversation/Aide.tsx +++ b/mon-entreprise/source/components/conversation/Aide.tsx @@ -8,6 +8,7 @@ import { References } from 'publicodes-react' import { Trans } from 'react-i18next' import './Aide.css' import { EngineContext } from 'Components/utils/EngineContext' +import { H2, H3 } from 'DesignSystem/typography/heading' export default function Aide() { const explained = useSelector((state: RootState) => state.explainedVariable) @@ -29,13 +30,13 @@ export default function Aide() { padding: 0.6rem; `} > -

{rule.title}

+

{rule.title}

{refs && ( <> -

+

En savoir plus -

+ )} diff --git a/mon-entreprise/source/components/conversation/AnswerList.tsx b/mon-entreprise/source/components/conversation/AnswerList.tsx index 5f1ab9d26..89b4f4a7b 100644 --- a/mon-entreprise/source/components/conversation/AnswerList.tsx +++ b/mon-entreprise/source/components/conversation/AnswerList.tsx @@ -9,6 +9,7 @@ import { DottedName } from 'modele-social' import { situationSelector } from 'Selectors/simulationSelectors' import './AnswerList.css' import Emoji from 'Components/utils/Emoji' +import { H2 } from 'DesignSystem/typography/heading' type AnswerListProps = { onClose: () => void @@ -29,7 +30,7 @@ export default function AnswerList({ onClose }: AnswerListProps) { {!!answeredQuestions.length && ( <> -

+

Mes réponses @@ -44,16 +45,16 @@ export default function AnswerList({ onClose }: AnswerListProps) { Tout effacer -

+ )} {!!nextSteps.length && ( <> -

+

Prochaines questions -

+ )} diff --git a/mon-entreprise/source/components/conversation/Conversation.tsx b/mon-entreprise/source/components/conversation/Conversation.tsx index fbf17f249..28399db4f 100644 --- a/mon-entreprise/source/components/conversation/Conversation.tsx +++ b/mon-entreprise/source/components/conversation/Conversation.tsx @@ -6,6 +6,7 @@ import { FadeIn } from 'Components/ui/animate' import Emoji from 'Components/utils/Emoji' import { EngineContext } from 'Components/utils/EngineContext' import { useNextQuestions } from 'Components/utils/useNextQuestion' +import { H3 } from 'DesignSystem/typography/heading' import { PublicodesExpression } from 'publicodes' import React, { useContext, useEffect } from 'react' import { Trans } from 'react-i18next' @@ -65,11 +66,11 @@ export default function Conversation({ customEndMessages }: ConversationProps) {
-

+

{engine.getRule(currentQuestion).rawNode.question}   -

+
-

+

{' '} Vous avez complété cette simulation -

+

{customEndMessages ? ( customEndMessages diff --git a/mon-entreprise/source/components/conversation/Question.tsx b/mon-entreprise/source/components/conversation/Question.tsx index 14363db2f..b7cfe555c 100644 --- a/mon-entreprise/source/components/conversation/Question.tsx +++ b/mon-entreprise/source/components/conversation/Question.tsx @@ -2,6 +2,7 @@ import classnames from 'classnames' import { useDebounce } from 'Components/utils' import Emoji from 'Components/utils/Emoji' import { Markdown } from 'Components/utils/markdown' +import { H2, H3 } from 'DesignSystem/typography/heading' import { DottedName } from 'modele-social' import { EvaluatedNode, Rule, RuleNode, serializeEvaluation } from 'publicodes' import { References } from 'publicodes-react' @@ -204,13 +205,13 @@ export const RadioLabel = (props: RadioLabelProps) => ( {props.description && ( -

{props.label}

+

{props.label}

{props.références && ( <> -

+

En savoir plus -

+ )} diff --git a/mon-entreprise/source/components/layout/Footer/Privacy.tsx b/mon-entreprise/source/components/layout/Footer/Privacy.tsx index 629ab2561..ca128b665 100644 --- a/mon-entreprise/source/components/layout/Footer/Privacy.tsx +++ b/mon-entreprise/source/components/layout/Footer/Privacy.tsx @@ -1,4 +1,6 @@ import Overlay from 'Components/Overlay' +import { H1 } from 'DesignSystem/typography/heading' +import { Body } from 'DesignSystem/typography/paragraphs' import { useCallback, useContext, useState } from 'react' import { Trans } from 'react-i18next' import { TrackingContext, TrackPage } from '../../../ATInternetTracking' @@ -49,8 +51,8 @@ function PrivacyContent() { <> -

Données personnelles

-

+

Données personnelles

+ Nous recueillons des statistiques anonymes sur l'utilisation du site, que nous utilisons dans le seul but d'améliorer le service, conformément aux{' '} @@ -59,12 +61,12 @@ function PrivacyContent() { {' '} et au règlement RGPD. Ce sont les seules données qui quittent votre navigateur. -

-

+ + Vous pouvez vous soustraire de cette mesure d'utilisation du site ci-dessous : -

-

+ +

+ {valueChanged && ( diff --git a/mon-entreprise/source/components/search/RulesInfiniteHits.tsx b/mon-entreprise/source/components/search/RulesInfiniteHits.tsx index aac7bb158..528839d26 100644 --- a/mon-entreprise/source/components/search/RulesInfiniteHits.tsx +++ b/mon-entreprise/source/components/search/RulesInfiniteHits.tsx @@ -8,6 +8,7 @@ import { Names } from '../../../../modele-social/dist/names' import RuleLink from '../RuleLink' import { Hit as AlgoliaHit } from 'react-instantsearch-core' +import { H2 } from 'DesignSystem/typography/heading' type Hit = AlgoliaHit<{ objectID: Names; namespace?: string }> @@ -30,9 +31,9 @@ const HideableTitle = connectStats(({ nbHits }) => { return nbHits === 0 ? ( <> ) : ( -

+

Règles de calculs -

+ ) }) diff --git a/mon-entreprise/source/components/search/SearchRules.tsx b/mon-entreprise/source/components/search/SearchRules.tsx index 278d1b25a..9a897857c 100644 --- a/mon-entreprise/source/components/search/SearchRules.tsx +++ b/mon-entreprise/source/components/search/SearchRules.tsx @@ -6,6 +6,7 @@ import algoliasearch from 'algoliasearch/lite' import { Trans, useTranslation } from 'react-i18next' import { InstantSearch, SearchBox } from 'react-instantsearch-dom' import { RulesInfiniteHits } from './RulesInfiniteHits' +import { H2 } from 'DesignSystem/typography/heading' const ALGOLIA_APP_ID = process.env.ALGOLIA_APP_ID || '' const ALGOLIA_SEARCH_KEY = process.env.ALGOLIA_SEARCH_KEY || '' @@ -27,9 +28,9 @@ export default function SearchRules() { placeholder: t('Cherchez par mot-clef ou acronyme...'), }} /> -

+

Règles de calculs -

+ ) diff --git a/mon-entreprise/source/components/search/SimulatorHits.tsx b/mon-entreprise/source/components/search/SimulatorHits.tsx index 08bb076f8..ef931860b 100644 --- a/mon-entreprise/source/components/search/SimulatorHits.tsx +++ b/mon-entreprise/source/components/search/SimulatorHits.tsx @@ -1,5 +1,6 @@ import Emoji from 'Components/utils/Emoji' import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { H2 } from 'DesignSystem/typography/heading' import { path } from 'ramda' import { useContext } from 'react' import { Trans } from 'react-i18next' @@ -39,9 +40,9 @@ export const SimulatorHits = connectHits(({ hits }: SimulatorHitsProps) => { return ( <> {hits.length > 0 && ( -

+

Simulateurs -

+ )}
{hits.map((hit) => ( diff --git a/mon-entreprise/source/components/simulationExplanation/IndépendantCotisationsForfaitaires.tsx b/mon-entreprise/source/components/simulationExplanation/IndépendantCotisationsForfaitaires.tsx index 551d9785d..e87a222c4 100644 --- a/mon-entreprise/source/components/simulationExplanation/IndépendantCotisationsForfaitaires.tsx +++ b/mon-entreprise/source/components/simulationExplanation/IndépendantCotisationsForfaitaires.tsx @@ -3,6 +3,7 @@ import { FromBottom } from 'Components/ui/animate' import Emoji from 'Components/utils/Emoji' import { useEngine } from 'Components/utils/EngineContext' import { Markdown } from 'Components/utils/markdown' +import { H2 } from 'DesignSystem/typography/heading' import { Trans } from 'react-i18next' export default function CotisationsForfaitaires() { @@ -12,7 +13,7 @@ export default function CotisationsForfaitaires() { return (
-

{rule.title}

+

{rule.title}

Montant des cotisations forfaitaires :{' '} diff --git a/mon-entreprise/source/components/simulationExplanation/IndépendantCotisationsRégularisation.tsx b/mon-entreprise/source/components/simulationExplanation/IndépendantCotisationsRégularisation.tsx index 522eb54fe..3e3e17d5d 100644 --- a/mon-entreprise/source/components/simulationExplanation/IndépendantCotisationsRégularisation.tsx +++ b/mon-entreprise/source/components/simulationExplanation/IndépendantCotisationsRégularisation.tsx @@ -2,6 +2,7 @@ import { FromBottom } from 'Components/ui/animate' import Emoji from 'Components/utils/Emoji' import { useEngine } from 'Components/utils/EngineContext' import { Markdown } from 'Components/utils/markdown' +import { H2 } from 'DesignSystem/typography/heading' import { Trans } from 'react-i18next' export default function CotisationsRégularisation() { @@ -17,7 +18,7 @@ export default function CotisationsRégularisation() { padding-top: 0.1rem; `} > -

{rule.title}

+

{rule.title}

diff --git a/mon-entreprise/source/components/simulationExplanation/IndépendantExplanation.tsx b/mon-entreprise/source/components/simulationExplanation/IndépendantExplanation.tsx index 4f24ee045..f39b48bdb 100644 --- a/mon-entreprise/source/components/simulationExplanation/IndépendantExplanation.tsx +++ b/mon-entreprise/source/components/simulationExplanation/IndépendantExplanation.tsx @@ -9,6 +9,7 @@ import RuleLink from 'Components/RuleLink' import StackedBarChart from 'Components/StackedBarChart' import { ThemeColorsContext } from 'Components/utils/colors' import { useEngine } from 'Components/utils/EngineContext' +import { H2 } from 'DesignSystem/typography/heading' import { DottedName } from 'modele-social' import { max } from 'ramda' import { useContext } from 'react' @@ -36,7 +37,7 @@ export default function IndépendantExplanation() {
-

Répartition du revenu

+

Répartition du revenu

-

Retraite : droits acquis sur l'année 2021

+

Retraite : droits acquis sur l'année 2021

  • Retraite de base :{' '} diff --git a/mon-entreprise/source/components/simulationExplanation/InstitutionsPartenaires.tsx b/mon-entreprise/source/components/simulationExplanation/InstitutionsPartenaires.tsx index d27c4ed69..76770362f 100644 --- a/mon-entreprise/source/components/simulationExplanation/InstitutionsPartenaires.tsx +++ b/mon-entreprise/source/components/simulationExplanation/InstitutionsPartenaires.tsx @@ -12,17 +12,18 @@ import { Trans } from 'react-i18next' import { useSelector } from 'react-redux' import { targetUnitSelector } from 'Selectors/simulationSelectors' import styled from 'styled-components' +import { H2, H3 } from 'DesignSystem/typography/heading' export default function InstitutionsPartenaires() { const unit = useSelector(targetUnitSelector) return (
    -

    +

    Vos institutions partenaires -

    + @@ -193,7 +194,7 @@ export function InstitutionsPartenairesArtisteAuteur() { ).rawNode return (
    -

    Vos cotisations

    +

    Vos cotisations

    -

    +

    Vos institutions partenaires -

    + diff --git a/mon-entreprise/source/components/simulationExplanation/SalaryExplanation.tsx b/mon-entreprise/source/components/simulationExplanation/SalaryExplanation.tsx index 805ac039d..bfc1731a5 100644 --- a/mon-entreprise/source/components/simulationExplanation/SalaryExplanation.tsx +++ b/mon-entreprise/source/components/simulationExplanation/SalaryExplanation.tsx @@ -5,6 +5,7 @@ import { FromTop } from 'Components/ui/animate' import { ThemeColorsContext } from 'Components/utils/colors' import Emoji from 'Components/utils/Emoji' import { useInversionFail } from 'Components/utils/EngineContext' +import { H2 } from 'DesignSystem/typography/heading' import { useContext, useRef } from 'react' import { Trans, useTranslation } from 'react-i18next' @@ -28,9 +29,9 @@ export default function SalaryExplanation() {
    -

    +

    Fiche de paie -

    +

    @@ -72,7 +73,7 @@ function RevenueRepartitionSection(props: { onSeePayslip: () => void }) { align-items: baseline; `} > -

    void }) { Répartition du total chargé -

    +
-

Déclaration d’accessibilité

+

Déclaration d’accessibilité

L'Acoss s’engage à rendre ses sites internet accessibles conformément à l’article 47 de la loi n° 2005-102 du 11 février 2005. @@ -59,7 +60,7 @@ export default function Accessibilité() { Cette déclaration d’accessibilité s’applique à{' '} https://mon-entreprise.fr.

-

État de conformité

+

État de conformité

https://mon-entreprise.fr n’est actuellement pas en conformité avec le{' '} @@ -73,7 +74,7 @@ export default function Accessibilité() { . L’audit de conformité sera prochainement planifié. Les corrections seront prises en compte suite à l’audit.

-

Droit à la compensation

+

Droit à la compensation

Dans l’attente d’une mise en conformité totale, vous pouvez obtenir une version accessible des documents ou des informations qui y seraient @@ -85,7 +86,7 @@ export default function Accessibilité() { souhaiteriez obtenir. Les informations demandées vous seront transmises dans les meilleurs délais.

-

Amélioration et contact

+

Amélioration et contact

Vous pouvez nous aider à améliorer l’accessibilité du site en nous signalant les problèmes éventuels que vous rencontrez. Pour ce faire, @@ -95,7 +96,7 @@ export default function Accessibilité() { .

-

Défenseur des droits

+

Défenseur des droits

Cette procédure est à utiliser dans le cas suivant.

Vous avez signalé au responsable du site internet un défaut diff --git a/mon-entreprise/source/pages/Budget/Budget.tsx b/mon-entreprise/source/pages/Budget/Budget.tsx index d333fa7d6..5b2a469d9 100644 --- a/mon-entreprise/source/pages/Budget/Budget.tsx +++ b/mon-entreprise/source/pages/Budget/Budget.tsx @@ -2,6 +2,7 @@ import MoreInfosOnUs from 'Components/MoreInfosOnUs' import Emoji from 'Components/utils/Emoji' import { Markdown } from 'Components/utils/markdown' import { ScrollToTop } from 'Components/utils/Scroll' +import { H1, H2 } from 'DesignSystem/typography/heading' import { formatValue } from 'publicodes' import { sum, uniq } from 'ramda' import { useState } from 'react' @@ -46,9 +47,9 @@ export default function Budget() { Le budget de mon-entreprise.fr -

+

Budget -

+ -

Budget consommé

+

Budget consommé

{selectedYear !== '2019' && ( <> diff --git a/mon-entreprise/source/pages/Créer/AfterRegistration.tsx b/mon-entreprise/source/pages/Créer/AfterRegistration.tsx index 912111536..bf9759788 100644 --- a/mon-entreprise/source/pages/Créer/AfterRegistration.tsx +++ b/mon-entreprise/source/pages/Créer/AfterRegistration.tsx @@ -1,6 +1,8 @@ import { FromBottom } from 'Components/ui/animate' import { ScrollToTop } from 'Components/utils/Scroll' import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { H1, H2 } from 'DesignSystem/typography/heading' +import { Body } from 'DesignSystem/typography/paragraphs' import { useContext } from 'react' import { Trans, useTranslation } from 'react-i18next' import { useSelector } from 'react-redux' @@ -31,10 +33,10 @@ export default function AfterRegistration() { ← Retour à la création
-

+

Après la création -

-

+ + Une fois votre{' '} {{ @@ -44,11 +46,11 @@ export default function AfterRegistration() { }}{' '} créée, vous recevez les informations suivantes : -

-

+ +

Le numéro SIRET -

-

+ + Le numéro SIREN est l'identifiant de votre entreprise{' '} tandis que le numéro SIRET identifie chaque établissement de la même @@ -61,11 +63,11 @@ export default function AfterRegistration() { alt="SIRET and SIREN number" style={{ maxWidth: '100%' }} /> -

-

+ +

Le code APE -

-

+ + Le code APE correspond au secteur d'activité de votre entreprise. Il classifie la branche principale de votre entreprise @@ -93,12 +95,11 @@ export default function AfterRegistration() { à l'INSEE.

-

- -

+ +

Le Kbis -

-

+ + C'est le document officiel qui atteste de{' '} l'existence légale d'une entreprise commerciale. Le @@ -108,14 +109,14 @@ export default function AfterRegistration() { Plus d'infos. -

-

+ + Ce document est généralement demandé lors de la candidature à un appel d'offre public, de l'ouverture d'un compte bancaire, d'achats d'équipement professionnel auprès de fournisseurs, etc. -

+ ) } diff --git a/mon-entreprise/source/pages/Créer/CreationChecklist.tsx b/mon-entreprise/source/pages/Créer/CreationChecklist.tsx index ae71419c6..c5eb94398 100644 --- a/mon-entreprise/source/pages/Créer/CreationChecklist.tsx +++ b/mon-entreprise/source/pages/Créer/CreationChecklist.tsx @@ -8,6 +8,7 @@ import { CheckItem, Checklist } from 'Components/ui/Checklist' import Emoji from 'Components/utils/Emoji' import Scroll from 'Components/utils/Scroll' import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { H1, H2, H3, H5 } from 'DesignSystem/typography/heading' import { useContext } from 'react' import { Helmet } from 'react-helmet' import { Trans, useTranslation } from 'react-i18next' @@ -89,17 +90,17 @@ export default function CreateCompany({ statut }: CreateCompanyProps) {
-

{titre}

+

{titre}

-

+

{' '} À faire pour créer votre entreprise -

+

Utilisez cette liste pour suivre votre avancement dans les démarches. @@ -399,12 +400,12 @@ export default function CreateCompany({ statut }: CreateCompanyProps) { } /> -

+

{' '} Recommandé avant le début de l'activité -

+ {!isAutoentrepreneur && ( @@ -454,9 +455,9 @@ export default function CreateCompany({ statut }: CreateCompanyProps) { } /> -

+

Ressources utiles -

+
{isAutoentrepreneur && ( -

- Simulateur de revenus auto-entrepreneur -

+
Simulateur de revenus auto-entrepreneur

Simuler le montant de vos cotisations sociales et de votre impôt et estimez votre futur revenu net. @@ -486,9 +485,7 @@ export default function CreateCompany({ statut }: CreateCompanyProps) { }} > -

- Simulateur de cotisations indépendant -

+
Simulateur de cotisations indépendant

Simuler le montant de vos cotisations sociales pour bien préparer votre business plan. @@ -505,9 +502,7 @@ export default function CreateCompany({ statut }: CreateCompanyProps) { }} > -

- Simulateur de rémunération pour dirigeant de SASU -

+
Simulateur de rémunération pour dirigeant de SASU

Simuler le montant de vos cotisations sociales pour bien préparer votre business plan. @@ -520,7 +515,7 @@ export default function CreateCompany({ statut }: CreateCompanyProps) { to={sitePaths.créer.après} > -

Après la création

+
Après la création

SIREN, SIRET, code APE, KBis. Un petit glossaire des termes que vous pourrez (éventuellement) rencontrer après la création. @@ -533,7 +528,7 @@ export default function CreateCompany({ statut }: CreateCompanyProps) { href="https://www.autoentrepreneur.urssaf.fr/portail/files/Guides/Metropole/Presentation_AE.pdf" target="_blank" > -

Guide pratique Urssaf

+
Guide pratique Urssaf

Des conseils pour les auto-entrepreneurs : comment préparer son projet pour se lancer dans la création et une présentation @@ -550,9 +545,7 @@ export default function CreateCompany({ statut }: CreateCompanyProps) { className="ui__ interactive card small box lighter-bg" href="https://www.urssaf.fr/portail/files/live/sites/urssaf/files/documents/Diaporama_TI_statuts_hors_AE.pdf" > -

- Guide Urssaf pour les travailleur indépendant -

+
Guide Urssaf pour les travailleur indépendant

Des conseils sur comment préparer son projet pour se lancer dans la création et une présentation détaillée de votre protection @@ -600,7 +593,7 @@ export function RessourceAutoEntrepreneur() { href="https://www.autoentrepreneur.urssaf.fr/portail/accueil/une-question/questions-frequentes.html" target="_blank" > -

❓ Questions fréquentes

+
❓ Questions fréquentes

Une liste exhaustive et maintenue à jour de toutes les questions fréquentes (et moins fréquentes) que l'on est amené à poser en tant @@ -614,9 +607,7 @@ export function RessourceAutoEntrepreneur() { target="_blank" href="https://www.impots.gouv.fr/portail/professionnel/je-choisis-le-regime-du-micro-entrepreneur-auto-entrepreneur" > -

- 📑 Comment déclarer son revenu aux impôts ? -

+
📑 Comment déclarer son revenu aux impôts ?

Les informations officielles de l'administration fiscale concernant les auto-entrepreneurs et le régime de la micro-entreprise. diff --git a/mon-entreprise/source/pages/Créer/GuideStatut/AutoEntrepreneur.tsx b/mon-entreprise/source/pages/Créer/GuideStatut/AutoEntrepreneur.tsx index 1c9ebca13..7894ca550 100644 --- a/mon-entreprise/source/pages/Créer/GuideStatut/AutoEntrepreneur.tsx +++ b/mon-entreprise/source/pages/Créer/GuideStatut/AutoEntrepreneur.tsx @@ -1,4 +1,5 @@ import SchemeComparaison from 'Components/SchemeComparaison' +import { H2 } from 'DesignSystem/typography/heading' import { Helmet } from 'react-helmet' import { Trans, useTranslation } from 'react-i18next' import { TrackPage } from '../../../ATInternetTracking' @@ -18,11 +19,11 @@ export default function Autoentrepreneur() { )} /> -

+

Entreprise individuelle ou auto-entrepreneur -

+

À la différence de l'entreprise individuelle, l'auto-entrepreneur diff --git a/mon-entreprise/source/pages/Créer/GuideStatut/DirectorStatus.tsx b/mon-entreprise/source/pages/Créer/GuideStatut/DirectorStatus.tsx index ef0187a09..8f35e89a6 100644 --- a/mon-entreprise/source/pages/Créer/GuideStatut/DirectorStatus.tsx +++ b/mon-entreprise/source/pages/Créer/GuideStatut/DirectorStatus.tsx @@ -1,4 +1,5 @@ import SchemeComparaison from 'Components/SchemeComparaison' +import { H2 } from 'DesignSystem/typography/heading' import { Helmet } from 'react-helmet' import { Trans, useTranslation } from 'react-i18next' import { TrackPage } from '../../../ATInternetTracking' @@ -20,11 +21,11 @@ export default function DefineDirectorStatus() { )} /> -

+

Définir le statut du dirigeant -

+

Ce choix est important car il détermine le régime de sécurité sociale diff --git a/mon-entreprise/source/pages/Créer/GuideStatut/MinorityDirector.tsx b/mon-entreprise/source/pages/Créer/GuideStatut/MinorityDirector.tsx index cb7b4b277..d068d8cbd 100644 --- a/mon-entreprise/source/pages/Créer/GuideStatut/MinorityDirector.tsx +++ b/mon-entreprise/source/pages/Créer/GuideStatut/MinorityDirector.tsx @@ -2,6 +2,7 @@ import { directorIsInAMinority, useDispatchAndGoToNextQuestion, } from 'Actions/companyStatusActions' +import { H2 } from 'DesignSystem/typography/heading' import { Helmet } from 'react-helmet' import { Trans, useTranslation } from 'react-i18next' import { TrackPage } from '../../../ATInternetTracking' @@ -27,11 +28,11 @@ export default function MinorityDirector() { )} /> -

+

Gérant majoritaire ou minoritaire {' '} -

+

Certaines règles spéciales s'appliquent selon le nombre d'actions diff --git a/mon-entreprise/source/pages/Créer/GuideStatut/NumberOfAssociate.tsx b/mon-entreprise/source/pages/Créer/GuideStatut/NumberOfAssociate.tsx index 4f892b82c..fed985696 100644 --- a/mon-entreprise/source/pages/Créer/GuideStatut/NumberOfAssociate.tsx +++ b/mon-entreprise/source/pages/Créer/GuideStatut/NumberOfAssociate.tsx @@ -2,6 +2,7 @@ import { companyHasMultipleAssociates, useDispatchAndGoToNextQuestion, } from 'Actions/companyStatusActions' +import { H2 } from 'DesignSystem/typography/heading' import { Helmet } from 'react-helmet' import { Trans, useTranslation } from 'react-i18next' import { TrackPage } from '../../../ATInternetTracking' @@ -27,9 +28,9 @@ export default function NumberOfAssociates() { )} /> -

+

Seul ou à plusieurs -

+

Une entreprise avec un seul associé est plus simple à créer et gérer. diff --git a/mon-entreprise/source/pages/Créer/GuideStatut/PickLegalStatus.tsx b/mon-entreprise/source/pages/Créer/GuideStatut/PickLegalStatus.tsx index b16f18d7d..d9b9c701c 100644 --- a/mon-entreprise/source/pages/Créer/GuideStatut/PickLegalStatus.tsx +++ b/mon-entreprise/source/pages/Créer/GuideStatut/PickLegalStatus.tsx @@ -1,4 +1,5 @@ import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { H2 } from 'DesignSystem/typography/heading' import { filter } from 'ramda' import { useContext } from 'react' import { Helmet } from 'react-helmet' @@ -99,13 +100,13 @@ export default function SetMainStatus() { )} -

+

{Object.keys(possibleStatus).every(Boolean) ? ( Liste des statuts juridiques ) : ( Votre forme juridique )} -

+
    {Object.keys(filter(Boolean, possibleStatus)).map( diff --git a/mon-entreprise/source/pages/Créer/GuideStatut/SoleProprietorship.tsx b/mon-entreprise/source/pages/Créer/GuideStatut/SoleProprietorship.tsx index 355f8acca..41a723d49 100644 --- a/mon-entreprise/source/pages/Créer/GuideStatut/SoleProprietorship.tsx +++ b/mon-entreprise/source/pages/Créer/GuideStatut/SoleProprietorship.tsx @@ -2,6 +2,7 @@ import { isSoleProprietorship, useDispatchAndGoToNextQuestion, } from 'Actions/companyStatusActions' +import { H2 } from 'DesignSystem/typography/heading' import { Helmet } from 'react-helmet' import { Trans, useTranslation } from 'react-i18next' import { TrackPage } from '../../../ATInternetTracking' @@ -32,11 +33,11 @@ export default function SoleProprietorship() { )} /> -

    +

    Entreprise individuelle ou société ? -

    +

    Ce choix determine votre degré de responsabilité et votre capacité à diff --git a/mon-entreprise/source/pages/Créer/GuideStatut/index.tsx b/mon-entreprise/source/pages/Créer/GuideStatut/index.tsx index 2e4c0ad8c..7bb8f27da 100644 --- a/mon-entreprise/source/pages/Créer/GuideStatut/index.tsx +++ b/mon-entreprise/source/pages/Créer/GuideStatut/index.tsx @@ -1,6 +1,7 @@ import { resetCompanyStatusChoice } from 'Actions/companyStatusActions' import { FromBottom } from 'Components/ui/animate' import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { H1 } from 'DesignSystem/typography/heading' import { dropWhile, toPairs } from 'ramda' import { useContext, useEffect } from 'react' import { Trans } from 'react-i18next' @@ -59,9 +60,9 @@ export default function Créer() {

-

+

Choix du statut juridique -

+ diff --git a/mon-entreprise/source/pages/Créer/Home.tsx b/mon-entreprise/source/pages/Créer/Home.tsx index d9c71b7a2..18e4a1402 100644 --- a/mon-entreprise/source/pages/Créer/Home.tsx +++ b/mon-entreprise/source/pages/Créer/Home.tsx @@ -1,6 +1,7 @@ import PageHeader from 'Components/PageHeader' import { FromBottom } from 'Components/ui/animate' import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { H3, H5 } from 'DesignSystem/typography/heading' import { useContext } from 'react' import { Helmet } from 'react-helmet' import { Trans, useTranslation } from 'react-i18next' @@ -57,16 +58,16 @@ export default function Créer() {

-

+

Ressources utiles -

+
-

Liste des statuts juridiques

+
Liste des statuts juridiques
Vous savez déjà quel statut choisir ? Accédez directement à la liste des démarches associées @@ -81,7 +82,7 @@ export default function Créer() { }} > -

Comparateur de régimes

+
Comparateur de régimes
Indépendant, assimilé-salarié ou auto-entrepreneur ? Calculez les différences en terme de revenus, cotisations, retraite, etc @@ -94,7 +95,7 @@ export default function Créer() { to={sitePaths.créer['auto-entrepreneur']} > -

Démarche auto-entrepreneur

+
Démarche auto-entrepreneur
Vous souhaitez devenir auto-entrepreneur ? Découvrez les étapes pour bien démarrer votre activité diff --git a/mon-entreprise/source/pages/Dev/IntegrationTest.tsx b/mon-entreprise/source/pages/Dev/IntegrationTest.tsx index 536272f15..525ae7546 100644 --- a/mon-entreprise/source/pages/Dev/IntegrationTest.tsx +++ b/mon-entreprise/source/pages/Dev/IntegrationTest.tsx @@ -1,3 +1,4 @@ +import { H2 } from 'DesignSystem/typography/heading' import { lazy, useState, useRef, useEffect, Suspense, useMemo } from 'react' import useSimulatorsData from '../Simulateurs/metadata' const LazyColorPicker = lazy(() => import('./ColorPicker')) @@ -29,14 +30,14 @@ export default function IntegrationTest() { }, [version]) return ( <> -

Quel module ?

+

Quel module ?

-

Quelle couleur ?

+

Quelle couleur ?

Chargement...
}> diff --git a/mon-entreprise/source/pages/Dev/Personas.tsx b/mon-entreprise/source/pages/Dev/Personas.tsx index ebaf90b48..3958ce809 100644 --- a/mon-entreprise/source/pages/Dev/Personas.tsx +++ b/mon-entreprise/source/pages/Dev/Personas.tsx @@ -1,10 +1,12 @@ +import { H1, H2, H3 } from 'DesignSystem/typography/heading' + export default function Personas() { return ( <> -

Nos personas

+

Nos personas

-

Jules 38 ans, Marseille

+

Jules 38 ans, Marseille

Après 15 ans dans un salon de coiffure, souhaite devenir coiffeur à @@ -31,7 +33,7 @@ export default function Personas() {

-

Rania, 33 ans, Saint-Etienne

+

Rania, 33 ans, Saint-Etienne

Aimerait créer une startup d’équipement sportif féminin

@@ -55,7 +57,7 @@ export default function Personas() {
-

Paul, 40 ans, Pau

+

Paul, 40 ans, Pau

Directeur d’une agence de voyage en Asie, a besoin d’informations @@ -81,7 +83,7 @@ export default function Personas() {

-

Valérie, 50 ans, Niort / Aidant

+

Valérie, 50 ans, Niort / Aidant

Conseille pôle emploi, accompagne plusieurs bénéficiaires dans la @@ -104,7 +106,7 @@ export default function Personas() {

-

Et les usages que nous avons identifiés

+

Et les usages que nous avons identifiés

  • Type d’entreprise : Airbnb vs Freelance vs Startup & @@ -128,7 +130,7 @@ export default function Personas() {
-

Économie collaborative

+

Économie collaborative

Les personas détaillées diff --git a/mon-entreprise/source/pages/Dev/Sitemap.tsx b/mon-entreprise/source/pages/Dev/Sitemap.tsx index 877aefc06..54e282259 100644 --- a/mon-entreprise/source/pages/Dev/Sitemap.tsx +++ b/mon-entreprise/source/pages/Dev/Sitemap.tsx @@ -1,4 +1,5 @@ import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { H1 } from 'DesignSystem/typography/heading' import { useContext } from 'react' import { generateSiteMap } from '../../sitePaths' @@ -6,7 +7,7 @@ export default function SiteMap() { const sitePaths = useContext(SitePathsContext) return ( <> -

Sitemap

+

Sitemap

 				{generateSiteMap(sitePaths).map((path) => (
 					
diff --git a/mon-entreprise/source/pages/Documentation.tsx b/mon-entreprise/source/pages/Documentation.tsx
index 3b4e844e4..72ee20fe2 100644
--- a/mon-entreprise/source/pages/Documentation.tsx
+++ b/mon-entreprise/source/pages/Documentation.tsx
@@ -13,6 +13,8 @@ import { RootState } from 'Reducers/rootReducer'
 import { TrackPage } from '../ATInternetTracking'
 import rules, { DottedName } from 'modele-social'
 import RuleLink from '../components/RuleLink'
+import { H1 } from 'DesignSystem/typography/heading'
+import { Body } from 'DesignSystem/typography/paragraphs'
 
 export default function RulePage() {
 	const currentSimulation = useSelector(
@@ -90,10 +92,10 @@ function DocumentationLanding() {
 	return (
 		<>
 			
-			

+			

 				Documentation
-			

-			
Explorez toutes les règles de la documentation

+			
+			Explorez toutes les règles de la documentation
 			
 		
 	)
@@ -103,7 +105,7 @@ function DocumentationRulesList() {
 	const ruleEntries = Object.keys(rules) as DottedName[]
 	return (
 		<>
-			
Liste des règles

+			
Liste des règles

 			{ruleEntries.map((name) => (
 				
 					{name}
diff --git a/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/ExplicationResultatFiscal.tsx b/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/ExplicationResultatFiscal.tsx
index e679a2f92..fda2c8953 100644
--- a/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/ExplicationResultatFiscal.tsx
+++ b/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/ExplicationResultatFiscal.tsx
@@ -1,10 +1,11 @@
 import { Explicable } from 'Components/conversation/Explicable'
+import { H2 } from 'DesignSystem/typography/heading'
 
 export function ExplicationsResultatFiscal() {
 	return (
 		
 			<>
-				
Quelles exonérations inclure ?

+				
Quelles exonérations inclure ?

 				

 					Pour calculer le montant du résultat fiscal avant déduction des
 					exonérations et des charges sociales à indiquer dans ce simulateur,
diff --git a/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/Fields.tsx b/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/Fields.tsx
index 5cfe8119c..fab145613 100644
--- a/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/Fields.tsx
+++ b/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/Fields.tsx
@@ -4,6 +4,7 @@ import RuleInput from 'Components/conversation/RuleInput'
 import { FromTop } from 'Components/ui/animate'
 import { EngineContext } from 'Components/utils/EngineContext'
 import { useNextQuestions } from 'Components/utils/useNextQuestion'
+import { H3 } from 'DesignSystem/typography/heading'
 import { DottedName } from 'modele-social'
 import { RuleNode } from 'publicodes'
 import { useCallback, useContext } from 'react'
@@ -37,7 +38,7 @@ export function SubSection({
 
 	return (
 		<>
-			{!!subQuestions.length && title && 
{title}
}
+			{!!subQuestions.length && title && 
{title}
}
 			{subQuestions.map((dottedName) => (
 				
 			))}
diff --git a/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/RésultatSimple.tsx b/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/RésultatSimple.tsx
index c7c038c56..9c68d4284 100644
--- a/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/RésultatSimple.tsx
+++ b/mon-entreprise/source/pages/Gérer/AideDéclarationIndépendant/RésultatSimple.tsx
@@ -4,6 +4,7 @@ import { FromTop } from 'Components/ui/animate'
 import Emoji from 'Components/utils/Emoji'
 import { useEngine } from 'Components/utils/EngineContext'
 import { Markdown } from 'Components/utils/markdown'
+import { H2, H3 } from 'DesignSystem/typography/heading'
 import { Trans } from 'react-i18next'
 
 export default function ResultatsSimples() {
@@ -23,12 +24,12 @@ export default function ResultatsSimples() {
 					flex-direction: column;
 				`}
 			>
-				

+				

 					{' '}
 					
 						Montants à reporter dans votre déclaration de revenus
 					
-				

+				
 				

 					L'ancienne Déclaration Sociale des Indépendant (DSI) qui était
 					précédemment à effectuer sur le site net-entreprises.fr est désormais
@@ -65,7 +66,7 @@ export default function ResultatsSimples() {
 									margin: 1rem 0;
 								`}
 							>
-								

+								

 									{r.title}
 									
 										{r.rawNode.résumé}
 									
-								

+								
 								

 									
 										
@@ -107,9 +108,9 @@ export default function ResultatsSimples() {
 						],
 					}}
 				>
-					

+					

 						 Pour votre information{' '}
-					

+					

 					

-				

+				

 					{' '}
 					
 						Vos déclarations fiscales
 					
-				

+				
 				

 					Important : les montants affichés ici concernent uniquement le calcul
 					des cotisations de l'exploitant (et du conjoint collaborateur si
@@ -58,9 +59,9 @@ export default function ResultatsParFormulaire() {
 					
 				))}
 				
-					

+					

 						 Pour votre information{' '}
-					

+					
 					

 						{informations.map((r) => (
 							
@@ -123,9 +124,9 @@ function DeclarationForm({ dottedName }: { dottedName: DottedName }) {
 						margin: 1rem 0;
 					`}
 				>
-					

+					

 						{r.title} {r.rawNode.résumé}
-					

+					
 					

 										
-											
Activité partielle

+											
Activité partielle

 											

 												Calculez le reste à payer après remboursement de l'État
 												lorsque vous activez le dispositif pour un employé.
@@ -177,7 +178,7 @@ export default function Gérer() {
 											
 										

 										
-											
Estimer le montant d’une embauche

+											
Estimer le montant d’une embauche

 											

 												Calculez le montant total que votre entreprise devra
 												dépenser pour rémunérer votre prochain employé
@@ -200,7 +201,7 @@ export default function Gérer() {
-

Estimer le montant de l’impôt sur les sociétés

+

Estimer le montant de l’impôt sur les sociétés

Calculez le montant de l'impôt sur les sociétés à partir de votre bénéfice. @@ -216,10 +217,10 @@ export default function Gérer() { -

+

Ressources utiles -

+
{dirigeant === 'indépendant' && i18n.language === 'fr' && @@ -229,9 +230,7 @@ export default function Gérer() { to={sitePaths.gérer.formulaireMobilité} > -

- Exporter son activité en Europe -

+
Exporter son activité en Europe

Le formulaire pour effectuer une demande de mobilité internationale (détachement ou pluriactivité) @@ -245,9 +244,7 @@ export default function Gérer() { to={sitePaths.gérer.embaucher} > -

- Découvrir les démarches d’embauche{' '} -

+
Découvrir les démarches d’embauche

La liste des choses à faire pour être sûr de ne rien oublier lors de l’embauche d’un nouveau salarié @@ -261,9 +258,7 @@ export default function Gérer() { href="https://autoentrepreneur.urssaf.fr" > -

- Accéder au site officiel auto-entrepreneur -

+
Accéder au site officiel auto-entrepreneur

Vous pourrez effectuer votre déclaration de chiffre d'affaires, payer vos cotisations, et plus largement trouver @@ -278,7 +273,7 @@ export default function Gérer() { to={sitePaths.gérer.sécuritéSociale} > -

Comprendre la sécurité sociale

+
Comprendre la sécurité sociale

A quoi servent les cotisations sociales ? Le point sur le système de protection sociale dont bénéficient tous les @@ -296,7 +291,7 @@ export default function Gérer() { rel="noreferrer noopener" > -

Récupérer un extrait de Kbis?

+
Récupérer un extrait de Kbis?

Les auto-entrepreneurs n'ont pas de Kbis. Ils peuvent cependant récupérer et présenter un extrait K. Voir le site @@ -312,7 +307,7 @@ export default function Gérer() { rel="noreferrer noopener" > -

Récupérer un extrait de Kbis

+
Récupérer un extrait de Kbis

Le Kbis est un document permettant de justifier de l'enregistrement de l'entreprise au{' '} @@ -381,11 +376,11 @@ export const CompanySection = ({ company }: CompanySectionProps) => { <> -

+

Êtes-vous auto-entrepreneur ?{' '} -

+
)} - <>{small ? name :

{name}

} + <>{small ? name :

{name}

} {!small && meta?.description && (

{meta.description}

)} diff --git a/mon-entreprise/source/pages/Simulateurs/PAMCHome.tsx b/mon-entreprise/source/pages/Simulateurs/PAMCHome.tsx index a6381469b..7fbe73283 100644 --- a/mon-entreprise/source/pages/Simulateurs/PAMCHome.tsx +++ b/mon-entreprise/source/pages/Simulateurs/PAMCHome.tsx @@ -1,4 +1,4 @@ -import { default as React } from 'react' +import { H2 } from 'DesignSystem/typography/heading' import { TrackPage } from '../../ATInternetTracking' import { SimulateurCard } from './Home' import useSimulatorsData from './metadata' @@ -8,7 +8,7 @@ export default function SalariéSimulation() { return ( <> -

Quelle profession exercez-vous ?

+

Quelle profession exercez-vous ?

diff --git a/mon-entreprise/source/pages/Simulateurs/Page.tsx b/mon-entreprise/source/pages/Simulateurs/Page.tsx index 9787bcfc0..b238a0503 100644 --- a/mon-entreprise/source/pages/Simulateurs/Page.tsx +++ b/mon-entreprise/source/pages/Simulateurs/Page.tsx @@ -8,6 +8,7 @@ import Meta from 'Components/utils/Meta' import { SitePathsContext } from 'Components/utils/SitePathsContext' import useSearchParamsSimulationSharing from 'Components/utils/useSearchParamsSimulationSharing' import useSimulationConfig from 'Components/utils/useSimulationConfig' +import { H1, H2, H3, H5 } from 'DesignSystem/typography/heading' import { default as React, useContext } from 'react' import { Trans, useTranslation } from 'react-i18next' import { Link, useLocation } from 'react-router-dom' @@ -69,15 +70,11 @@ export default function PageData({ {meta && } {title && !inIframe && ( <> -

{title}

+

{title}

{tooltip && ( -

+

{tooltip} -

+ )} )} @@ -120,9 +117,9 @@ function NextSteps({ iframePath, nextSteps }: NextStepsProps) { } return (
-

+

Ressources utiles -

+
@@ -133,9 +130,9 @@ function NextSteps({ iframePath, nextSteps }: NextStepsProps) { href={guideUrssaf.url} target="_blank" > -

+

{guideUrssaf.title} -
+

Des conseils pour se lancer dans la création et une présentation détaillée de votre protection sociale. @@ -155,9 +152,9 @@ function NextSteps({ iframePath, nextSteps }: NextStepsProps) { }} > -

+

Intégrer le module web -
+

Ajouter ce simulateur sur votre site internet en un clic via un script clé en main. @@ -186,10 +183,10 @@ export function SimulatorRessourceCard({ pathname: simulator.path, }} > -

+

{simulator.icône && }{' '} {simulator.shortName} -
+

{simulator.meta?.description}

) diff --git a/mon-entreprise/source/pages/Simulateurs/metadata.tsx b/mon-entreprise/source/pages/Simulateurs/metadata.tsx index 78fbb1a06..9c8f5ce42 100644 --- a/mon-entreprise/source/pages/Simulateurs/metadata.tsx +++ b/mon-entreprise/source/pages/Simulateurs/metadata.tsx @@ -4,6 +4,7 @@ import Simulation from 'Components/Simulation' import SalaryExplanation from 'Components/simulationExplanation/SalaryExplanation' import Emoji from 'Components/utils/Emoji' import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { H2 } from 'DesignSystem/typography/heading' import React, { useContext, useMemo } from 'react' import { Trans, useTranslation } from 'react-i18next' import { SimulationConfig } from 'Reducers/rootReducer' @@ -123,7 +124,7 @@ export function getSimulatorsData({ path: sitePaths.simulateurs.salarié, seoExplanations: ( -

Comment calculer le salaire net ?

+

Comment calculer le salaire net ?

Lors de l'entretien d'embauche l'employeur propose en général une rémunération exprimée en « brut ». Le montant annoncé inclut ainsi @@ -166,7 +167,7 @@ export function getSimulatorsData({ .

-

Comment calculer le coût d'embauche ?

+

Comment calculer le coût d'embauche ?

Si vous cherchez à embaucher, vous pouvez calculer le coût total de la rémunération de votre salarié, ainsi que les montants de @@ -206,10 +207,10 @@ export function getSimulatorsData({ path: sitePaths.simulateurs['entreprise-individuelle'], seoExplanations: ( -

+

Comment calculer le revenu net d'un dirigeant d'entreprise individuelle (EI) ? -

+

Un dirigeant d'entreprise individuelle doit payer des cotisations et contributions sociales à l'administration. Ces cotisations servent @@ -240,10 +241,10 @@ export function getSimulatorsData({

-

+

Comment calculer les cotisations sociales d'une entreprise individuelle ? -

+

Le dirigeant d'une entreprise individuelle paye des cotisations sociales, proportionnelle au{' '} @@ -300,7 +301,7 @@ export function getSimulatorsData({ }, seoExplanations: ( -

Comment calculer le salaire d'un dirigeant de SASU ?

+

Comment calculer le salaire d'un dirigeant de SASU ?

Comme pour un salarié classique, le{' '} dirigeant de sasu paye des cotisations sociales sur @@ -390,7 +391,7 @@ export function getSimulatorsData({ ), seoExplanations: ( -

Comment calculer le revenu net d'un auto-entrepreneur ?

+

Comment calculer le revenu net d'un auto-entrepreneur ?

Un auto-entrepreneur doit payer des cotisations et contributions sociales à l'administration. Ces cotisations servent au financement @@ -422,9 +423,9 @@ export function getSimulatorsData({

-

+

Comment calculer l'impôt sur le revenu pour un auto-entrepreneur ? -

+

Si vous avez opté pour le versement libératoire lors de la création de votre auto-entreprise, l'impôt sur le revenu est payé en même @@ -484,7 +485,7 @@ export function getSimulatorsData({ }, seoExplanations: ( -

Comment calculer l'indemnité d'activité partielle ?

+

Comment calculer l'indemnité d'activité partielle ?

L'indemnité d'activité partielle de base est fixée par la loi à{' '} 70% du brut. Elle est proratisée en fonction du @@ -505,7 +506,7 @@ export function getSimulatorsData({ Voir le détail du calcul de l'indemnité

-

Comment calculer la part remboursée par l'État ?

+

Comment calculer la part remboursée par l'État ?

L'État prend en charge une partie de l'indemnité partielle pour les salaires allant jusqu'à 4,5 SMIC, avec un minimum à @@ -522,7 +523,7 @@ export function getSimulatorsData({ Voir le détail du calcul du remboursement de l'indemnité

-

Comment déclarer une activité partielle ?

+

Comment déclarer une activité partielle ?

Face à la crise du coronavirus, les modalités de passage en activité partielle ont été allégées. L'employeur est autorisé a placer ses @@ -538,11 +539,11 @@ export function getSimulatorsData({ Effectuer la demande de chômage partiel

-

+

{' '} Quelles sont les cotisations sociales à payer pour l'indemnité d'activité partielle ? -

+

L'indemnité d'activité partielle est soumise à la CSG/CRDS et à une contribution maladie dans certains cas. Pour en savoir plus, voir la @@ -737,7 +738,7 @@ export function getSimulatorsData({ component: ISSimulation, seoExplanations: ( -

Comment est calculé l’impôt sur les sociétés ?

+

Comment est calculé l’impôt sur les sociétés ?

L’impôt sur les sociétés s’applique aux bénéfices réalisés par les sociétés de capitaux (SA, SAS, SASU, SARL, etc.) et sur option @@ -752,7 +753,7 @@ export function getSimulatorsData({ l’exercice, ce qui est pris en compte dans le simulateur en modifiant les dates de début et de fin de l’exercice.

-

Taux réduit et régimes spécifiques

+

Taux réduit et régimes spécifiques

Les PME réalisant moins de 7,63 millions d’euros de chiffre d’affaires et dont le capital est détenu à 75% par des personnes @@ -792,7 +793,7 @@ export function getSimulatorsData({ config: dividendesConfig, seoExplanations: ( -

Les dividendes et distributions

+

Les dividendes et distributions

A la fin de l'exercice d'une société, le résultat de l'exercice précédent peut être conservé en réserve (pour de futurs @@ -805,7 +806,7 @@ export function getSimulatorsData({ bénéficiaire personne physique et des dividendes décidés par la société.

-

Comment sont calculés les prélèvements sur les dividendes ?

+

Comment sont calculés les prélèvements sur les dividendes ?

Les dividendes peuvent être soumis au prélèvement forfaitaire unique de 30% incluant imposition et contributions sociales (aussi appelé @@ -825,9 +826,9 @@ export function getSimulatorsData({ .

-

+

Cas particulier du dirigeant au régime du travailleur indépendant -

+

{' '} Au régime du travailleur indépendant, la part des dividendes diff --git a/mon-entreprise/source/pages/Simulateurs/ÉconomieCollaborative/Activité.tsx b/mon-entreprise/source/pages/Simulateurs/ÉconomieCollaborative/Activité.tsx index 20d8f1ff4..b8fca72f1 100644 --- a/mon-entreprise/source/pages/Simulateurs/ÉconomieCollaborative/Activité.tsx +++ b/mon-entreprise/source/pages/Simulateurs/ÉconomieCollaborative/Activité.tsx @@ -3,6 +3,7 @@ import Emoji from 'Components/utils/Emoji' import { Markdown } from 'Components/utils/markdown' import { ScrollToTop } from 'Components/utils/Scroll' import { SitePathsContext } from 'Components/utils/SitePathsContext' +import { H1, H2 } from 'DesignSystem/typography/heading' import { formatValue } from 'publicodes' import { useContext } from 'react' import { Trans, useTranslation } from 'react-i18next' @@ -39,7 +40,7 @@ export default function Activité({ -

{activité.titre}

+

{activité.titre}

{activité.explication}

@@ -63,9 +64,9 @@ export default function Activité({ -

+

{activité.titre} -

+ {activité.plateformes && (

@@ -80,7 +81,7 @@ export default function Activité({ {estExonérée ? null : activité['seuil pro'] === 0 ? ( -

Il s'agit d'une activité professionnelle

+

Il s'agit d'une activité professionnelle

Les revenus de cette activité sont considérés comme des{' '} revenus professionnels dès le 1er euro gagné. @@ -88,13 +89,13 @@ export default function Activité({ ) : activité['seuil déclaration'] === 0 && !activité['seuil pro'] ? ( -

Vous devez déclarez vos revenus aux impôts

+

Vous devez déclarez vos revenus aux impôts

Les revenus de cette activité sont imposables.

) : ( <> -

Revenus annuels

+

Revenus annuels

Vos revenus annuels pour cette activité sont :