From 19a455a4877079e2232b34c1c11bde42173aa21a Mon Sep 17 00:00:00 2001 From: julie BRUNETTO Date: Tue, 2 May 2023 15:15:15 +0200 Subject: [PATCH] =?UTF-8?q?feat(alternance):=20ajout=20de=20la=20section?= =?UTF-8?q?=20d=C3=A9couverte=20apprentissage?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../RechercherAccompagnement.test.tsx | 2 +- .../Rechercher/RechercherAccompagnement.tsx | 12 +-- .../Rechercher/RechercherAlternance.tsx | 12 ++- .../EnSavoirPlusApprentissageJeunes.tsx | 4 +- .../PreparationApprentissage.tsx | 19 ++-- .../Statistiques/StatistiquesFormation.tsx | 6 +- .../Rechercher/RechercherFormation.test.tsx | 2 +- .../Rechercher/RechercherFormation.tsx | 16 +-- .../RechercherJob\303\211tudiant.tsx" | 12 +-- .../Rechercher/RechercherOffreEmploi.tsx | 12 +-- .../Partner/Card/PartnerCard.module.scss | 88 --------------- .../Partner/SimulationAlternancePartner.tsx | 24 ----- .../ServiceCard/Card/ServiceCard.module.scss | 100 ++++++++++++++++++ .../Card/ServiceCard.tsx} | 22 ++-- .../ServiceCard/DecouvrirApprentissage.tsx | 18 ++++ .../InfoJeunesPartner.tsx | 6 +- .../LaBonneAlternancePartner.tsx | 6 +- .../LaBonneBoitePartner.tsx | 6 +- .../MissionsLocalesPartner.tsx | 6 +- .../MonCompteFormationPartner.tsx | 6 +- .../M\303\251tiersDuSoinPartner.tsx" | 6 +- .../OnisepPartner.tsx | 6 +- .../ParcourSupPartner.tsx | 6 +- .../{Partner => ServiceCard}/PassPartner.tsx | 6 +- .../PoleEmploiPartner.tsx | 6 +- .../ServiceCiviquePartner.tsx | 6 +- .../SimulationAlternancePartner.tsx | 18 ++++ .../ui/Card/Article/ArticleCard.module.scss | 3 +- .../components/ui/Card/Card.module.scss | 10 +- .../[nomMetier].page.tsx | 6 +- .../decouvrir-les-metiers/index.page.tsx | 2 +- src/pages/entreprendre/index.page.tsx | 6 +- src/pages/formations/index.page.tsx | 14 +-- .../logements/aides-logement/index.page.tsx | 10 +- 34 files changed, 257 insertions(+), 227 deletions(-) delete mode 100644 src/client/components/features/Partner/Card/PartnerCard.module.scss delete mode 100644 src/client/components/features/Partner/SimulationAlternancePartner.tsx create mode 100644 src/client/components/features/ServiceCard/Card/ServiceCard.module.scss rename src/client/components/features/{Partner/Card/PartnerCard.tsx => ServiceCard/Card/ServiceCard.tsx} (69%) create mode 100644 src/client/components/features/ServiceCard/DecouvrirApprentissage.tsx rename src/client/components/features/{Partner => ServiceCard}/InfoJeunesPartner.tsx (88%) rename src/client/components/features/{Partner => ServiceCard}/LaBonneAlternancePartner.tsx (78%) rename src/client/components/features/{Partner => ServiceCard}/LaBonneBoitePartner.tsx (82%) rename src/client/components/features/{Partner => ServiceCard}/MissionsLocalesPartner.tsx (90%) rename src/client/components/features/{Partner => ServiceCard}/MonCompteFormationPartner.tsx (82%) rename "src/client/components/features/Partner/M\303\251tiersDuSoinPartner.tsx" => "src/client/components/features/ServiceCard/M\303\251tiersDuSoinPartner.tsx" (83%) rename src/client/components/features/{Partner => ServiceCard}/OnisepPartner.tsx (77%) rename src/client/components/features/{Partner => ServiceCard}/ParcourSupPartner.tsx (82%) rename src/client/components/features/{Partner => ServiceCard}/PassPartner.tsx (79%) rename src/client/components/features/{Partner => ServiceCard}/PoleEmploiPartner.tsx (88%) rename src/client/components/features/{Partner => ServiceCard}/ServiceCiviquePartner.tsx (83%) create mode 100644 src/client/components/features/ServiceCard/SimulationAlternancePartner.tsx diff --git a/src/client/components/features/Accompagnement/Rechercher/RechercherAccompagnement.test.tsx b/src/client/components/features/Accompagnement/Rechercher/RechercherAccompagnement.test.tsx index c2a78cb6a8..d6aec0f257 100644 --- a/src/client/components/features/Accompagnement/Rechercher/RechercherAccompagnement.test.tsx +++ b/src/client/components/features/Accompagnement/Rechercher/RechercherAccompagnement.test.tsx @@ -151,7 +151,7 @@ describe('RechercherAccompagnement', () => { ); // When - const partenaireList = screen.getByRole('list', { name : 'Liste des partenaires' }); + const partenaireList = screen.getByRole('list', { name : 'Liste des partenaires et des services' }); const partenaireListItemList = within(partenaireList).getAllByRole('listitem'); // Then expect(partenaireList).toBeInTheDocument(); diff --git a/src/client/components/features/Accompagnement/Rechercher/RechercherAccompagnement.tsx b/src/client/components/features/Accompagnement/Rechercher/RechercherAccompagnement.tsx index 1d62bc0ab3..811e8ce3f0 100644 --- a/src/client/components/features/Accompagnement/Rechercher/RechercherAccompagnement.tsx +++ b/src/client/components/features/Accompagnement/Rechercher/RechercherAccompagnement.tsx @@ -6,10 +6,10 @@ import { import { RésultatRechercherAccompagnement, } from '~/client/components/features/Accompagnement/Rechercher/Résultat/RésultatRechercherAccompagnement'; -import { PartnerCardList } from '~/client/components/features/Partner/Card/PartnerCard'; -import { InfoJeunesPartner } from '~/client/components/features/Partner/InfoJeunesPartner'; -import { MissionsLocalesPartner } from '~/client/components/features/Partner/MissionsLocalesPartner'; -import { PoleEmploiPartner } from '~/client/components/features/Partner/PoleEmploiPartner'; +import { ServiceCardList } from '~/client/components/features/ServiceCard/Card/ServiceCard'; +import { InfoJeunesPartner } from '~/client/components/features/ServiceCard/InfoJeunesPartner'; +import { MissionsLocalesPartner } from '~/client/components/features/ServiceCard/MissionsLocalesPartner'; +import { PoleEmploiPartner } from '~/client/components/features/ServiceCard/PoleEmploiPartner'; import { Head } from '~/client/components/head/Head'; import { ListeRésultatsRechercherSolution, @@ -120,11 +120,11 @@ export function RechercherAccompagnement() { listeSolutionElement={} /> - + - + ); diff --git a/src/client/components/features/Alternance/Rechercher/RechercherAlternance.tsx b/src/client/components/features/Alternance/Rechercher/RechercherAlternance.tsx index dc20facde5..c5e78cdeb8 100644 --- a/src/client/components/features/Alternance/Rechercher/RechercherAlternance.tsx +++ b/src/client/components/features/Alternance/Rechercher/RechercherAlternance.tsx @@ -4,9 +4,10 @@ import React, { useEffect, useMemo, useState } from 'react'; import { FormulaireRechercheAlternance, } from '~/client/components/features/Alternance/FormulaireRecherche/FormulaireRechercheAlternance'; -import { PartnerCardList } from '~/client/components/features/Partner/Card/PartnerCard'; -import { OnisepPartner } from '~/client/components/features/Partner/OnisepPartner'; -import { PassPartner } from '~/client/components/features/Partner/PassPartner'; +import { ServiceCardList } from '~/client/components/features/ServiceCard/Card/ServiceCard'; +import { DecouvrirApprentissage } from '~/client/components/features/ServiceCard/DecouvrirApprentissage'; +import { OnisepPartner } from '~/client/components/features/ServiceCard/OnisepPartner'; +import { PassPartner } from '~/client/components/features/ServiceCard/PassPartner'; import { Head } from '~/client/components/head/Head'; import { ListeRésultatsRechercherSolution, @@ -131,10 +132,11 @@ export default function RechercherAlternance() { - + + - + ; } diff --git a/src/client/components/features/CampagneApprentissage/CampagneApprentissageJeunes/EnSavoirPlusApprentissageJeunes/EnSavoirPlusApprentissageJeunes.tsx b/src/client/components/features/CampagneApprentissage/CampagneApprentissageJeunes/EnSavoirPlusApprentissageJeunes/EnSavoirPlusApprentissageJeunes.tsx index 612eb31c49..8dd702b52c 100644 --- a/src/client/components/features/CampagneApprentissage/CampagneApprentissageJeunes/EnSavoirPlusApprentissageJeunes/EnSavoirPlusApprentissageJeunes.tsx +++ b/src/client/components/features/CampagneApprentissage/CampagneApprentissageJeunes/EnSavoirPlusApprentissageJeunes/EnSavoirPlusApprentissageJeunes.tsx @@ -7,8 +7,8 @@ import styles from './EnSavoirPlusApprentissageJeunes.module.scss'; export default function EnSavoirPlusApprentissageJeunes() { return
-

Parents : l’apprentissage, le bon choix pour votre enfant. On répond à toutes vos questions

+

Parents : l’apprentissage, le bon choix pour votre enfant. + On répond à toutes vos questions

Accéder à la FAQ Parents-Enfants diff --git a/src/client/components/features/CampagneApprentissage/CampagneApprentissageJeunes/PreparationApprentissage/PreparationApprentissage.tsx b/src/client/components/features/CampagneApprentissage/CampagneApprentissageJeunes/PreparationApprentissage/PreparationApprentissage.tsx index 8d93795007..236cbd7386 100644 --- a/src/client/components/features/CampagneApprentissage/CampagneApprentissageJeunes/PreparationApprentissage/PreparationApprentissage.tsx +++ b/src/client/components/features/CampagneApprentissage/CampagneApprentissageJeunes/PreparationApprentissage/PreparationApprentissage.tsx @@ -8,12 +8,11 @@ import styles from './PreparationApprentissage.module.scss'; export default function PreparationApprentissage() { return ( -
-
-

+
+

Vous souhaitez faire le choix de l’apprentissage ?

@@ -24,18 +23,18 @@ export default function PreparationApprentissage() { Trouver votre entreprise
-

-
-

+

+
+

La prépa-apprentissage c’est quoi ?

- Lire l‘article + Lire l‘article -
+ - ); + ); } diff --git a/src/client/components/features/Formation/Consulter/Statistiques/StatistiquesFormation.tsx b/src/client/components/features/Formation/Consulter/Statistiques/StatistiquesFormation.tsx index bd58d11fcb..f6537a573d 100644 --- a/src/client/components/features/Formation/Consulter/Statistiques/StatistiquesFormation.tsx +++ b/src/client/components/features/Formation/Consulter/Statistiques/StatistiquesFormation.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from '~/client/components/features/ServiceCard/Card/ServiceCard'; import { Container } from '~/client/components/layouts/Container/Container'; import { ArticleCardList, @@ -39,7 +39,7 @@ export function StatistiquesFormation({ statistiques }: { statistiques?: Statist } - Inserjeunes est un service d’aide à l’orientation des jeunes qui présente différents indicateurs pour toutes les formations professionnelles. - + diff --git a/src/client/components/features/Formation/Rechercher/RechercherFormation.test.tsx b/src/client/components/features/Formation/Rechercher/RechercherFormation.test.tsx index 7b6b75bed5..4503516eaf 100644 --- a/src/client/components/features/Formation/Rechercher/RechercherFormation.test.tsx +++ b/src/client/components/features/Formation/Rechercher/RechercherFormation.test.tsx @@ -162,7 +162,7 @@ describe('RechercherFormation', () => { expect(entête).toHaveTextContent('Découvrez des services faits pour vous'); expect(entête).toBeVisible(); - const listeDePartenaires = screen.getByRole('list', { name: 'Liste des partenaires' }); + const listeDePartenaires = screen.getByRole('list', { name: 'Liste des partenaires et des services' }); expect(listeDePartenaires).toBeVisible(); }); diff --git a/src/client/components/features/Formation/Rechercher/RechercherFormation.tsx b/src/client/components/features/Formation/Rechercher/RechercherFormation.tsx index 0dc645cd75..bc0b50ebbf 100644 --- a/src/client/components/features/Formation/Rechercher/RechercherFormation.tsx +++ b/src/client/components/features/Formation/Rechercher/RechercherFormation.tsx @@ -6,11 +6,12 @@ import { FormulaireRechercherFormation, } from '~/client/components/features/Formation/FormulaireRecherche/FormulaireRechercherFormation'; import { ÉtiquettesFiltreFormation } from '~/client/components/features/Formation/Rechercher/ÉtiquettesFiltreFormation'; -import { PartnerCardList } from '~/client/components/features/Partner/Card/PartnerCard'; -import { MétierDuSoinPartner } from '~/client/components/features/Partner/MétiersDuSoinPartner'; -import { MonCompteFormationPartner } from '~/client/components/features/Partner/MonCompteFormationPartner'; -import { OnisepPartner } from '~/client/components/features/Partner/OnisepPartner'; -import { ParcourSupPartner } from '~/client/components/features/Partner/ParcourSupPartner'; +import { ServiceCardList } from '~/client/components/features/ServiceCard/Card/ServiceCard'; +import { DecouvrirApprentissage } from '~/client/components/features/ServiceCard/DecouvrirApprentissage'; +import { MétierDuSoinPartner } from '~/client/components/features/ServiceCard/MétiersDuSoinPartner'; +import { MonCompteFormationPartner } from '~/client/components/features/ServiceCard/MonCompteFormationPartner'; +import { OnisepPartner } from '~/client/components/features/ServiceCard/OnisepPartner'; +import { ParcourSupPartner } from '~/client/components/features/ServiceCard/ParcourSupPartner'; import { Head } from '~/client/components/head/Head'; import { ListeRésultatsRechercherSolution, @@ -104,12 +105,13 @@ export default function RechercherFormation() { } /> - + + - + ; } diff --git "a/src/client/components/features/Job\303\211tudiant/Rechercher/RechercherJob\303\211tudiant.tsx" "b/src/client/components/features/Job\303\211tudiant/Rechercher/RechercherJob\303\211tudiant.tsx" index 20cde0377f..55f78787ef 100644 --- "a/src/client/components/features/Job\303\211tudiant/Rechercher/RechercherJob\303\211tudiant.tsx" +++ "b/src/client/components/features/Job\303\211tudiant/Rechercher/RechercherJob\303\211tudiant.tsx" @@ -3,10 +3,10 @@ import React, { useEffect, useMemo, useState } from 'react'; import { FormulaireRechercheJobÉtudiant, } from '~/client/components/features/JobÉtudiant/FormulaireRecherche/FormulaireRechercheJobÉtudiant'; -import { PartnerCardList } from '~/client/components/features/Partner/Card/PartnerCard'; -import { LaBonneBoitePartner } from '~/client/components/features/Partner/LaBonneBoitePartner'; -import { OnisepPartner } from '~/client/components/features/Partner/OnisepPartner'; -import { ServiceCiviquePartner } from '~/client/components/features/Partner/ServiceCiviquePartner'; +import { ServiceCardList } from '~/client/components/features/ServiceCard/Card/ServiceCard'; +import { LaBonneBoitePartner } from '~/client/components/features/ServiceCard/LaBonneBoitePartner'; +import { OnisepPartner } from '~/client/components/features/ServiceCard/OnisepPartner'; +import { ServiceCiviquePartner } from '~/client/components/features/ServiceCard/ServiceCiviquePartner'; import { Head } from '~/client/components/head/Head'; import { ListeRésultatsRechercherSolution, @@ -101,11 +101,11 @@ export function RechercherJobÉtudiant() { listeSolutionElement={} /> - + - + ); diff --git a/src/client/components/features/OffreEmploi/Rechercher/RechercherOffreEmploi.tsx b/src/client/components/features/OffreEmploi/Rechercher/RechercherOffreEmploi.tsx index 56f991d5a8..b6c2786df7 100644 --- a/src/client/components/features/OffreEmploi/Rechercher/RechercherOffreEmploi.tsx +++ b/src/client/components/features/OffreEmploi/Rechercher/RechercherOffreEmploi.tsx @@ -6,10 +6,10 @@ import { import { ÉtiquettesFiltreOffreEmploi, } from '~/client/components/features/OffreEmploi/Rechercher/ÉtiquettesFiltreOffreEmploi'; -import { PartnerCardList } from '~/client/components/features/Partner/Card/PartnerCard'; -import { LaBonneBoitePartner } from '~/client/components/features/Partner/LaBonneBoitePartner'; -import { OnisepPartner } from '~/client/components/features/Partner/OnisepPartner'; -import { ServiceCiviquePartner } from '~/client/components/features/Partner/ServiceCiviquePartner'; +import { ServiceCardList } from '~/client/components/features/ServiceCard/Card/ServiceCard'; +import { LaBonneBoitePartner } from '~/client/components/features/ServiceCard/LaBonneBoitePartner'; +import { OnisepPartner } from '~/client/components/features/ServiceCard/OnisepPartner'; +import { ServiceCiviquePartner } from '~/client/components/features/ServiceCard/ServiceCiviquePartner'; import { Head } from '~/client/components/head/Head'; import { ListeRésultatsRechercherSolution, @@ -95,11 +95,11 @@ export function RechercherOffreEmploi() { listeSolutionElement={} /> - + - + ); diff --git a/src/client/components/features/Partner/Card/PartnerCard.module.scss b/src/client/components/features/Partner/Card/PartnerCard.module.scss deleted file mode 100644 index 61dbc7b3c6..0000000000 --- a/src/client/components/features/Partner/Card/PartnerCard.module.scss +++ /dev/null @@ -1,88 +0,0 @@ -@import "@styles/utilities"; - -.partnerList { - @extend %max-container; - padding: 1rem; - list-style: none; - - & > li { - padding-block: 1rem; - } - - &Wrapper { - background-color: $color-background-white-lilac; - } - - @include media(xlarge) { - margin: auto; - padding-inline: 0; - } -} - -.card { - display: block; - - &Container { - width: 100%; - } - - &Logo { - align-self: center; - justify-self: center; - align-items: center; - justify-content: center; - height: 4.5rem; - margin: 1.25rem; - width: 100%; - - img { - object-fit: contain; - } - } - - &Action { - @extend %linkWithRightIcon; - } - - &Body { - display: flex; - flex-direction: column; - padding: 20px; - - > p { - margin-bottom: 20px; - @extend %text-regular; - } - - &__Title { - @extend %text-medium; - @extend %bold; - margin-bottom: 0.5rem; - } - } - - .serviceCiviqueColor { - @extend %bold; - color: #107cc0; - } - - &Headline:after { - content: " "; - } - - @include media(large) { - display: flex; - align-items: center; - - &Logo { - flex-shrink: 0; - width: 280px; - border: 0; - } - - &Body { - width: 100%; - border-left: 1px solid $color-separator; - } - } -} diff --git a/src/client/components/features/Partner/SimulationAlternancePartner.tsx b/src/client/components/features/Partner/SimulationAlternancePartner.tsx deleted file mode 100644 index eb8ea119e2..0000000000 --- a/src/client/components/features/Partner/SimulationAlternancePartner.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import React from 'react'; - -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; -import styles from '~/client/components/features/Partner/Card/PartnerCard.module.scss'; - -export function SimulationAlternancePartner() { - return ( - - <> - - Simulez en quelques clics - - et moins de 3 minutes le montant de la rémunération à laquelle vous - aurez droit en fonction de votre formation et de votre contrat. - - - ); -} diff --git a/src/client/components/features/ServiceCard/Card/ServiceCard.module.scss b/src/client/components/features/ServiceCard/Card/ServiceCard.module.scss new file mode 100644 index 0000000000..40e33b5a99 --- /dev/null +++ b/src/client/components/features/ServiceCard/Card/ServiceCard.module.scss @@ -0,0 +1,100 @@ +@import "@styles/utilities"; + +.services { + background-color: $color-background-white-lilac; + + & > ul { + @extend %max-container; + padding: 1rem; + list-style: none; + + @include media(xlarge) { + margin: auto; + padding-left: 0; + padding-right: 0; + } + + & > li { + padding-top: 1rem; + padding-bottom: 1rem; + } + } +} + +.cardContainer { + display: block; + + + & .card { + & .cardLogo { + align-self: center; + justify-self: center; + align-items: center; + justify-content: center; + + @include media(large) { + flex-shrink: 0; + border: 0; + } + } + + img { + object-fit: contain; + } + } + + & .cardCover { + grid-template-rows: 11.25rem 1fr; + + @include media(large) { + grid-template-rows: revert; + } + + & .cardLogo { + align-self: flex-end; + width: calc(100% - 1.5rem); + height: calc(100% - 0.75rem); + + @include media(large) { + width: 100%; + height: 100%; + margin: 0; + } + + > img { + border-radius: 20px; + object-fit: cover; + @include media(large) { + border-radius: 0; + padding: 0; + } + } + } + } + + & .cardBody { + display: flex; + flex-direction: column; + padding: 20px; + + @include media(large) { + width: 100%; + border-left: 1px solid $color-separator; + } + + > p { + margin-bottom: 20px; + @extend %text-regular; + } + + & .cardTitle { + @extend %text-medium; + @extend %bold; + margin-bottom: 0.5rem; + } + + & .cardAction { + @extend %linkWithRightIcon; + } + } +} diff --git a/src/client/components/features/Partner/Card/PartnerCard.tsx b/src/client/components/features/ServiceCard/Card/ServiceCard.tsx similarity index 69% rename from src/client/components/features/Partner/Card/PartnerCard.tsx rename to src/client/components/features/ServiceCard/Card/ServiceCard.tsx index e1bccdd393..f25c2c6531 100644 --- a/src/client/components/features/Partner/Card/PartnerCard.tsx +++ b/src/client/components/features/ServiceCard/Card/ServiceCard.tsx @@ -3,7 +3,6 @@ import React, { useMemo, } from 'react'; -import styles from '~/client/components/features/Partner/Card/PartnerCard.module.scss'; import { HtmlHeadingTag } from '~/client/components/props'; import { Card } from '~/client/components/ui/Card/Card'; import { Icon } from '~/client/components/ui/Icon/Icon'; @@ -12,10 +11,12 @@ import useBreakpoint from '~/client/hooks/useBreakpoint'; import { useIsInternalLink } from '~/client/hooks/useIsInternalLink'; import useReferrer from '~/client/hooks/useReferrer'; -export function PartnerCardList({ children }: React.PropsWithChildren) { +import styles from './ServiceCard.module.scss'; + +export function ServiceCardList({ children }: React.PropsWithChildren) { return ( -
-
    +
    +
      { React.Children.map(children, (child, index) => (
    • @@ -30,6 +31,7 @@ export function PartnerCardList({ children }: React.PropsWithChildren) { interface PartnerCardProps { children: React.ReactNode + imageFit?: 'cover' | 'contain' logo: string link: string linkLabel: string @@ -37,8 +39,10 @@ interface PartnerCardProps { titleAs: HtmlHeadingTag } -export function PartnerCard(props: PartnerCardProps & React.HTMLAttributes) { - const { className, logo, link, linkLabel, title, titleAs , children } = props; +export function ServiceCard(props: PartnerCardProps & React.HTMLAttributes) { + const { + className, imageFit = 'contain', logo, link, linkLabel, title, titleAs, children, + } = props; const isInternalLink = useIsInternalLink(link); const { isLargeScreen } = useBreakpoint(); useReferrer(); @@ -49,11 +53,11 @@ export function PartnerCard(props: PartnerCardProps & React.HTMLAttributes - + + - {title} + {title}

      {children}

      diff --git a/src/client/components/features/ServiceCard/DecouvrirApprentissage.tsx b/src/client/components/features/ServiceCard/DecouvrirApprentissage.tsx new file mode 100644 index 0000000000..bf4594b891 --- /dev/null +++ b/src/client/components/features/ServiceCard/DecouvrirApprentissage.tsx @@ -0,0 +1,18 @@ +import React from 'react'; + +import { ServiceCard } from './Card/ServiceCard'; + +export function DecouvrirApprentissage() { + return ( + + Découvrez tout sur l‘apprentissage et simulez la rémunération que vous pourriez avoir en devenant apprenti·e ! + + ); +} diff --git a/src/client/components/features/Partner/InfoJeunesPartner.tsx b/src/client/components/features/ServiceCard/InfoJeunesPartner.tsx similarity index 88% rename from src/client/components/features/Partner/InfoJeunesPartner.tsx rename to src/client/components/features/ServiceCard/InfoJeunesPartner.tsx index 77abc315e9..35e9cee1b4 100644 --- a/src/client/components/features/Partner/InfoJeunesPartner.tsx +++ b/src/client/components/features/ServiceCard/InfoJeunesPartner.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from './Card/PartnerCard'; +import { ServiceCard } from './Card/ServiceCard'; export function InfoJeunesPartner() { return ( - + ); } diff --git a/src/client/components/features/Partner/LaBonneAlternancePartner.tsx b/src/client/components/features/ServiceCard/LaBonneAlternancePartner.tsx similarity index 78% rename from src/client/components/features/Partner/LaBonneAlternancePartner.tsx rename to src/client/components/features/ServiceCard/LaBonneAlternancePartner.tsx index 4ed3107997..b63a462917 100644 --- a/src/client/components/features/Partner/LaBonneAlternancePartner.tsx +++ b/src/client/components/features/ServiceCard/LaBonneAlternancePartner.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from './Card/ServiceCard'; export function LaBonneAlternancePartner() { return ( - Vous ne trouvez pas de contrat ou d’offres d’alternance ? Essayez La bonne alternance ! - + ); } diff --git a/src/client/components/features/Partner/LaBonneBoitePartner.tsx b/src/client/components/features/ServiceCard/LaBonneBoitePartner.tsx similarity index 82% rename from src/client/components/features/Partner/LaBonneBoitePartner.tsx rename to src/client/components/features/ServiceCard/LaBonneBoitePartner.tsx index 7a0a3ef8cd..2325b62c39 100644 --- a/src/client/components/features/Partner/LaBonneBoitePartner.tsx +++ b/src/client/components/features/ServiceCard/LaBonneBoitePartner.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from '~/client/components/features/ServiceCard/Card/ServiceCard'; export function LaBonneBoitePartner() { return ( - + ); } diff --git a/src/client/components/features/Partner/MissionsLocalesPartner.tsx b/src/client/components/features/ServiceCard/MissionsLocalesPartner.tsx similarity index 90% rename from src/client/components/features/Partner/MissionsLocalesPartner.tsx rename to src/client/components/features/ServiceCard/MissionsLocalesPartner.tsx index 3d983aa9e1..8e6fabf7ac 100644 --- a/src/client/components/features/Partner/MissionsLocalesPartner.tsx +++ b/src/client/components/features/ServiceCard/MissionsLocalesPartner.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from './Card/PartnerCard'; +import { ServiceCard } from './Card/ServiceCard'; export function MissionsLocalesPartner() { return ( - + ); } diff --git a/src/client/components/features/Partner/MonCompteFormationPartner.tsx b/src/client/components/features/ServiceCard/MonCompteFormationPartner.tsx similarity index 82% rename from src/client/components/features/Partner/MonCompteFormationPartner.tsx rename to src/client/components/features/ServiceCard/MonCompteFormationPartner.tsx index c839514a92..2d7dc748d9 100644 --- a/src/client/components/features/Partner/MonCompteFormationPartner.tsx +++ b/src/client/components/features/ServiceCard/MonCompteFormationPartner.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from './Card/ServiceCard'; export function MonCompteFormationPartner() { return ( - + ); } diff --git "a/src/client/components/features/Partner/M\303\251tiersDuSoinPartner.tsx" "b/src/client/components/features/ServiceCard/M\303\251tiersDuSoinPartner.tsx" similarity index 83% rename from "src/client/components/features/Partner/M\303\251tiersDuSoinPartner.tsx" rename to "src/client/components/features/ServiceCard/M\303\251tiersDuSoinPartner.tsx" index 90b5df990e..326f5beae2 100644 --- "a/src/client/components/features/Partner/M\303\251tiersDuSoinPartner.tsx" +++ "b/src/client/components/features/ServiceCard/M\303\251tiersDuSoinPartner.tsx" @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from './Card/ServiceCard'; export function MétierDuSoinPartner() { return ( - + ); } diff --git a/src/client/components/features/Partner/OnisepPartner.tsx b/src/client/components/features/ServiceCard/OnisepPartner.tsx similarity index 77% rename from src/client/components/features/Partner/OnisepPartner.tsx rename to src/client/components/features/ServiceCard/OnisepPartner.tsx index ec3cd7a4e9..e4c5297caa 100644 --- a/src/client/components/features/Partner/OnisepPartner.tsx +++ b/src/client/components/features/ServiceCard/OnisepPartner.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from './Card/ServiceCard'; export function OnisepPartner() { return ( - Renseignez-vous sur les différents métiers avec l’ONISEP. Trouvez un métier qui vous correspond parmi plus de 700 fiches. - + ); } diff --git a/src/client/components/features/Partner/ParcourSupPartner.tsx b/src/client/components/features/ServiceCard/ParcourSupPartner.tsx similarity index 82% rename from src/client/components/features/Partner/ParcourSupPartner.tsx rename to src/client/components/features/ServiceCard/ParcourSupPartner.tsx index db9192af8d..e758b919d8 100644 --- a/src/client/components/features/Partner/ParcourSupPartner.tsx +++ b/src/client/components/features/ServiceCard/ParcourSupPartner.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from './Card/ServiceCard'; export function ParcourSupPartner() { return ( - + ); } diff --git a/src/client/components/features/Partner/PassPartner.tsx b/src/client/components/features/ServiceCard/PassPartner.tsx similarity index 79% rename from src/client/components/features/Partner/PassPartner.tsx rename to src/client/components/features/ServiceCard/PassPartner.tsx index a42b62139f..0bbb32ebe7 100644 --- a/src/client/components/features/Partner/PassPartner.tsx +++ b/src/client/components/features/ServiceCard/PassPartner.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from './Card/ServiceCard'; export function PassPartner() { return ( - La fonction publique accueille des apprentis dans tous les domaines et de tous niveaux. Découvrez les offres sur la place de l’apprentissage et des stages. - + ); } diff --git a/src/client/components/features/Partner/PoleEmploiPartner.tsx b/src/client/components/features/ServiceCard/PoleEmploiPartner.tsx similarity index 88% rename from src/client/components/features/Partner/PoleEmploiPartner.tsx rename to src/client/components/features/ServiceCard/PoleEmploiPartner.tsx index f3fc11e14e..256febb316 100644 --- a/src/client/components/features/Partner/PoleEmploiPartner.tsx +++ b/src/client/components/features/ServiceCard/PoleEmploiPartner.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from './Card/PartnerCard'; +import { ServiceCard } from './Card/ServiceCard'; export function PoleEmploiPartner() { return ( - + ); } diff --git a/src/client/components/features/Partner/ServiceCiviquePartner.tsx b/src/client/components/features/ServiceCard/ServiceCiviquePartner.tsx similarity index 83% rename from src/client/components/features/Partner/ServiceCiviquePartner.tsx rename to src/client/components/features/ServiceCard/ServiceCiviquePartner.tsx index 9b61964427..ac973bf488 100644 --- a/src/client/components/features/Partner/ServiceCiviquePartner.tsx +++ b/src/client/components/features/ServiceCard/ServiceCiviquePartner.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from '~/client/components/features/ServiceCard/Card/ServiceCard'; export function ServiceCiviquePartner() { return ( - + ); } diff --git a/src/client/components/features/ServiceCard/SimulationAlternancePartner.tsx b/src/client/components/features/ServiceCard/SimulationAlternancePartner.tsx new file mode 100644 index 0000000000..237e1cb29d --- /dev/null +++ b/src/client/components/features/ServiceCard/SimulationAlternancePartner.tsx @@ -0,0 +1,18 @@ +import React from 'react'; + +import { ServiceCard } from './Card/ServiceCard'; + +export function SimulationAlternancePartner() { + return ( + + Simulez en quelques clics et moins de 3 minutes le montant de la + rémunération à laquelle vous aurez droit en fonction de votre formation et de votre contrat. + + ); +} diff --git a/src/client/components/ui/Card/Article/ArticleCard.module.scss b/src/client/components/ui/Card/Article/ArticleCard.module.scss index d09ae88d53..be9ee6740e 100644 --- a/src/client/components/ui/Card/Article/ArticleCard.module.scss +++ b/src/client/components/ui/Card/Article/ArticleCard.module.scss @@ -21,9 +21,8 @@ .notOnlyVertical { .illustration { - height: 7rem; + height: 100%; @include media(large) { - width: 20rem; height: 10rem; } } diff --git a/src/client/components/ui/Card/Card.module.scss b/src/client/components/ui/Card/Card.module.scss index 0dcc843162..b1f0abfa7c 100644 --- a/src/client/components/ui/Card/Card.module.scss +++ b/src/client/components/ui/Card/Card.module.scss @@ -1,25 +1,25 @@ @import "@styles/utilities"; .cardComponent { - display: flex; + display: grid; background-color: $color-surface; box-shadow: $box-shadow; border-radius: 20px; overflow: hidden; &Horizontal { - flex-direction: row; + grid-template-columns: 18.875rem 1fr; } &Vertical { - flex-direction: column; + grid-template-rows: 7.75rem 1fr; } } .cardImageWrapper { - min-height: 50px; - min-width: 50px; position: relative; + min-height: 92px; + min-width: 310px; @include media(large) { min-width: 140px; diff --git a/src/pages/decouvrir-les-metiers/[nomMetier].page.tsx b/src/pages/decouvrir-les-metiers/[nomMetier].page.tsx index bd4f079e03..eb5e4b635f 100644 --- a/src/pages/decouvrir-les-metiers/[nomMetier].page.tsx +++ b/src/pages/decouvrir-les-metiers/[nomMetier].page.tsx @@ -4,7 +4,7 @@ import React from 'react'; import { ButtonRetour } from '~/client/components/features/ButtonRetour/ButtonRetour'; import { ConsulterFicheMétier } from '~/client/components/features/FicheMétier/Consulter/ConsulterFicheMétier'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from '~/client/components/features/ServiceCard/Card/ServiceCard'; import { Head } from '~/client/components/head/Head'; import { Container } from '~/client/components/layouts/Container/Container'; import { EnTete } from '~/client/components/ui/EnTete/EnTete'; @@ -42,7 +42,7 @@ export default function ConsulterFicheMetierPage({ ficheMetier }: ConsulterFiche
      - +
      Idéo-fiches métiers, Onisep, 14/09/2022, sous licence ODBL diff --git a/src/pages/decouvrir-les-metiers/index.page.tsx b/src/pages/decouvrir-les-metiers/index.page.tsx index 23457a1718..b5dda2bedb 100644 --- a/src/pages/decouvrir-les-metiers/index.page.tsx +++ b/src/pages/decouvrir-les-metiers/index.page.tsx @@ -3,7 +3,7 @@ import React from 'react'; import { FormulaireRechercheFicheMetier } from '~/client/components/features/FicheMétier/FormulaireRecherche/FormulaireRechercheFicheMetier'; import { RésultatRechercherMétier } from '~/client/components/features/FicheMétier/Rechercher/RésultatRechercherMétier'; -import { MétierDuSoinPartner } from '~/client/components/features/Partner/MétiersDuSoinPartner'; +import { MétierDuSoinPartner } from '~/client/components/features/ServiceCard/MétiersDuSoinPartner'; import { Head } from '~/client/components/head/Head'; import { Container } from '~/client/components/layouts/Container/Container'; import { InstantSearchLayout } from '~/client/components/layouts/InstantSearch/InstantSearchLayout'; diff --git a/src/pages/entreprendre/index.page.tsx b/src/pages/entreprendre/index.page.tsx index f59d186530..1a15e36258 100644 --- a/src/pages/entreprendre/index.page.tsx +++ b/src/pages/entreprendre/index.page.tsx @@ -8,7 +8,7 @@ import { RéseauÉconomieSocialeEtSolidaireList, RéseauFinancementList, } from '~/client/components/features/Entreprendre/Réseau/EntreprendreRéseau'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from '~/client/components/features/ServiceCard/Card/ServiceCard'; import { Head } from '~/client/components/head/Head'; import { Container } from '~/client/components/layouts/Container/Container'; import { Accordion } from '~/client/components/ui/Accordion/Accordion'; @@ -115,7 +115,7 @@ export default function Entreprendre() {

      Découvrez l’ensemble des opportunités offertes par l’éco-système marseillais

      - +
      diff --git a/src/pages/formations/index.page.tsx b/src/pages/formations/index.page.tsx index 4951aeeb04..054523ddb3 100644 --- a/src/pages/formations/index.page.tsx +++ b/src/pages/formations/index.page.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { PartnerCardList } from '~/client/components/features/Partner/Card/PartnerCard'; -import { MétierDuSoinPartner } from '~/client/components/features/Partner/MétiersDuSoinPartner'; -import { MonCompteFormationPartner } from '~/client/components/features/Partner/MonCompteFormationPartner'; -import { OnisepPartner } from '~/client/components/features/Partner/OnisepPartner'; -import { ParcourSupPartner } from '~/client/components/features/Partner/ParcourSupPartner'; +import { ServiceCardList } from '~/client/components/features/ServiceCard/Card/ServiceCard'; +import { MétierDuSoinPartner } from '~/client/components/features/ServiceCard/MétiersDuSoinPartner'; +import { MonCompteFormationPartner } from '~/client/components/features/ServiceCard/MonCompteFormationPartner'; +import { OnisepPartner } from '~/client/components/features/ServiceCard/OnisepPartner'; +import { ParcourSupPartner } from '~/client/components/features/ServiceCard/ParcourSupPartner'; import { Head } from '~/client/components/head/Head'; import { HeroWithButtonLink } from '~/client/components/ui/Hero/HeroWithButtonLink'; import useAnalytics from '~/client/hooks/useAnalytics'; @@ -31,12 +31,12 @@ export default function FormationPage() { />

      Je découvre les dispositifs pour m’accompagner dans ma formation

      - + - +
      diff --git a/src/pages/logements/aides-logement/index.page.tsx b/src/pages/logements/aides-logement/index.page.tsx index 18a914194e..f9078a4a59 100644 --- a/src/pages/logements/aides-logement/index.page.tsx +++ b/src/pages/logements/aides-logement/index.page.tsx @@ -1,6 +1,6 @@ import classNames from 'classnames'; -import { PartnerCard } from '~/client/components/features/Partner/Card/PartnerCard'; +import { ServiceCard } from '~/client/components/features/ServiceCard/Card/ServiceCard'; import { Head } from '~/client/components/head/Head'; import { Container } from '~/client/components/layouts/Container/Container'; import { HeroWithButtonLink } from '~/client/components/ui/Hero/HeroWithButtonLink'; @@ -38,7 +38,7 @@ export default function AidesLogement() {

      Découvrez vos aides :

      • - +
      • - +