16/02/2025 - 19h
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 521 B |
After Width: | Height: | Size: 3.9 KiB |
After Width: | Height: | Size: 630 B |
After Width: | Height: | Size: 383 B |
After Width: | Height: | Size: 616 KiB |
After Width: | Height: | Size: 4.3 KiB |
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 2.1 KiB |
After Width: | Height: | Size: 2.1 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 91 KiB |
After Width: | Height: | Size: 82 KiB |
After Width: | Height: | Size: 84 KiB |
After Width: | Height: | Size: 766 KiB |
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 962 B |
After Width: | Height: | Size: 270 B |
After Width: | Height: | Size: 204 B |
After Width: | Height: | Size: 214 B |
After Width: | Height: | Size: 17 KiB |
After Width: | Height: | Size: 2.8 KiB |
After Width: | Height: | Size: 2.9 KiB |
After Width: | Height: | Size: 296 B |
After Width: | Height: | Size: 293 B |
After Width: | Height: | Size: 389 B |
After Width: | Height: | Size: 134 KiB |
After Width: | Height: | Size: 101 KiB |
After Width: | Height: | Size: 511 B |
55
src/App.js
|
@ -76,7 +76,7 @@ import New_Marktplace_2025 from "./pages/new_p_marketplace_2025";
|
|||
import New_Fonctionnalite_2025 from "./pages/new_p_fonctionnalite_2025";
|
||||
|
||||
import New_A_Propos_2025 from "./pages/new_p_a_propos_2025";
|
||||
|
||||
import New_Home_Page_2025 from "./pages/new_p_home_page_2025";
|
||||
|
||||
|
||||
import New_Test_Header_Footer_2025 from "./pages/new_p_test_header_footer_2025";
|
||||
|
@ -167,37 +167,26 @@ function App() {
|
|||
|
||||
<Route path="/maintenance" exact component={Maintenance} />
|
||||
|
||||
<Route path="/fonctionnalites" exact component={Fonctionnalites} />
|
||||
|
||||
<Route path="/markeplace" exact component={Contact} />
|
||||
|
||||
<Route path="/contact" exact component={Contact} />
|
||||
|
||||
<Route path="/create_account" exact component={CreateAccount} />
|
||||
<Route path="/user-connexion" exact component={Connexion} />
|
||||
|
||||
|
||||
|
||||
<Route path="/testurl/:course/:tab" exact component={TestUrl} />
|
||||
<Route path="/testurl_new/:courseid/:tabid" exact component={TestUrl_New} />
|
||||
|
||||
<Route path="/ajout-article" exact component={AddArticleAvis} />
|
||||
|
||||
|
||||
|
||||
<Route path="/Display-Partner-Catalog-Detail-formation/:classId" exact component={Display_Partner_Catalog_DetailClass_new_v2} />
|
||||
<Route path="/Display-Partner-Catalog-Detail-formation/:classId/:action" exact component={Display_Partner_Catalog_DetailClass_new_v2} />
|
||||
|
||||
|
||||
|
||||
<Route path="/Recherche-Article-formation" exact component={RechecheArticles} />
|
||||
<Route path="/Ajout-Article-formation" exact component={AddArticle} />
|
||||
<Route path="/ResetUserPwd/:token/:accounttype" exact component={ResetUserPwd} />
|
||||
<Route path="/DeleteUserAccount/:token" exact component={DeleteUserAccount} />
|
||||
<Route path="/QuiSommesNous" exact component={QuiSommesNous_v3} />
|
||||
|
||||
<Route path="/qui-sommes-nous" exact component={QuiSommesNous_v3} />
|
||||
|
||||
|
||||
<Route path="/QuiSommesNous_v3" exact component={QuiSommesNous_v3} />
|
||||
<Route path="/ContactezNous" exact component={ContactezNous} />
|
||||
|
||||
<Route path="/mysy-account-activated/" exact component={AccountUserActivated} />
|
||||
{/* <Route path="/Produits-Services/" exact component={ProduitsService} />*/}
|
||||
<Route path="/tarifs_produits_services/" exact component={ProduitsService} />
|
||||
|
@ -230,22 +219,22 @@ function App() {
|
|||
<Route path="/intelligence-artificielle-mysy-training/" exact component={MySyIA} />
|
||||
|
||||
{/**** New design 2025 */}
|
||||
<Route path="/new_signin/" exact component={New_Sign_In_2025} />
|
||||
<Route path="/new_signup/" exact component={New_Sign_Up_2025} />
|
||||
<Route path="/new_tarif/" exact component={New_Tarif_2025} />
|
||||
<Route path="/new_contact/" exact component={New_Contact_2025} />
|
||||
<Route path="/new_display-detail-article/:articleId" exact component={New_Article_Detail_2025} />
|
||||
<Route path="/signin/" exact component={New_Sign_In_2025} />
|
||||
<Route path="/signup/" exact component={New_Sign_Up_2025} />
|
||||
<Route path="/tarif/" exact component={New_Tarif_2025} />
|
||||
<Route path="/contact/" exact component={New_Contact_2025} />
|
||||
<Route path="/display-detail-article/:articleId" exact component={New_Article_Detail_2025} />
|
||||
<Route path="/Display-Detail-Article/:articleId" exact component={New_Article_Detail_2025} />
|
||||
|
||||
|
||||
<Route path="/detaile-formation/:classId" exact component={New_Formation_Detail_2025} />
|
||||
{/* ex : http://localhost:3009/detaile-formation/habilitation-electrique-882*/}
|
||||
|
||||
<Route path="/marketplace/" exact component={New_Marktplace_2025} />
|
||||
<Route path="/new_fonctionnalite/" exact component={New_Fonctionnalite_2025} />
|
||||
<Route path="/fonctionnalites/" exact component={New_Fonctionnalite_2025} />
|
||||
|
||||
<Route path="/apropos/" exact component={New_A_Propos_2025} />
|
||||
<Route path="/" exact component={New_Home_Page_2025} />
|
||||
|
||||
<Route path="/new_aporpos/" exact component={New_A_Propos_2025} />
|
||||
<Route path="/" exact component={New_A_Propos_2025} />
|
||||
|
||||
|
||||
|
||||
{/* Debut Migration */}
|
||||
|
@ -269,6 +258,18 @@ function App() {
|
|||
<Route path="/PartnerLogin1" exact component={PartnerLogin1} />
|
||||
|
||||
<Route path="/mysy-user-account" exact component={Account} />
|
||||
<Route path="/Ajout-Article-formation" exact component={AddArticle} />
|
||||
<Route path="/ResetUserPwd/:token/:accounttype" exact component={ResetUserPwd} />
|
||||
<Route path="/QuiSommesNous" exact component={New_A_Propos_2025} />
|
||||
<Route path="/QuiSommesNous_v3" exact component={New_A_Propos_2025} />
|
||||
<Route path="/qui-sommes-nous" exact component={New_A_Propos_2025} />
|
||||
<Route path="/ContactezNous" exact component={New_Contact_2025} />
|
||||
|
||||
|
||||
|
||||
|
||||
<Route path="/DeleteUserAccount/:token" exact component={DeleteUserAccount} />
|
||||
|
||||
|
||||
|
||||
{/* Fin Migration */}
|
||||
|
@ -276,7 +277,7 @@ function App() {
|
|||
|
||||
|
||||
<Route path="/new_header_footer/" exact component={New_Test_Header_Footer_2025} />
|
||||
|
||||
|
||||
<Route component={NotFound} />
|
||||
</Switch>
|
||||
</BrowserRouter>
|
||||
|
|
|
@ -636,7 +636,7 @@ const DisplayDetailArticle = (props) => {
|
|||
<title> {`${DetailArticleAvis.title_formation}`} </title>
|
||||
</Helmet>
|
||||
|
||||
<Header />
|
||||
|
||||
|
||||
<h1 className="h1_transparent">{`${DetailArticleAvis.title_formation}`}</h1>
|
||||
<div className="div_mobile">
|
||||
|
@ -1122,9 +1122,7 @@ const DisplayDetailArticle = (props) => {
|
|||
|
||||
|
||||
<ListeArticle />
|
||||
<div className="pieddepage">
|
||||
<Footer />
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
@ -15,7 +15,7 @@ import img_1_old from "../mysy_img/1.jpg";
|
|||
import gestion_admin_img from "../mysy_img/gestion_admin_img.png";
|
||||
import e_learning_lms from "../mysy_img/e_learning_lms.png";
|
||||
|
||||
|
||||
|
||||
|
||||
import img_2 from "../mysy_img/lms.png";
|
||||
import img_3_old from "../mysy_img/3.jpg";
|
||||
|
|
|
@ -41,7 +41,7 @@ const Footer = () => {
|
|||
<div className='Row_Div'>
|
||||
<div className='Column_div'>
|
||||
<div className='Heading_p'>MySy Training</div>
|
||||
<a href="/qui-sommes-nous/#en_4_points" className='FooterLink_a'>À propos de nous</a>
|
||||
<a href="/apropos" className='FooterLink_a'>À propos de nous</a>
|
||||
<a href="/qui-sommes-nous/#notre_objectif" className='FooterLink_a'>Notre vision</a>
|
||||
<a href="/ContactezNous" className='FooterLink_a'>Nous contacter</a>
|
||||
</div>
|
||||
|
|
|
@ -103,7 +103,7 @@ function New_C_Article_Detail_2025() {
|
|||
|
||||
setpagecanonikurl(window.location.host);
|
||||
|
||||
console.log(" hello zzz, articleId = ", articleId);
|
||||
|
||||
|
||||
async function fetchData() {
|
||||
const result = await axios('https://geolocation-db.com/json/',);
|
||||
|
@ -137,6 +137,11 @@ function New_C_Article_Detail_2025() {
|
|||
} else {
|
||||
setuserconnected("1");
|
||||
}
|
||||
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
// setwindowWidth(window.innerWidth);
|
||||
// setwindowheight(window.innerHeight);
|
||||
|
||||
|
@ -356,7 +361,7 @@ function New_C_Article_Detail_2025() {
|
|||
e.preventDefault();
|
||||
window.location.href = "/Recherche-Article-formation"
|
||||
}}>
|
||||
<FcUndo /> Retour vers la liste des articles
|
||||
<FcUndo /> Retour vers la liste des articles
|
||||
</div>
|
||||
|
||||
|
||||
|
|
|
@ -89,12 +89,12 @@ function New_C_Header_2025() {
|
|||
|
||||
<div className="header-menu">
|
||||
<div className="logo-menu">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5NXXvA8XwfbJQA7/logo-my-s.png" alt="Logo MySy" className="logo" />
|
||||
<img src="/img/c_header_logo.png" alt="Logo MySy" className="logo" />
|
||||
|
||||
<div className="menu-list">
|
||||
<a href="/" className="menu-link">À propos</a>
|
||||
<a href="/new_fonctionnalite" className="menu-link">Fonctionnalités</a>
|
||||
<a href="/new_tarif" className="menu-link">Tarifs</a>
|
||||
<a href="/apropos" className="menu-link">À propos</a>
|
||||
<a href="/fonctionnalites" className="menu-link">Fonctionnalités</a>
|
||||
<a href="/tarif" className="menu-link">Tarifs</a>
|
||||
<a href="/Recherche-Article-formation" className="menu-link">Blog</a>
|
||||
<div className="separator"></div>
|
||||
<a href="/marketplace" className="menu-link">Marketplace</a>
|
||||
|
@ -108,7 +108,7 @@ function New_C_Header_2025() {
|
|||
</div>
|
||||
<div className="separator"></div>
|
||||
<div className="login-link">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5NXXvA8XwfbJQA7/user.png" alt="User" className="user-icon" />
|
||||
<img src="/img/user.png" alt="User" className="user-icon" />
|
||||
<span>Connexion</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -809,7 +809,7 @@ function New_C_Sign_In_2025() {
|
|||
<div className="create-account">
|
||||
<p className="text-wrapper-4">Vous n'avez pas de compte ?</p>
|
||||
<div className="text-wrapper-5" style={{ cursor: 'pointer' }} onClick={(e) => {
|
||||
history.push("/new_signup");
|
||||
history.push("/signup");
|
||||
}}>Créez un compte</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -968,7 +968,7 @@ function New_C_Sign_In_2025() {
|
|||
<div className="create-account">
|
||||
<p className="text-wrapper-6">Vous n'avez pas de compte ?</p>
|
||||
<div className="text-wrapper-7" style={{ cursor: 'pointer' }} onClick={(e) => {
|
||||
history.push("/new_signup");
|
||||
history.push("/signup");
|
||||
}}>Créez un compte</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1495,7 +1495,7 @@ function New_C_Sign_Up_2025() {
|
|||
<div className="create-account">
|
||||
<p className="text-wrapper-4">Vous avez déjà un compte ?</p>
|
||||
<div className="text-wrapper-5" style={{cursor:'pointer'}} onClick={(e) => {
|
||||
history.push("/new_signin");
|
||||
history.push("/signin");
|
||||
}}>Connectez-vous</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1929,7 +1929,7 @@ function New_C_Sign_Up_2025() {
|
|||
<div className="create-account">
|
||||
<p className="text-wrapper-6">Vous avez déjà un compte ?</p>
|
||||
<div className="text-wrapper-7" style={{cursor:'pointer'}} onClick={(e) => {
|
||||
history.push("/new_signin");
|
||||
history.push("/signin");
|
||||
}}>Connectez-vous</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -226,7 +226,7 @@ function ResetUserPwd() {
|
|||
<meta name="description" content="utisateur formation connexion" />
|
||||
<meta name="robots" content="index,follow" />
|
||||
</Helmet>
|
||||
<Header />
|
||||
|
||||
<div className="div_mobile">
|
||||
|
||||
|
||||
|
@ -329,9 +329,6 @@ function ResetUserPwd() {
|
|||
Impossible de mettre à jour le mot de passe.<br />
|
||||
</div>}
|
||||
|
||||
<div className="pieddepage">
|
||||
<Footer />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import React, { useState, useEffect } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { useHistory } from "react-router-dom";
|
||||
import { useHistory } from "react-router-dom";
|
||||
import { Button, FormGroup, Label, Input } from "reactstrap";
|
||||
import { FacebookLoginButton, GoogleLoginButton } from "react-social-login-buttons";
|
||||
//import { getCookie, setCookie, removeCookie } from 'react-use-cookie';
|
||||
|
|
|
@ -3,22 +3,22 @@ import './new_a_propos.css'
|
|||
const Features = () => {
|
||||
const values = [
|
||||
{
|
||||
icon: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons.png",
|
||||
icon: "/img/feature_innovation.png",
|
||||
title: "Innovation",
|
||||
description: "Nous anticipons vos besoins pour vous offrir des solutions adaptées."
|
||||
},
|
||||
{
|
||||
icon: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons-2.png",
|
||||
icon: "/img/feature_proximite.png",
|
||||
title: "Proximité",
|
||||
description: "Un accompagnement humain et personnalisé pour chaque client."
|
||||
},
|
||||
{
|
||||
icon: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons-3.png",
|
||||
icon: "/img/feature_excellence.png",
|
||||
title: "Excellence",
|
||||
description: "Des solutions fiables qui font leurs preuves au quotidien."
|
||||
},
|
||||
{
|
||||
icon: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons-4.png",
|
||||
icon: "/img/feature_transparence.png",
|
||||
title: "Transparence",
|
||||
description: "Nous construisons des relations basées sur la confiance."
|
||||
}
|
||||
|
|
|
@ -69,7 +69,7 @@ const ListCard = ({ imageUrl, title, buttonText }) => {
|
|||
</div>
|
||||
<div className='ListCard_contentStyle'>
|
||||
<h3 className='ListCard_titleStyle'>{title}</h3>
|
||||
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
||||
{/*<div style={{ display: 'flex', justifyContent: 'center' }}>
|
||||
<button className='ListCard_buttonStyle'
|
||||
onMouseEnter={(e) => {
|
||||
Object.assign(e.target.style, buttonHoverStyle);
|
||||
|
@ -80,14 +80,14 @@ const ListCard = ({ imageUrl, title, buttonText }) => {
|
|||
>
|
||||
{buttonText}
|
||||
</button>
|
||||
</div>
|
||||
</div>*/}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
ListCard.defaultProps = {
|
||||
imageUrl: 'https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/france-1.png',
|
||||
imageUrl: '/img/editeur_fr_drapeau.png',
|
||||
title: 'Editeur Français',
|
||||
buttonText: 'Découvrir'
|
||||
};
|
||||
|
|
|
@ -80,18 +80,7 @@ const LogoCloud = () => {
|
|||
|
||||
</div>
|
||||
|
||||
{/*<div className="LogoCloud_block2" >
|
||||
<img
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z6xwUmNxokPE5KT7/logos.png"
|
||||
alt="Partner Logos"
|
||||
style={{
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
objectFit: 'contain',
|
||||
filter: 'grayscale(0.6)',
|
||||
}}
|
||||
/>
|
||||
</div>*/}
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
|
@ -3,6 +3,8 @@ import Card_Title from './Card_Title';
|
|||
import ListCard from './ListCard';
|
||||
import ButtonText from './ButtonText';
|
||||
|
||||
import "./new_a_propos.css";
|
||||
|
||||
const WhyUsLayout = () => {
|
||||
return (
|
||||
<div className='WhyUsLayout_block1' >
|
||||
|
@ -10,12 +12,20 @@ const WhyUsLayout = () => {
|
|||
<Card_Title />
|
||||
</div>
|
||||
<div className='WhyUsLayout_block2'>
|
||||
<ListCard imageUrl="https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/france-1.png" title="Editeur Français" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/qualiopi.png" title="Accompagnement à la certification" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/solution.png" title="Solution complète pour gérer votre OF" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/euro-1.png" title="Solution la moins chère du marché" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="/img/editeur_fr_drapeau.png" title="Editeur Français" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="/img/qualiopi.png" title="Accompagnement à la certification" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="/img/solution_complete.png" title="Solution complète pour gérer votre OF" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="/img/sol_moins_chere.png" title="Solution la moins chère du marché" buttonText="Découvrir" />
|
||||
</div>
|
||||
<div style={{ flexGrow: 1, display: 'flex', justifyContent: 'center' }}>
|
||||
<div style={{ flexGrow: 1, display: 'flex', justifyContent: 'center' }}
|
||||
|
||||
onClick={() => {
|
||||
window.open(
|
||||
"/fonctionnalites/",
|
||||
'_self'
|
||||
);
|
||||
}}
|
||||
>
|
||||
<ButtonText text="Découvrir nos fonctionnalités" />
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -2,10 +2,10 @@ import React from 'react';
|
|||
import "./aboutussection.css";
|
||||
|
||||
const SolutionDescription = ({
|
||||
title = "Votre outil tout-en-un pour la gestion de la formation",
|
||||
title = "ELYOS, votre outil tout-en-un pour la gestion de votre Organisme de formation",
|
||||
subtitle = "Notre solution",
|
||||
description = "Découvrez nos solutions logicielles adaptées à la gestion administrative, à la communication et au suivi des performances de votre établissement de formation.",
|
||||
buttonText = "Découvrir notre solution"
|
||||
buttonText = "Découvrir ELYOS"
|
||||
}) => {
|
||||
return (
|
||||
<div className='aboutussection' >
|
||||
|
|
|
@ -69,6 +69,10 @@
|
|||
cursor: pointer;
|
||||
width: fit-content;
|
||||
transition: all 0.2s ease-in-out;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.SolutionDescription_block3_bton_text {
|
||||
|
@ -125,7 +129,7 @@
|
|||
}
|
||||
|
||||
@media only screen and (min-width: 601px) and (max-width: 991px) {
|
||||
|
||||
|
||||
.SolutionDescription_block1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -249,7 +253,7 @@
|
|||
}
|
||||
|
||||
@media only screen and (min-width: 992px) and (max-width: 1199px) {
|
||||
|
||||
|
||||
.SolutionDescription_block1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
|
@ -445,14 +445,14 @@
|
|||
mix-blend-mode: luminosity;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.LogoCloud_cb2_logo {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
flex: none;
|
||||
flex-grow: 0;
|
||||
flex-grow: 0;
|
||||
order: 0;
|
||||
flex-grow: 0;
|
||||
|
||||
|
@ -1059,8 +1059,9 @@
|
|||
}
|
||||
|
||||
.ListCard_imageStyle {
|
||||
height: 88px;
|
||||
width: 100%;
|
||||
object-fit: contain;
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
.ListCard_contentStyle {
|
||||
|
@ -1200,7 +1201,7 @@
|
|||
left: calc(50% - 1206px/2);
|
||||
top: 0px;
|
||||
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
}
|
||||
|
||||
.LogoCloud_cb2_logo {
|
||||
|
@ -1812,9 +1813,9 @@
|
|||
}
|
||||
|
||||
.ListCard_imageStyle {
|
||||
width: 88px;
|
||||
height: 88px;
|
||||
width: 100%;
|
||||
object-fit: contain;
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
.ListCard_contentStyle {
|
||||
|
@ -1952,7 +1953,7 @@
|
|||
left: calc(50% - 1206px/2);
|
||||
top: 0px;
|
||||
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
}
|
||||
|
||||
.LogoCloud_cb2_logo {
|
||||
|
@ -2562,9 +2563,9 @@
|
|||
}
|
||||
|
||||
.ListCard_imageStyle {
|
||||
width: 88px;
|
||||
height: 88px;
|
||||
width: 100%;
|
||||
object-fit: contain;
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
.ListCard_contentStyle {
|
||||
|
@ -2700,7 +2701,7 @@
|
|||
left: calc(50% - 1206px/2);
|
||||
top: 0px;
|
||||
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
}
|
||||
|
||||
.LogoCloud_cb2_logo {
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import React, { useRef, useState, useEffect } from "react";
|
||||
import { Helmet } from "react-helmet";
|
||||
import moment from "moment";
|
||||
import "./new_a_propos.css";
|
||||
|
||||
|
@ -7,24 +8,39 @@ import LogoCloud from './LogoCloud.js';
|
|||
import VisionSection from './VisionSection.js';
|
||||
import KeyMetrics from './KeyMetrics.js';
|
||||
import Features from './Features.js';
|
||||
import AboutUsSection from './block_stat/AboutUsSection.js';
|
||||
import AboutUsSection from './block_stat/AboutUsSection.js';
|
||||
|
||||
const New_C_A_Propos_2025 = (props) => {
|
||||
useEffect(() => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
|
||||
}, []);
|
||||
|
||||
return (
|
||||
|
||||
<div className="new_a_propos_2025">
|
||||
<Helmet>
|
||||
<title>Éditeur Français de logiciels de gestion pour organismes de formation - Gestion administrative, CRM, E-Learning, Marketplace</title>
|
||||
<meta name="description" content="Éditeur Français de logiciels pour organismes de formation. Avec notre solution Tout-en-Un, Nous automatisons les étapes Qualiopi (Inscription, Documents personnalisés, Les émargements sécurisés, Les évaluations, etc). Votre Le bilan pédagogique et financier est généré automatiquement." />
|
||||
<meta name="robots" content="index,follow" />
|
||||
<meta name="title" content="Éditeur Français de logiciels de gestion pour organismes de formation - Gestion administrative, CRM, E-Learning, Marketplace" />
|
||||
<link rel="canonical" href={window.location.href} />
|
||||
|
||||
</Helmet>
|
||||
|
||||
<div className="fonctionnalite_Background">
|
||||
<div className="title_and_cat">
|
||||
|
||||
<div className="title_and_cat_title">
|
||||
<div className="title_and_cat_title_text1">
|
||||
Votre partenaire pour des formations & <br />une gestion simplifiée.
|
||||
Votre partenaire pour des formations <br />& une gestion simplifiée.
|
||||
</div>
|
||||
|
||||
<div className="title_and_cat_title_text2">
|
||||
Que ce soit pour simplifier vos tâches administratives, optimiser la gestion de vos apprenants ou enrichir vos parcours e-learning, MySy Training vous accompagne.
|
||||
</div>
|
||||
MySy Training combine innovation et expertise pour transformer la manière dont vous formez et gérez votre établissement. </div>
|
||||
</div>
|
||||
|
||||
<div className="title_and_cat_title_cat">
|
||||
|
@ -45,7 +61,7 @@ const New_C_A_Propos_2025 = (props) => {
|
|||
<div className="title_and_cat_title_cat_bton_tarif" onClick={(e) => {
|
||||
|
||||
window.open(
|
||||
"/new_contact/",
|
||||
"/contact/",
|
||||
'_self'
|
||||
);
|
||||
}}>
|
||||
|
|
|
@ -108,7 +108,7 @@ const ContactInfo = ({ style = {} }) => {
|
|||
<div>
|
||||
<div style={labelStyles} >Nos réseaux sociaux :</div>
|
||||
<div style={socialIconsContainerStyles}>
|
||||
<a href="https://www.linkedin.com/company/mysy-training/" target="_blank"><img src={Social_Link_icon} alt="social Mysy Training LinkedIn" style={socialIconStyles} /></a>
|
||||
<a href="https://www.linkedin.com/company/mysy-training/" target="_blank"><img src="/img/contact_img_linkedin.png" alt="social Mysy Training LinkedIn" style={socialIconStyles} /></a>
|
||||
<a href="https://www.facebook.com/people/MySy-Training-Technology/100083219647910/" target="_blank"><img src={Social_Fa_icon} alt="social Mysy Training Facebook" style={socialIconStyles} /></a>
|
||||
<a href="https://twitter.com/mysy_training" target="_blank"> <img src={Social_X_icon} alt="social Mysy Training X (twitter)" style={socialIconStyles} /></a>
|
||||
|
||||
|
|
|
@ -1,15 +1,31 @@
|
|||
|
||||
import React, { useState, useEffect } from "react";
|
||||
import { Helmet } from "react-helmet";
|
||||
import './contact_automatic_files.css';
|
||||
import ContactForm from './ContactForm';
|
||||
import ContactInfo from './ContactInfo';
|
||||
import Footer from './Footer';
|
||||
|
||||
const Contact_Layout = () => {
|
||||
|
||||
useEffect(() => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
}, []);
|
||||
|
||||
|
||||
return (
|
||||
<div style={{ width: '100%', minHeight: '100vh', display: 'flex', flexDirection: 'column' }} id="debut">
|
||||
<div style={{ flexGrow: 1, display: 'flex', flexDirection: 'column', alignItems: 'center', background: 'url(https://dashboard.codeparrot.ai/api/image/Z5UxzNgGlUAkMdGQ/backgrou.png)', backgroundSize: 'cover', padding: '90px 0' }}>
|
||||
<Helmet>
|
||||
<meta name="description" content="Éditeur Français de logiciels pour organisme de formation. Avec solutions de E-Learning, gestion administrative et gestion relation client nous accompagnons les organismes de formation à réaliser l’audit QUALIOPI en toute sérénité. Nous sommes les moins cher du marché. Nous vous accompagnons automatiser vos process : inscription, évaluation, émargement (qr-code), Check-list QUALIOPI, Personnalisation et édition documents, Gestion formateurs, Catalogue formations personnalisé. Nous sommes les moins cher du marché. Nous automatisons vos process : inscription, évaluation, émargement (qr-code), QUALIOPI, Personnalisation des documents, Gestion formateurs, Catalogue personnalisé, bilan pédagogique et financier (PBF). Nos options comme la signature électronique sont inclus dans le tarif de base." />
|
||||
<meta name="robots" content="index,follow" />
|
||||
<meta name="title" content="MySy Training, contactez-nous" />
|
||||
<link rel="canonical" href={window.location.href} />
|
||||
</Helmet>
|
||||
|
||||
|
||||
<div style={{ flexGrow: 1, display: 'flex', flexDirection: 'column', alignItems: 'center', background: 'url(/img/contact_img_backgrou.png)', backgroundSize: 'cover', padding: '90px 0' }}>
|
||||
<h1 style={{ fontFamily: 'DM Sans', fontSize: '36px', fontWeight: 700, color: '#16274F', textAlign: 'center', marginBottom: '20px' }}>Un besoin, une question ?<br />Nous sommes à votre disposition.</h1>
|
||||
<p style={{ fontFamily: 'Inter', fontSize: '16px', color: '#4B5162', textAlign: 'center', maxWidth: '600px', marginBottom: '0px' }}>
|
||||
C'est à vous. Dites-nous tout <span style={{ 'fontSize': '30px' }}>✍</span>
|
||||
|
|
|
@ -1,176 +0,0 @@
|
|||
import React from 'react';
|
||||
|
||||
const Footer = ({ style = {} }) => {
|
||||
const footerStyle = {
|
||||
width: '100%',
|
||||
minWidth: '1024px',
|
||||
height: '368px',
|
||||
backgroundColor: '#043a32',
|
||||
padding: '64px',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
boxSizing: 'border-box',
|
||||
...style
|
||||
};
|
||||
|
||||
const logoAddressStyle = {
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '12px',
|
||||
width: '416px',
|
||||
marginBottom: '24px'
|
||||
};
|
||||
|
||||
const addressTextStyle = {
|
||||
color: '#ffffff',
|
||||
opacity: 0.7,
|
||||
fontSize: '16px',
|
||||
lineHeight: '32px',
|
||||
fontFamily: 'Inter'
|
||||
};
|
||||
|
||||
const linksContainerStyle = {
|
||||
display: 'flex',
|
||||
flexDirection: 'row',
|
||||
gap: '120px',
|
||||
flexWrap: 'wrap',
|
||||
justifyContent: 'space-between',
|
||||
marginBottom: '24px'
|
||||
};
|
||||
|
||||
const linkColumnStyle = {
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '12px'
|
||||
};
|
||||
|
||||
const linkStyle = {
|
||||
color: '#ffffff',
|
||||
opacity: 0.8,
|
||||
fontSize: '16px',
|
||||
lineHeight: '24px',
|
||||
fontFamily: 'Inter',
|
||||
cursor: 'pointer'
|
||||
};
|
||||
|
||||
const dividerStyle = {
|
||||
width: '100%',
|
||||
height: '1px',
|
||||
backgroundColor: '#ffffff',
|
||||
opacity: 0.2,
|
||||
margin: '24px 0'
|
||||
};
|
||||
|
||||
const bottomContainerStyle = {
|
||||
display: 'flex',
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'space-between',
|
||||
alignItems: 'center',
|
||||
flexWrap: 'wrap'
|
||||
};
|
||||
|
||||
const legalLinksStyle = {
|
||||
display: 'flex',
|
||||
flexDirection: 'row',
|
||||
gap: '32px',
|
||||
flexWrap: 'wrap'
|
||||
};
|
||||
|
||||
const legalLinkStyle = {
|
||||
color: '#ffffff',
|
||||
fontSize: '14px',
|
||||
lineHeight: '20px',
|
||||
fontFamily: 'Inter',
|
||||
cursor: 'pointer'
|
||||
};
|
||||
|
||||
const socialIconsStyle = {
|
||||
display: 'flex',
|
||||
flexDirection: 'row',
|
||||
gap: '12px'
|
||||
};
|
||||
|
||||
const socialIconStyle = {
|
||||
width: '24px',
|
||||
height: '24px',
|
||||
cursor: 'pointer'
|
||||
};
|
||||
|
||||
return (
|
||||
<footer style={footerStyle}>
|
||||
<div style={{ display: 'flex', flexDirection: 'row', flexWrap: 'wrap', justifyContent: 'space-between' }}>
|
||||
<div style={logoAddressStyle}>
|
||||
<img
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z5UxzNgGlUAkMdGQ/logo-my-s-2.png"
|
||||
alt="MySy Logo"
|
||||
style={{ width: '144px', height: '48px' }}
|
||||
/>
|
||||
<p style={addressTextStyle}>
|
||||
Adresse : 1 Cr du Havre, 75008 Paris<br />
|
||||
E-mail : contact@mysy-training.com<br />
|
||||
Téléphone fixe : +331 77 00 38 57
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div style={linksContainerStyle}>
|
||||
<div style={linkColumnStyle}>
|
||||
<span style={linkStyle}>Qui sommes-nous ?</span>
|
||||
<span style={linkStyle}>Fonctionnaltiés</span>
|
||||
<span style={linkStyle}>Tarifs</span>
|
||||
<span style={linkStyle}>Blog</span>
|
||||
<span style={linkStyle}>Nous contacter</span>
|
||||
</div>
|
||||
|
||||
<div style={linkColumnStyle}>
|
||||
<span style={linkStyle}>Services</span>
|
||||
<span style={linkStyle}>Intégrations</span>
|
||||
<span style={linkStyle}>Assistance</span>
|
||||
<span style={linkStyle}>FAQ</span>
|
||||
<span style={linkStyle}>Carrières</span>
|
||||
</div>
|
||||
|
||||
<div style={linkColumnStyle}>
|
||||
<span style={linkStyle}>Solutions</span>
|
||||
<span style={linkStyle}>Partenariats</span>
|
||||
<span style={linkStyle}>Support</span>
|
||||
<span style={linkStyle}>Communauté</span>
|
||||
<span style={linkStyle}>Aide</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style={dividerStyle} />
|
||||
|
||||
<div style={bottomContainerStyle}>
|
||||
<div style={legalLinksStyle}>
|
||||
<span style={legalLinkStyle}>Privacy policy</span>
|
||||
<span style={legalLinkStyle}>Cookies</span>
|
||||
<span style={legalLinkStyle}>Legal</span>
|
||||
<span style={legalLinkStyle}>Accessibility</span>
|
||||
<span style={legalLinkStyle}>Copyright © 2024 MySy. Tous droits réservés.</span>
|
||||
</div>
|
||||
|
||||
<div style={socialIconsStyle}>
|
||||
<img
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z5UxzNgGlUAkMdGQ/facebook.png"
|
||||
alt="Facebook"
|
||||
style={socialIconStyle}
|
||||
/>
|
||||
<img
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z5UxzNgGlUAkMdGQ/instagra.png"
|
||||
alt="Instagram"
|
||||
style={socialIconStyle}
|
||||
/>
|
||||
<img
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z5UxzNgGlUAkMdGQ/twitter.png"
|
||||
alt="Twitter"
|
||||
style={socialIconStyle}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
};
|
||||
|
||||
export default Footer;
|
||||
|
|
@ -60,8 +60,8 @@ const Badge_Fonctionnalite = (props) => {
|
|||
|
||||
{props.badge.detail_1 && <ul>
|
||||
{props.badge.detail_1 && <li> {props.badge.detail_1} </li>}
|
||||
{props.badge.detail_1 && <li> {props.badge.detail_2}</li>}
|
||||
{props.badge.detail_1 && <li> {props.badge.detail_3}</li>}
|
||||
{props.badge.detail_2 && <li> {props.badge.detail_2}</li>}
|
||||
{props.badge.detail_3 && <li> {props.badge.detail_3}</li>}
|
||||
</ul>}
|
||||
</p>
|
||||
</div>
|
||||
|
|
|
@ -5,8 +5,9 @@ const MySy_CRM_Section = () => {
|
|||
return (
|
||||
<div className='new_fonctionalites_2025 mysy_crm_section_block1'>
|
||||
{/* Right Image */}
|
||||
<div className='mysy_crm_section_block_image' />
|
||||
|
||||
<div className='mysy_crm_section_block_image'>
|
||||
<img src="/img/fonctionnalite_img/img_crm.png" alt="Content illustration" className='contentsection_image' />
|
||||
</div>
|
||||
{/* Left Content Container */}
|
||||
<div className='mysy_crm_section_block_text'>
|
||||
{/* Title + Description Container */}
|
||||
|
@ -37,7 +38,14 @@ const MySy_CRM_Section = () => {
|
|||
}}
|
||||
onMouseOut={(e) => {
|
||||
e.currentTarget.style.background = 'transparent';
|
||||
}}>
|
||||
}}
|
||||
onClick={() => {
|
||||
window.open(
|
||||
"/tarif/",
|
||||
'_self'
|
||||
);
|
||||
}}
|
||||
>
|
||||
<span className='mysy_crm_section_block_text_tite_desc_bton_span'>
|
||||
Découvrez nos tarifs
|
||||
</span>
|
||||
|
|
|
@ -3,12 +3,16 @@ import React from 'react';
|
|||
const ContentSection = ({
|
||||
title = "GESTION ADMNISTRATIVE",
|
||||
heading = "Simplifiez vos processus administratifs.",
|
||||
description = `Gagnez du temps et réduisez les erreurs grâce à des outils performants et intuitifs. Gérez facilement le processus d'inscription des apprenants, les émargements (à distance ou en présentiel) et les évaluations.
|
||||
description_1 = `Gagnez du temps et réduisez les erreurs grâce à des outils performants et intuitifs.`,
|
||||
description_2 = `Gérez facilement le processus d'inscription des apprenants, les émargements (à distance ou en présentiel) et les évaluations.`,
|
||||
|
||||
description_3 = `Cette solution centralisée vous permet également d'administrer les enseignants, le matériel pédagogique, le planning de formation et les agendas. `,
|
||||
|
||||
description_4 = `Générez en un clic votre Bilan Pédagogique et Financier (BPF) et partagez vos formations en ligne grâce à un intranet intégré.`,
|
||||
|
||||
Cette solution centralisée vous permet également d'administrer les enseignants, le matériel pédagogique, le planning de formation et les agendas.
|
||||
Générez en un clic votre Bilan Pédagogique et Financier (BPF) et partagez vos formations en ligne grâce à un intranet intégré.`,
|
||||
buttonText = "Découvrez nos tarifs",
|
||||
imageSrc = "img/fonctionnalite_img/img_gestion_admin.png"
|
||||
imageSrc = "/img/fonctionnalite_img/img_gestion_admin.png",
|
||||
buttonText_link_url = "/tarif/",
|
||||
}) => {
|
||||
const styles = {
|
||||
section: {
|
||||
|
@ -89,20 +93,31 @@ Générez en un clic votre Bilan Pédagogique et Financier (BPF) et partagez vos
|
|||
<div className='contentsection_categorytitle'>{title}</div>
|
||||
<h1 className='contentsection_mainheading'>{heading}</h1>
|
||||
</div>
|
||||
<p className='contentsection_description'>{description}</p>
|
||||
<button className='contentsection_button'
|
||||
<p className='contentsection_description'>{description_1}</p>
|
||||
<p className='contentsection_description'>{description_2}</p>
|
||||
<p className='contentsection_description'>{description_3}</p>
|
||||
<p className='contentsection_description'>{description_4}</p>
|
||||
|
||||
<button className='contentsection_description contentsection_button'
|
||||
onMouseOver={(e) => {
|
||||
e.currentTarget.style.backgroundColor = '#f5f6f7';
|
||||
}}
|
||||
onMouseOut={(e) => {
|
||||
e.currentTarget.style.backgroundColor = 'transparent';
|
||||
}}
|
||||
|
||||
onClick={() => {
|
||||
window.open(
|
||||
buttonText_link_url,
|
||||
'_self'
|
||||
);
|
||||
}}
|
||||
>
|
||||
<span className='contentsection_buttonText'>{buttonText}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div className='contentsection_contentcontainer_img'>
|
||||
<img src={imageSrc} alt="Content illustration" className='contentsection_image' />
|
||||
<div className='contentsection_contentcontainer_img'>
|
||||
<img src={imageSrc} alt="Content illustration" className='contentsection_image' />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
@ -1,18 +1,18 @@
|
|||
import React from 'react';
|
||||
|
||||
|
||||
const ELearningSection = () => {
|
||||
return (
|
||||
<div className='new_fonctionalites_2025 elearningsection_block1'>
|
||||
<div className='new_fonctionalites_2025 elearningsection_block1'>
|
||||
{/* Left Content Container */}
|
||||
<div className='elearningsection_block2'>
|
||||
<div className='elearningsection_block2'>
|
||||
{/* Title + Description Container */}
|
||||
<div className='elearningsection_text_title'>
|
||||
{/* Title Section */}
|
||||
<div className='elearningsection_text_title_title'>
|
||||
<span className='elearningsection_text_title_title_span'>
|
||||
<span className='elearningsection_text_title_title_span'>
|
||||
e-learning
|
||||
</span>
|
||||
<h1 className='elearningsection_text_title_title_h1'>
|
||||
<h1 className='elearningsection_text_title_title_h1'>
|
||||
Enrichissez vos formations avec des outils e-learning
|
||||
</h1>
|
||||
</div>
|
||||
|
@ -30,13 +30,19 @@ const ELearningSection = () => {
|
|||
</div>
|
||||
|
||||
{/* Button */}
|
||||
<button className='elearningsection_text_bton'
|
||||
onMouseOver={(e) => {
|
||||
e.currentTarget.style.background = '#f5f5f5';
|
||||
}}
|
||||
onMouseOut={(e) => {
|
||||
e.currentTarget.style.background = 'transparent';
|
||||
}}>
|
||||
<button className='elearningsection_text_bton'
|
||||
onMouseOver={(e) => {
|
||||
e.currentTarget.style.background = '#f5f5f5';
|
||||
}}
|
||||
onMouseOut={(e) => {
|
||||
e.currentTarget.style.background = 'transparent';
|
||||
}}
|
||||
onClick={() => {
|
||||
window.open(
|
||||
"/tarif/",
|
||||
'_self'
|
||||
);
|
||||
}}>
|
||||
<span className='elearningsection_text_bton_span' >
|
||||
Découvrez nos tarifs
|
||||
</span>
|
||||
|
@ -44,7 +50,9 @@ const ELearningSection = () => {
|
|||
</div>
|
||||
|
||||
{/* Right Image */}
|
||||
<div className='elearningsection_img'/>
|
||||
<div className='elearningsection_img'>
|
||||
<img src="/img/fonctionnalite_img/img_lms.png" alt="Content illustration" className='contentsection_image' />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -99,7 +99,14 @@ const ELearningSection = () => {
|
|||
fontSize: '16px',
|
||||
fontWeight: 700,
|
||||
padding: '0 8px'
|
||||
}}>
|
||||
}}
|
||||
onClick={() => {
|
||||
window.open(
|
||||
"/tarif/",
|
||||
'_self'
|
||||
);
|
||||
}}
|
||||
>
|
||||
Découvrez nos tarifs
|
||||
</span>
|
||||
</button>
|
||||
|
@ -110,7 +117,7 @@ const ELearningSection = () => {
|
|||
width: '692px',
|
||||
height: '692px',
|
||||
borderRadius: '16px',
|
||||
backgroundImage: 'url(https://dashboard.codeparrot.ai/api/image/Z6NsXjRi7Jes3898/image-he.png)',
|
||||
backgroundImage: 'url(/img/elearning_section_img.png)',
|
||||
backgroundSize: 'cover',
|
||||
backgroundPosition: 'center'
|
||||
}} />
|
||||
|
|
|
@ -36,19 +36,19 @@ const FeatureCard = ({ iconUrl, title, description, buttonText, module }) => {
|
|||
|
||||
if (String(module) === "gestion_admin") {
|
||||
window.open(
|
||||
"/new_header_footer#badge_gestion_admin",
|
||||
"/fonctionnalites#badge_gestion_admin",
|
||||
'_self'
|
||||
);
|
||||
}
|
||||
else if (String(module) === "crm") {
|
||||
window.open(
|
||||
"/new_header_footer#badge_crm",
|
||||
"/fonctionnalites#badge_crm",
|
||||
'_self'
|
||||
);
|
||||
}
|
||||
else if (String(module) === "lms") {
|
||||
window.open(
|
||||
"/new_header_footer#badge_lms",
|
||||
"/fonctionnalites#badge_lms",
|
||||
'_self'
|
||||
);
|
||||
}
|
||||
|
|
|
@ -11,26 +11,34 @@ const FeaturesLayout = () => {
|
|||
</div>
|
||||
<div className='featureslayout_block_cards' >
|
||||
<FeatureCard
|
||||
iconUrl="img/fonctionnalite_img/img_top_mini_gestion_admin.png"
|
||||
iconUrl="/img/fonctionnalite_img/img_top_mini_gestion_admin.png"
|
||||
title="Gestion administrative"
|
||||
description="Simplifiez la gestion de vos processus grâce à des outils performants : planification, automatisation et rapports."
|
||||
buttonText="Découvrir"
|
||||
module="gestion_admin"
|
||||
/>
|
||||
<FeatureCard
|
||||
iconUrl="img/fonctionnalite_img/img_top_mini_crm.png"
|
||||
iconUrl="/img/fonctionnalite_img/img_top_mini_crm.png"
|
||||
title="Relation Client (CRM)"
|
||||
description="Optimisez le suivi de vos apprenants avec des tableaux de bord personnalisés."
|
||||
buttonText="Découvrir"
|
||||
module="crm"
|
||||
/>
|
||||
<FeatureCard
|
||||
iconUrl="img/fonctionnalite_img/img_top_mini_lms.png"
|
||||
iconUrl="/img/fonctionnalite_img/img_top_mini_lms.png"
|
||||
title="E-learning (LMS)"
|
||||
description="Créez des parcours engageants et modulables, avec des micro-certifications et des contenus interactifs."
|
||||
buttonText="Découvrir"
|
||||
module="lms"
|
||||
/>
|
||||
|
||||
<FeatureCard
|
||||
iconUrl="/img/fonctionnalite_img/img_top_mini_market_place.png"
|
||||
title="Marketplace"
|
||||
description="Créez des parcours engageants et modulables, avec des micro-certifications et des contenus interactifs."
|
||||
buttonText="Découvrir"
|
||||
module="marketplace"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
|
||||
height: 280px;
|
||||
/* left: calc(50% - 1081px/2 + 0.5px);*/
|
||||
|
||||
|
||||
width: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
@ -43,7 +43,7 @@
|
|||
padding: 0px;
|
||||
gap: 20px;
|
||||
|
||||
|
||||
|
||||
min-height: 202px;
|
||||
|
||||
|
||||
|
@ -72,7 +72,7 @@
|
|||
text-align: center;
|
||||
color: #16274F;
|
||||
flex: none;
|
||||
flex-grow: 0;
|
||||
flex-grow: 0;
|
||||
order: 0;
|
||||
flex-grow: 0;
|
||||
margin-left: auto;
|
||||
|
@ -392,6 +392,8 @@
|
|||
padding-top: 10px;
|
||||
margin-bottom: 5rem;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
|
@ -427,13 +429,27 @@
|
|||
}
|
||||
|
||||
.contentsection_description {
|
||||
/* Commons/Body/Body - L */
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: #4b5162;
|
||||
/* or 150% */
|
||||
|
||||
/* Foundation /Blue-Grey/Normal */
|
||||
color: #4B5162;
|
||||
|
||||
opacity: 0.8;
|
||||
white-space: pre-line;
|
||||
|
||||
/* Inside auto layout */
|
||||
flex: none;
|
||||
order: 1;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
text-align: left;
|
||||
margin-bottom: 0px;
|
||||
|
||||
}
|
||||
|
||||
.contentsection_button {
|
||||
|
@ -470,6 +486,8 @@
|
|||
flex-direction: column;
|
||||
width: 100%;
|
||||
gap: 32px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
|
@ -492,7 +510,6 @@
|
|||
width: 100%;
|
||||
height: 25rem;
|
||||
border-radius: 16px;
|
||||
background: url("/public/img/fonctionnalite_img/img_crm.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
|
||||
|
@ -503,6 +520,8 @@
|
|||
flex-direction: column;
|
||||
gap: 32px;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.mysy_crm_section_block_text_tite_desc {
|
||||
|
@ -594,6 +613,8 @@
|
|||
flex-direction: column;
|
||||
gap: 32px;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
|
@ -1074,14 +1095,16 @@
|
|||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 10px;
|
||||
margin-bottom: 5rem;
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
.contentsection_contentcontainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 540px;
|
||||
width: 45%;
|
||||
gap: 32px;
|
||||
}
|
||||
|
||||
|
@ -1090,6 +1113,7 @@
|
|||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.contentsection_categorytitle {
|
||||
|
@ -1110,12 +1134,27 @@
|
|||
}
|
||||
|
||||
.contentsection_description {
|
||||
/* Commons/Body/Body - L */
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: #4b5162;
|
||||
/* or 150% */
|
||||
|
||||
/* Foundation /Blue-Grey/Normal */
|
||||
color: #4B5162;
|
||||
|
||||
opacity: 0.8;
|
||||
white-space: 'pre-line';
|
||||
|
||||
/* Inside auto layout */
|
||||
flex: none;
|
||||
order: 1;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
text-align: left;
|
||||
margin-bottom: 0px;
|
||||
|
||||
}
|
||||
|
||||
.contentsection_button {
|
||||
|
@ -1130,28 +1169,30 @@
|
|||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background: #FFF;
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
.contentsection_buttonText {
|
||||
font-family: 'DM Sans';
|
||||
font-size: 16px;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
color: #4b5162;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.contentsection_image {
|
||||
width: 100%;
|
||||
height: unset;
|
||||
width: 90%;
|
||||
border-radius: 16px;
|
||||
object-fit: cover;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.contentsection_contentcontainer_img {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 50%;
|
||||
width: 55%;
|
||||
gap: 32px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
|
@ -1160,20 +1201,21 @@
|
|||
flex-direction: row;
|
||||
gap: 20px;
|
||||
background: #FFFFFF;
|
||||
width: 90%;
|
||||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 10px;
|
||||
margin-bottom: 5rem;
|
||||
padding-top: 6rem;
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.mysy_crm_section_block_image {
|
||||
width: 50%;
|
||||
width: 55%;
|
||||
height: unset;
|
||||
border-radius: 16px;
|
||||
background: url("/public/img/fonctionnalite_img/img_crm.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
|
||||
|
@ -1183,7 +1225,11 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32px;
|
||||
width: 50%;
|
||||
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.mysy_crm_section_block_text_tite_desc {
|
||||
|
@ -1241,15 +1287,26 @@
|
|||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background: #FFF;
|
||||
background-color: rgb(255, 255, 255);
|
||||
max-width: 250px;
|
||||
background-color: transparent;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.mysy_crm_section_block_text_tite_desc_bton_span {
|
||||
font-style: normal;
|
||||
line-height: 24px;
|
||||
text-align: left;
|
||||
font-family: 'DM Sans';
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 122%;
|
||||
color: #4b5162;
|
||||
padding: 0 8px;
|
||||
|
||||
|
@ -1261,11 +1318,13 @@
|
|||
flex-direction: row;
|
||||
gap: 20px;
|
||||
background: #FFFFFF;
|
||||
width: 90%;
|
||||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 10px;
|
||||
margin-bottom: 5rem;
|
||||
padding-top: 6rem;
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
|
@ -1273,7 +1332,11 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32px;
|
||||
width: 540px;
|
||||
max-width: 700px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
|
@ -1333,15 +1396,25 @@
|
|||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background: #FFF;
|
||||
background-color: rgb(255, 255, 255);
|
||||
background-color: rgb(255, 255, 255);
|
||||
background-color: rgb(255, 255, 255);
|
||||
max-width: 250px;
|
||||
background-color: transparent;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.elearningsection_text_bton_span {
|
||||
font-family: 'DM Sans';
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 122%;
|
||||
color: #4b5162;
|
||||
padding: 0 8px;
|
||||
line-height: 122%;
|
||||
}
|
||||
|
||||
.elearningsection_img {
|
||||
|
@ -1749,14 +1822,16 @@
|
|||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 10px;
|
||||
margin-bottom: 5rem;
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
.contentsection_contentcontainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 540px;
|
||||
width: 45%;
|
||||
gap: 32px;
|
||||
}
|
||||
|
||||
|
@ -1765,6 +1840,7 @@
|
|||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.contentsection_categorytitle {
|
||||
|
@ -1785,12 +1861,27 @@
|
|||
}
|
||||
|
||||
.contentsection_description {
|
||||
/* Commons/Body/Body - L */
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: #4b5162;
|
||||
/* or 150% */
|
||||
|
||||
/* Foundation /Blue-Grey/Normal */
|
||||
color: #4B5162;
|
||||
|
||||
opacity: 0.8;
|
||||
white-space: 'pre-line';
|
||||
|
||||
/* Inside auto layout */
|
||||
flex: none;
|
||||
order: 1;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
text-align: left;
|
||||
margin-bottom: 0px;
|
||||
|
||||
}
|
||||
|
||||
.contentsection_button {
|
||||
|
@ -1805,6 +1896,7 @@
|
|||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background: #FFF;
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
.contentsection_buttonText {
|
||||
|
@ -1816,17 +1908,18 @@
|
|||
}
|
||||
|
||||
.contentsection_image {
|
||||
width: 100%;
|
||||
height: unset;
|
||||
width: 90%;
|
||||
border-radius: 16px;
|
||||
object-fit: cover;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.contentsection_contentcontainer_img {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 50%;
|
||||
width: 55%;
|
||||
gap: 32px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
|
@ -1835,20 +1928,21 @@
|
|||
flex-direction: row;
|
||||
gap: 20px;
|
||||
background: #FFFFFF;
|
||||
width: 90%;
|
||||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 10px;
|
||||
margin-bottom: 5rem;
|
||||
padding-top: 6rem;
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.mysy_crm_section_block_image {
|
||||
width: 50%;
|
||||
width: 55%;
|
||||
height: unset;
|
||||
border-radius: 16px;
|
||||
background: url("/public/img/fonctionnalite_img/img_crm.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
|
||||
|
@ -1858,7 +1952,11 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32px;
|
||||
width: 540px;
|
||||
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.mysy_crm_section_block_text_tite_desc {
|
||||
|
@ -1916,15 +2014,26 @@
|
|||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background: #FFF;
|
||||
background-color: rgb(255, 255, 255);
|
||||
max-width: 250px;
|
||||
background-color: transparent;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.mysy_crm_section_block_text_tite_desc_bton_span {
|
||||
font-style: normal;
|
||||
line-height: 24px;
|
||||
text-align: left;
|
||||
font-family: 'DM Sans';
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 122%;
|
||||
font-weight: 700;
|
||||
color: #4b5162;
|
||||
padding: 0 8px;
|
||||
|
||||
|
@ -1936,11 +2045,14 @@
|
|||
flex-direction: row;
|
||||
gap: 20px;
|
||||
background: #FFFFFF;
|
||||
width: 90%;
|
||||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 10px;
|
||||
margin-bottom: 5rem;
|
||||
padding-top: 6rem;
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
@ -1949,7 +2061,11 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32px;
|
||||
width: 540px;
|
||||
max-width: 700px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
|
@ -2009,15 +2125,25 @@
|
|||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background: #FFF;
|
||||
background-color: rgb(255, 255, 255);
|
||||
background-color: rgb(255, 255, 255);
|
||||
background-color: rgb(255, 255, 255);
|
||||
max-width: 250px;
|
||||
background-color: transparent;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.elearningsection_text_bton_span {
|
||||
font-family: 'DM Sans';
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 122%;
|
||||
font-weight: 700;
|
||||
color: #4b5162;
|
||||
padding: 0 8px;
|
||||
line-height: 122%;
|
||||
}
|
||||
|
||||
.elearningsection_img {
|
||||
|
@ -2036,7 +2162,7 @@
|
|||
height: 420px;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
|
||||
|
||||
background: #C4C8EE;
|
||||
background: #f3f4fb;
|
||||
|
||||
|
@ -2281,7 +2407,7 @@
|
|||
|
||||
.block_badge {
|
||||
display: flex;
|
||||
padding: 80px;
|
||||
|
||||
gap: 80px;
|
||||
background: rgb(255, 255, 255);
|
||||
width: 80%;
|
||||
|
@ -2325,10 +2451,12 @@
|
|||
.featureslayout_block1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
padding: 80px;
|
||||
width: 80%;
|
||||
background: #FFFFFF;
|
||||
margin-bottom: 5rem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 80px;
|
||||
}
|
||||
|
||||
.featureslayout_block2 {
|
||||
|
@ -2422,23 +2550,24 @@
|
|||
|
||||
|
||||
.contentsection_section {
|
||||
padding: 80px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 80px;
|
||||
gap: 20px;
|
||||
background: #FFFFFF;
|
||||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 10px;
|
||||
margin-bottom: 5rem;
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
.contentsection_contentcontainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 50%;
|
||||
width: 45%;
|
||||
gap: 32px;
|
||||
}
|
||||
|
||||
|
@ -2447,6 +2576,7 @@
|
|||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.contentsection_categorytitle {
|
||||
|
@ -2467,12 +2597,27 @@
|
|||
}
|
||||
|
||||
.contentsection_description {
|
||||
/* Commons/Body/Body - L */
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: #4b5162;
|
||||
/* or 150% */
|
||||
|
||||
/* Foundation /Blue-Grey/Normal */
|
||||
color: #4B5162;
|
||||
|
||||
opacity: 0.8;
|
||||
white-space: 'pre-line';
|
||||
|
||||
/* Inside auto layout */
|
||||
flex: none;
|
||||
order: 1;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
text-align: left;
|
||||
margin-bottom: 0px;
|
||||
|
||||
}
|
||||
|
||||
.contentsection_button {
|
||||
|
@ -2487,6 +2632,13 @@
|
|||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background: #FFF;
|
||||
max-width: 250px;
|
||||
background-color: transparent;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.contentsection_buttonText {
|
||||
|
@ -2498,39 +2650,40 @@
|
|||
}
|
||||
|
||||
.contentsection_image {
|
||||
width: 540px;
|
||||
height: unset;
|
||||
width: 90%;
|
||||
border-radius: 16px;
|
||||
object-fit: cover;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.contentsection_contentcontainer_img {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 50%;
|
||||
width: 55%;
|
||||
gap: 32px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
.mysy_crm_section_block1 {
|
||||
padding: 80px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 80px;
|
||||
gap: 20px;
|
||||
background: #FFFFFF;
|
||||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 10px;
|
||||
margin-bottom: 5rem;
|
||||
padding-top: 6rem;
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
.mysy_crm_section_block_image {
|
||||
width: 692px;
|
||||
height: 692px;
|
||||
width: 55%;
|
||||
height: unset;
|
||||
border-radius: 16px;
|
||||
background: url("/public/img/fonctionnalite_img/img_crm.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
|
||||
|
@ -2540,7 +2693,11 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32px;
|
||||
width: 540px;
|
||||
max-width: 700px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.mysy_crm_section_block_text_tite_desc {
|
||||
|
@ -2584,6 +2741,27 @@
|
|||
line-height: 24px;
|
||||
color: #4b5162;
|
||||
opacity: 0.8;
|
||||
/* Commons/Body/Body - L */
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
/* or 150% */
|
||||
|
||||
/* Foundation /Blue-Grey/Normal */
|
||||
color: #4B5162;
|
||||
|
||||
opacity: 0.8;
|
||||
|
||||
/* Inside auto layout */
|
||||
flex: none;
|
||||
order: 1;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
text-align: left;
|
||||
margin-bottom: 0px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
@ -2598,30 +2776,42 @@
|
|||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background: #FFF;
|
||||
background-color: rgb(255, 255, 255);
|
||||
max-width: 250px;
|
||||
background-color: transparent;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.mysy_crm_section_block_text_tite_desc_bton_span {
|
||||
font-style: normal;
|
||||
line-height: 24px;
|
||||
text-align: left;
|
||||
font-family: 'DM Sans';
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 122%;
|
||||
font-weight: 700;
|
||||
color: #4b5162;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.elearningsection_block1 {
|
||||
padding: 80px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 80px;
|
||||
gap: 20px;
|
||||
background: #FFFFFF;
|
||||
width: 80%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-top: 10px;
|
||||
margin-bottom: 5rem;
|
||||
padding-top: 6rem;
|
||||
margin-bottom: 1rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
|
@ -2629,7 +2819,11 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32px;
|
||||
width: 540px;
|
||||
max-width: 700px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
|
@ -2689,22 +2883,32 @@
|
|||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background: #FFF;
|
||||
background-color: rgb(255, 255, 255);
|
||||
background-color: rgb(255, 255, 255);
|
||||
background-color: rgb(255, 255, 255);
|
||||
max-width: 250px;
|
||||
background-color: transparent;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.elearningsection_text_bton_span {
|
||||
font-family: 'DM Sans';
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 122%;
|
||||
font-weight: 700;
|
||||
color: #4b5162;
|
||||
padding: 0 8px;
|
||||
line-height: 122%;
|
||||
}
|
||||
|
||||
.elearningsection_img {
|
||||
width: 692px;
|
||||
height: 692px;
|
||||
height: unset;
|
||||
border-radius: 16px;
|
||||
background: url("/public/img/fonctionnalite_img/img_lms.png");
|
||||
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
|
|
@ -1,8 +1,9 @@
|
|||
import React, { useRef, useState, useEffect } from "react";
|
||||
import moment from "moment";
|
||||
import { Helmet } from "react-helmet";
|
||||
import "./new_fonctionalites_2025.css";
|
||||
|
||||
|
||||
|
||||
import FeaturesLayout from './FeaturesLayout.js';
|
||||
import ContentSection from './ContentSection';
|
||||
import Badge_Fonctionnalite from './Badge_Fonctionnalite';
|
||||
|
@ -26,7 +27,7 @@ const New_C_Fonctionalites_2025 = (props) => {
|
|||
const gestion_admin_fonctionalite = [
|
||||
{
|
||||
'title': 'Catalogue formations personnalisé', 'detail_1': 'Catalogue formations', 'detail_2': 'Nom domaine personnalisé',
|
||||
'detail_3': 'Modèle siteweb personnalisé', 'img': 'img/fonctionnalite_img/img_catalog.png'
|
||||
'detail_3': 'Modèle siteweb personnalisé', 'img': '/img/fonctionnalite_img/img_catalog.png'
|
||||
},
|
||||
|
||||
{
|
||||
|
@ -42,55 +43,55 @@ const New_C_Fonctionalites_2025 = (props) => {
|
|||
|
||||
{
|
||||
'title': 'Check-list QUALIOPI', 'detail_1': 'Traitement automatisé', 'detail_2': 'Affichage du reste à faire',
|
||||
'detail_3': 'Affichage ce qui a été fait', 'img': 'img/fonctionnalite_img/img_qualiopi_checklist.png'
|
||||
'detail_3': 'Affichage ce qui a été fait', 'img': '/img/fonctionnalite_img/img_qualiopi_checklist.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Gestion avis participants', 'detail_1': 'Avis sur la formation', 'detail_2': 'Avis sur le formateur',
|
||||
'detail_3': 'Génération automatique des statistiques de satisfaction', 'img': 'img/fonctionnalite_img/img_catalog.png'
|
||||
'detail_3': 'Génération automatique des statistiques de satisfaction', 'img': '/img/fonctionnalite_img/img_catalog.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Gestion Evaluation', 'detail_1': 'Evaluation à chaud', 'detail_2': 'Evaluation à froid',
|
||||
'detail_3': 'Evaluation formateur', 'img': 'img/fonctionnalite_img/img_evaluation.png'
|
||||
'detail_3': 'Evaluation formateur', 'img': '/img/fonctionnalite_img/img_evaluation.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Gestion documents (GED)', 'detail_1': 'Documents clients', 'detail_2': 'Documents apprenants',
|
||||
'detail_3': 'Documents formateur', 'img': 'img/fonctionnalite_img/img_storage.png'
|
||||
'detail_3': 'Documents formateur', 'img': '/img/fonctionnalite_img/img_storage.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Personnalisation des documents', 'detail_1': 'Personnalisation de tous les documents', 'detail_2': 'Sauvegarde et restauration',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_personnalisation.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_personnalisation.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Gestion des Sessions de formation', 'detail_1': 'Session inter/intra', 'detail_2': 'Personnalisation des étapes',
|
||||
'detail_3': 'Affectation devis/ressources', 'img': 'img/fonctionnalite_img/img_session_formation.png'
|
||||
'detail_3': 'Affectation devis/ressources', 'img': '/img/fonctionnalite_img/img_session_formation.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Gestion des ressources', 'detail_1': 'Salle de classe', 'detail_2': 'Formateur & personnel administratif',
|
||||
'detail_3': 'Matériel pédagogique', 'img': 'img/fonctionnalite_img/img_ressources.png'
|
||||
'detail_3': 'Matériel pédagogique', 'img': '/img/fonctionnalite_img/img_ressources.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Gestion formateurs', 'detail_1': 'Contrat formateurs', 'detail_2': 'Edition et stockage des contrats',
|
||||
'detail_3': 'Evaluation', 'img': 'img/fonctionnalite_img/img_formateur.png'
|
||||
'detail_3': 'Evaluation', 'img': '/img/fonctionnalite_img/img_formateur.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Tableau de bord & BPF', 'detail_1': 'Suivi d’activité', 'detail_2': 'BPF',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_tableau_bord.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_tableau_bord.png'
|
||||
},
|
||||
|
||||
]
|
||||
|
@ -98,43 +99,43 @@ const New_C_Fonctionalites_2025 = (props) => {
|
|||
const crm_fonctionalite = [
|
||||
{
|
||||
'title': 'Signature électronique', 'detail_1': 'Un module intégrée', 'detail_2': 'Permet de signer vos documents',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_signat_electro.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_signat_electro.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'Gestion des collaborateurs', 'detail_1': 'Affectation tâches', 'detail_2': 'Suivi avancement',
|
||||
'detail_3': 'Notification par email', 'img': 'img/fonctionnalite_img/img_collaborateur.png'
|
||||
'detail_3': 'Notification par email', 'img': '/img/fonctionnalite_img/img_collaborateur.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Les Devis', 'detail_1': 'Envoi par email', 'detail_2': 'Validation automatique client',
|
||||
'detail_3': 'Relance automatique', 'img': 'img/fonctionnalite_img/img_devis.png'
|
||||
'detail_3': 'Relance automatique', 'img': '/img/fonctionnalite_img/img_devis.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'Gestion Clients, Financeurs', 'detail_1': 'Contacts', 'detail_2': 'Stockage documents',
|
||||
'detail_3': 'Import / Export Excel', 'img': 'img/fonctionnalite_img/img_client_financeur.png'
|
||||
'detail_3': 'Import / Export Excel', 'img': '/img/fonctionnalite_img/img_client_financeur.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'Paiements', 'detail_1': 'Multi paiement', 'detail_2': 'Suivi du reste à payer',
|
||||
'detail_3': 'Import / Export Excel', 'img': 'img/fonctionnalite_img/img_paiement.png'
|
||||
'detail_3': 'Import / Export Excel', 'img': '/img/fonctionnalite_img/img_paiement.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'opportunités d’affaire', 'detail_1': 'Personnalisation des étapes', 'detail_2': 'Notification équipe',
|
||||
'detail_3': 'Conversion en devis', 'img': 'img/fonctionnalite_img/img_opportunite.png'
|
||||
'detail_3': 'Conversion en devis', 'img': '/img/fonctionnalite_img/img_opportunite.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'Facturation & avoirs', 'detail_1': 'Envoi par email au client', 'detail_2': 'Fractionnement des factures',
|
||||
'detail_3': 'Transformation en avoir et Annotation', 'img': 'img/fonctionnalite_img/img_facture_avoir.png'
|
||||
'detail_3': 'Transformation en avoir et Annotation', 'img': '/img/fonctionnalite_img/img_facture_avoir.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'Tableau de bord', 'detail_1': 'Suivi clients', 'detail_2': 'Suivi facturation',
|
||||
'detail_3': 'Factures prévisionnelles', 'img': 'img/fonctionnalite_img/img_tableau_bord.png'
|
||||
'detail_3': 'Factures prévisionnelles', 'img': '/img/fonctionnalite_img/img_tableau_bord.png'
|
||||
},
|
||||
|
||||
|
||||
|
@ -143,44 +144,44 @@ const New_C_Fonctionalites_2025 = (props) => {
|
|||
const lms_fonctionalite = [
|
||||
{
|
||||
'title': 'Classe virtuelle', 'detail_1': '', 'detail_2': '',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_class_virtuelle.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_class_virtuelle.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'Cours – TD – TP - Examen', 'detail_1': '', 'detail_2': '',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_cours_td_tp.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_cours_td_tp.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Intranet Apprenant & Enseignant', 'detail_1': '', 'detail_2': '',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_intranet_apprenant.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_intranet_apprenant.png'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
'title': 'Suivi temps de connexion apprenants', 'detail_1': '', 'detail_2': '',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_suivi_tps_connexion.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_suivi_tps_connexion.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'Echange Enseignant / Apprenant', 'detail_1': '', 'detail_2': '',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_echange_prof_apprenant.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_echange_prof_apprenant.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'Export / Import format SCORM', 'detail_1': '', 'detail_2': '',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_export_scorm.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_export_scorm.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'Partage de fichiers', 'detail_1': '', 'detail_2': '',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_partage_fichiers.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_partage_fichiers.png'
|
||||
},
|
||||
|
||||
{
|
||||
'title': 'Tableau de bord / Statistiques', 'detail_1': '', 'detail_2': '',
|
||||
'detail_3': '', 'img': 'img/fonctionnalite_img/img_tableau_bord.png'
|
||||
'detail_3': '', 'img': '/img/fonctionnalite_img/img_tableau_bord.png'
|
||||
},
|
||||
|
||||
|
||||
|
@ -190,6 +191,16 @@ const New_C_Fonctionalites_2025 = (props) => {
|
|||
return (
|
||||
|
||||
<div className="new_fonctionalites_2025">
|
||||
|
||||
<Helmet>
|
||||
<title>Logiciel de gestion pour Organisme de formation : Gestion Administrative, CRM, LMS, Marketplace, découvrez les Fonctionnalités et Modules du logiciel de gestion des organismes de formation</title>
|
||||
<meta name="description" content="Avec notre logiciel Tout-en-Un, Nous automatisons les étapes Qualiopi (Inscription, Documents personnalisés, Les émargements sécurisés, Les évaluations, etc). Votre Le bilan pédagogique et financier est généré automatiquement." />
|
||||
<meta name="robots" content="index,follow" />
|
||||
<meta name="title" content="Gestion Administrative, CRM, LMS, Marketplace, découvrez les Fonctionnalités et Modules du logiciel de gestion des organismes de formation" />
|
||||
<link rel="canonical" href={window.location.href} />
|
||||
|
||||
</Helmet>
|
||||
|
||||
<div className="fonctionnalite_Background">
|
||||
|
||||
<div className="title_and_cat">
|
||||
|
@ -222,7 +233,7 @@ const New_C_Fonctionalites_2025 = (props) => {
|
|||
<div className="title_and_cat_title_cat_bton_tarif" onClick={(e) => {
|
||||
|
||||
window.open(
|
||||
"/new_tarif/",
|
||||
"/tarif/",
|
||||
'_self'
|
||||
);
|
||||
}}>
|
||||
|
|
|
@ -34,7 +34,7 @@ const CallToActionSection = ({ title, demoButtonText, contactText }) => {
|
|||
</button>
|
||||
<div className="cta-contact-link" onClick={(e) => {
|
||||
e.preventDefault();
|
||||
window.open("/new_contact/#debut", "_self");
|
||||
window.open("/contact/#debut", "_self");
|
||||
}}>
|
||||
<span>{contactText}</span>
|
||||
</div>
|
||||
|
|
|
@ -42,7 +42,7 @@ const FooterSection = ({ logoSrc, address, email, phone }) => {
|
|||
<a href="#">Fonctionnaltiés</a>
|
||||
<nav onClick={(e) => {
|
||||
e.preventDefault();
|
||||
window.open("/new_tarif/#debut", "_self");
|
||||
window.open("/tarif/#debut", "_self");
|
||||
}}
|
||||
style={{ cursor: 'pointer', opacity: '0.8' }}>Tarifs</nav>
|
||||
|
||||
|
@ -50,7 +50,7 @@ const FooterSection = ({ logoSrc, address, email, phone }) => {
|
|||
|
||||
<nav onClick={(e) => {
|
||||
e.preventDefault();
|
||||
window.open("/new_contact/#debut", "_self");
|
||||
window.open("/contact/#debut", "_self");
|
||||
}}
|
||||
style={{ cursor: 'pointer', opacity: '0.8' }}> Nous contacter</nav>
|
||||
</div>
|
||||
|
|
|
@ -77,9 +77,9 @@
|
|||
}
|
||||
|
||||
.testimonial-text {
|
||||
font-family: 'Inter', sans-serif;
|
||||
font-family: Inter;
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
font-size: 16px;
|
||||
line-height: 160%;
|
||||
color: #171717;
|
||||
margin: 0;
|
||||
|
@ -234,9 +234,9 @@
|
|||
}
|
||||
|
||||
.testimonial-text {
|
||||
font-family: 'Inter', sans-serif;
|
||||
font-family: Inter;
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
font-size: 16px;
|
||||
line-height: 160%;
|
||||
color: #171717;
|
||||
margin: 0;
|
||||
|
@ -391,9 +391,9 @@
|
|||
}
|
||||
|
||||
.testimonial-text {
|
||||
font-family: 'Inter', sans-serif;
|
||||
font-family: Inter;
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
font-size: 16px;
|
||||
line-height: 160%;
|
||||
color: #171717;
|
||||
margin: 0;
|
||||
|
@ -548,9 +548,9 @@
|
|||
}
|
||||
|
||||
.testimonial-text {
|
||||
font-family: 'Inter', sans-serif;
|
||||
font-family: Inter;
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
font-size: 16px;
|
||||
line-height: 160%;
|
||||
color: #171717;
|
||||
margin: 0;
|
||||
|
|
|
@ -4,26 +4,42 @@ import './TestimonialSection.css';
|
|||
const TestimonialSection = ({ testimonials = [
|
||||
{
|
||||
id: 1,
|
||||
text: '"MySy Training a révolutionné notre manière de gérer les formations. Un gain de temps précieux !"',
|
||||
text: '"ELYOS a transformé notre façon de travailler ! La connexion du CRM avec la gestion administrative permet qu’après signature électronique de nos conventions et devis que les sessions de formation se créent automatiquement, éliminant ainsi les tâches manuelles fastidieuses..."',
|
||||
author: 'Marie D.',
|
||||
role: 'Responsable Formation',
|
||||
avatar: 'https://dashboard.codeparrot.ai/api/image/Z5NbKPA8XwfbJQBF/image.png',
|
||||
avatar: '/img/testimony_img1.jfif',
|
||||
rating: 5
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
text: '"Une interface intuitive et un support client réactif. Je recommande vivement."',
|
||||
text: '"Avec l\'AUTOMATISATION La checklist Qualiopi, Je ne me prends plus la tête à savoir où j\'en suis, le reste à faire etc... Je me concentre désormais sur mes clients et mes apprenants..."',
|
||||
author: 'Marie D.',
|
||||
role: 'Responsable Formation',
|
||||
avatar: 'https://dashboard.codeparrot.ai/api/image/Z5NbKPA8XwfbJQBF/image-2.png',
|
||||
avatar: '/img/testimony_img1.jfif',
|
||||
rating: 4.5
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
text: '"MySy Training a révolutionné notre manière de gérer les formations. Un gain de temps précieux !"',
|
||||
text: '"Avec le changement d\'outils on appréhendait un peu, mais ils ont été là pendant toute la phase de demarrage. On pouvait les appeler à tout moment. Ca change :) :) Merci Elyos"',
|
||||
author: 'Marie D.',
|
||||
role: 'Responsable Formation',
|
||||
avatar: 'https://dashboard.codeparrot.ai/api/image/Z5NbKPA8XwfbJQBF/image-3.png',
|
||||
avatar: '/img/testimony_img1.jfif',
|
||||
rating: 4.5
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
text: '"C\’est un outil facilitant, aidant pour le quotidien d\'un organisme de formation. les équipes sont à l\'écoute pour les évolutions."',
|
||||
author: 'Marie D.',
|
||||
role: 'Responsable Formation',
|
||||
avatar: '/img/testimony_img2.jfif',
|
||||
rating: 5
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
text: '"L\'équipe m\'a accompagner dans la prise en main de l\'outil et franchement ça change. J\'avais un contact dédié que je pouvais appeler à tout moment les premiers mois. Vraiment Top !!!"',
|
||||
author: 'Marie D.',
|
||||
role: 'Responsable Formation',
|
||||
avatar: '/img/testimony_img2.jfif',
|
||||
rating: 5
|
||||
}
|
||||
]}) => {
|
||||
|
@ -33,7 +49,7 @@ const TestimonialSection = ({ testimonials = [
|
|||
stars.push(
|
||||
<img
|
||||
key={i}
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z5NbKPA8XwfbJQBF/star.png"
|
||||
src="/img/testimony_star.png"
|
||||
alt="star"
|
||||
className="star-icon"
|
||||
/>
|
||||
|
@ -75,13 +91,13 @@ const TestimonialSection = ({ testimonials = [
|
|||
|
||||
<div className="slider-controls">
|
||||
<button className="arrow-button">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5NbKPA8XwfbJQBF/arrow-le.png" alt="Previous" />
|
||||
<img src="/img/testimony_arrow1.png" alt="Previous" />
|
||||
</button>
|
||||
<div className="slider-bullets">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5NbKPA8XwfbJQBF/bullets.png" alt="Slider position" />
|
||||
<img src="/img/testimony_bullet.png" alt="Slider position" />
|
||||
</div>
|
||||
<button className="arrow-button">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5NbKPA8XwfbJQBF/arrow-ri.png" alt="Next" />
|
||||
<img src="/img/testimony_arrow2.png" alt="Next" />
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -95,7 +95,7 @@ const Header = () => {
|
|||
|
||||
const handleAccountCreation = () => {
|
||||
setAccountMenu(null);
|
||||
history.push("/new_signup/")
|
||||
history.push("/signup/")
|
||||
};
|
||||
|
||||
|
||||
|
@ -106,7 +106,7 @@ const Header = () => {
|
|||
|
||||
const handleAccountConnexion = () => {
|
||||
setAccountMenu(null);
|
||||
history.push("/new_signin/")
|
||||
history.push("/signin/")
|
||||
};
|
||||
|
||||
|
||||
|
@ -266,12 +266,12 @@ const Header = () => {
|
|||
}} />
|
||||
|
||||
<nav className="menu-list">
|
||||
<a href="/" className="menu-link">À propos</a>
|
||||
<a href="/new_fonctionnalite" className="menu-link">Fonctionnalités</a>
|
||||
<a href="/apropos" className="menu-link">À propos</a>
|
||||
<a href="/fonctionnalites" className="menu-link">Fonctionnalités</a>
|
||||
<a href="#" className="menu-link">
|
||||
<nav onClick={(e) => {
|
||||
history.push("/new_tarif/#debut");
|
||||
// window.open("/new_tarif/#debut", "_self");
|
||||
history.push("/tarif/#debut");
|
||||
// window.open("/tarif/#debut", "_self");
|
||||
}}>Tarifs </nav>
|
||||
</a>
|
||||
<a href="/Recherche-Article-formation" className="menu-link">Blog</a>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import React from 'react';
|
||||
import "./new_homepage.css";
|
||||
|
||||
|
||||
const Card_Title = ({
|
||||
subtitle = "POURQUOI NOUS CHOISIR ?",
|
||||
title = "Un besoin, une solution personnalisée"
|
||||
|
|
|
@ -0,0 +1,35 @@
|
|||
import React from 'react';
|
||||
import CommentMarche_Card_Title from './CommentMarche_Card_Title';
|
||||
import CommentMarche_ListCard from './CommentMarche_ListCard';
|
||||
import ButtonText from './ButtonText';
|
||||
|
||||
const CommentMarche = () => {
|
||||
return (
|
||||
<div className='CommentMarche_block1' >
|
||||
<div style={{ flexGrow: 1 }}>
|
||||
<CommentMarche_Card_Title />
|
||||
</div>
|
||||
<div className='CommentMarche_block2'>
|
||||
<CommentMarche_ListCard imageUrl="/img/home_page_marge_img1.png" title="Configuration de votre espace" buttonText="Découvrir" description="Nous vous accompagnons dans la création et paramétrage de votre espace" type="1" />
|
||||
<CommentMarche_ListCard imageUrl="/img/home_page_marge_img_tiret_horiz.png" title="" buttonText="" description="" type="0" />
|
||||
<CommentMarche_ListCard imageUrl="/img/home_page_marge_img2.png" title="Gestion de vos formations" buttonText="Découvrir" description="Organisez vos formations, suivez les progrès de vos apprenants, et automatisez vos tâches administratives" type="1" />
|
||||
<CommentMarche_ListCard imageUrl="/img/home_page_marge_img_tiret_horiz.png" title="" buttonText="" description="" type="0" />
|
||||
<CommentMarche_ListCard imageUrl="/img/home_page_marge_img3.png" title="Développez vos activités" buttonText="Découvrir" description="Exploitez les données et fonctionnalités avancées pour améliorer vos offres" type="1" />
|
||||
|
||||
</div>
|
||||
<div style={{ flexGrow: 1, display: 'flex', justifyContent: 'center' }}
|
||||
onClick={() => {
|
||||
window.open(
|
||||
"/fonctionnalites/",
|
||||
'_self'
|
||||
);
|
||||
}}
|
||||
>
|
||||
<ButtonText text="Découvrir nos fonctionnalités" />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default CommentMarche;
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
import React from 'react';
|
||||
import "./new_homepage.css";
|
||||
|
||||
const CommentMarche_Card_Title = ({
|
||||
subtitle = "Comment ça marche ?",
|
||||
title = "De la complexité à la simplicité"
|
||||
}) => {
|
||||
return (
|
||||
<div className='new_homepage_2025'>
|
||||
<div className='CommentMarche_Card_Title_block1'>
|
||||
<div className='CommentMarche_Card_Title_block2'>
|
||||
{subtitle}
|
||||
</div>
|
||||
<div className='CommentMarche_Card_Title_block3'>
|
||||
{title}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default CommentMarche_Card_Title;
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
import React from 'react';
|
||||
|
||||
const CommentMarche_ListCard = ({ imageUrl, title, buttonText, description, type }) => {
|
||||
|
||||
|
||||
const buttonStyle = {
|
||||
padding: '12px 20px',
|
||||
borderRadius: '200px',
|
||||
border: '1px solid #c7c9ce',
|
||||
backgroundColor: 'transparent',
|
||||
color: '#4b5162',
|
||||
fontFamily: 'DM Sans, sans-serif',
|
||||
fontSize: '16px',
|
||||
fontWeight: 700,
|
||||
lineHeight: '122%',
|
||||
cursor: 'pointer',
|
||||
transition: 'all 0.2s ease-in-out',
|
||||
};
|
||||
|
||||
const buttonHoverStyle = {
|
||||
backgroundColor: '#f5f5f5',
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
{type === "1" && <div className='CommentMarche_ListCard_cardStyle'>
|
||||
<div className='CommentMarche_ListCard_imageContainerStyle'>
|
||||
<img src={imageUrl} alt={title} className='CommentMarche_ListCard_imageStyle' />
|
||||
</div>
|
||||
<div className='CommentMarche_ListCard_contentStyle'>
|
||||
<h3 className='CommentMarche_ListCard_titleStyle'>{title}</h3>
|
||||
<div style={{ display: 'flex', justifyContent: 'center' }} className='CommentMarche_ListCard_description'>
|
||||
{description}
|
||||
</div>
|
||||
</div>
|
||||
</div>}
|
||||
|
||||
{type === "0" && <div className='CommentMarche_ListCard_cardStyle' style={{maxWidth:'200px', alignItems:'center', justifyContent:'center', marginLeft:'auto', marginRight:'auto'}}>
|
||||
<div className='CommentMarche_ListCard_imageContainerStyle'>
|
||||
<img src={imageUrl} alt={title} className='CommentMarche_ListCard_imageStyle' />
|
||||
</div>
|
||||
<div className='CommentMarche_ListCard_contentStyle'>
|
||||
<h3 className='CommentMarche_ListCard_titleStyle'>{title}</h3>
|
||||
<div style={{ display: 'flex', justifyContent: 'center' }} className='CommentMarche_ListCard_description'>
|
||||
{description}
|
||||
</div>
|
||||
</div>
|
||||
</div>}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
CommentMarche_ListCard.defaultProps = {
|
||||
imageUrl: 'https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/france-1.png',
|
||||
title: 'Editeur Français',
|
||||
description: 'Découvrir',
|
||||
buttonText: 'Découvrir',
|
||||
type: "1"
|
||||
|
||||
};
|
||||
|
||||
export default CommentMarche_ListCard;
|
||||
|
|
@ -3,24 +3,28 @@ import "./new_homepage.css";
|
|||
const Features = () => {
|
||||
const values = [
|
||||
{
|
||||
icon: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons.png",
|
||||
title: "Innovation",
|
||||
description: "Nous anticipons vos besoins pour vous offrir des solutions adaptées."
|
||||
icon: "/img/home_page_marge_img_gestion.png",
|
||||
title: "Gestion",
|
||||
description: "Planifiez, suivez et évaluez vos sessions de manière intuitive.",
|
||||
border_color : "1px solid #ECAE49",
|
||||
},
|
||||
{
|
||||
icon: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons-2.png",
|
||||
title: "Proximité",
|
||||
description: "Un accompagnement humain et personnalisé pour chaque client."
|
||||
icon: "/img/home_page_marge_img_suivi.png",
|
||||
title: "Suivi",
|
||||
description: "Accédez à des rapports détaillés sur les performances et progrès",
|
||||
border_color : "1px solid #3E6EE3",
|
||||
},
|
||||
{
|
||||
icon: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons-3.png",
|
||||
title: "Excellence",
|
||||
description: "Des solutions fiables qui font leurs preuves au quotidien."
|
||||
icon: "/img/home_page_marge_img_automatisation.png",
|
||||
title: "Automatisation",
|
||||
description: "Réduisez le temps consacré aux tâches répétitives",
|
||||
border_color : "1px solid #0AA690",
|
||||
},
|
||||
{
|
||||
icon: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons-4.png",
|
||||
title: "Transparence",
|
||||
description: "Nous construisons des relations basées sur la confiance."
|
||||
icon: "/img/home_page_marge_img_personalisation.png",
|
||||
title: "Personnalisation",
|
||||
description: "Adaptez les contenus et certifications aux besoins spécifiques",
|
||||
border_color : "1px solid #1A1C22",
|
||||
}
|
||||
];
|
||||
|
||||
|
@ -29,13 +33,13 @@ const Features = () => {
|
|||
<div className="Features_container">
|
||||
|
||||
<div className="Features_titleContainer">
|
||||
<span className="Features_subtitle">NOS VALEURS</span>
|
||||
<h2 className="Features_title">Des valeurs qui nous guident.</h2>
|
||||
<span className="Features_subtitle">FONCTIONNALITÉS</span>
|
||||
<h2 className="Features_title">Des outils puissants pour une gestion efficace</h2>
|
||||
</div>
|
||||
|
||||
<div className="Features_cardContainer">
|
||||
{values.map((value, index) => (
|
||||
<div key={index} className="Features_card">
|
||||
<div key={index} className="Features_card" style={{border:`${value.border_color}`}}>
|
||||
<div className="Features_iconWrapper">
|
||||
<img src={value.icon} alt="" className="Features_icon" />
|
||||
</div>
|
||||
|
@ -47,8 +51,15 @@ const Features = () => {
|
|||
))}
|
||||
</div>
|
||||
|
||||
<button className="Features_button">
|
||||
Découvrir notre solution
|
||||
<button className="Features_button"
|
||||
onClick={() => {
|
||||
window.open(
|
||||
"/fonctionnalites/",
|
||||
'_self'
|
||||
);
|
||||
}}
|
||||
>
|
||||
Découvrir nos fonctionnalités
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -36,9 +36,9 @@ const FrenchSolution = ({ width = 162, height = 120 }) => {
|
|||
|
||||
return (
|
||||
<div style={containerStyle}>
|
||||
<div style={solutionsStyle}>Solutions</div>
|
||||
<div style={percentageStyle}>100%</div>
|
||||
<div style={frenchStyle}>française 🇫🇷</div>
|
||||
<div className="FrenchSolution_block_containerStyle">Solutions</div>
|
||||
<div className="FrenchSolution_block_percentageStyle">100%</div>
|
||||
<div className="FrenchSolution_block_frenchStyle">française 🇫🇷</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -70,7 +70,7 @@ const ListCard = ({ imageUrl, title, buttonText }) => {
|
|||
<div className='ListCard_contentStyle'>
|
||||
<h3 className='ListCard_titleStyle'>{title}</h3>
|
||||
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
||||
<button className='ListCard_buttonStyle'
|
||||
{/*<button className='ListCard_buttonStyle'
|
||||
onMouseEnter={(e) => {
|
||||
Object.assign(e.target.style, buttonHoverStyle);
|
||||
}}
|
||||
|
@ -79,7 +79,7 @@ const ListCard = ({ imageUrl, title, buttonText }) => {
|
|||
}}
|
||||
>
|
||||
{buttonText}
|
||||
</button>
|
||||
</button>*/}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -80,18 +80,7 @@ const LogoCloud = () => {
|
|||
|
||||
</div>
|
||||
|
||||
{/*<div className="LogoCloud_block2" >
|
||||
<img
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z6xwUmNxokPE5KT7/logos.png"
|
||||
alt="Partner Logos"
|
||||
style={{
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
objectFit: 'contain',
|
||||
filter: 'grayscale(0.6)',
|
||||
}}
|
||||
/>
|
||||
</div>*/}
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
|
@ -10,12 +10,19 @@ const WhyUsLayout = () => {
|
|||
<Card_Title />
|
||||
</div>
|
||||
<div className='WhyUsLayout_block2'>
|
||||
<ListCard imageUrl="https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/france-1.png" title="Editeur Français" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/qualiopi.png" title="Accompagnement à la certification" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/solution.png" title="Solution complète pour gérer votre OF" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/euro-1.png" title="Solution la moins chère du marché" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="/img/editeur_fr_drapeau.png" title="Editeur Français" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="/img/qualiopi.png" title="Accompagnement à la certification" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="/img/solution_complete.png" title="Solution complète pour gérer votre OF" buttonText="Découvrir" />
|
||||
<ListCard imageUrl="/img/sol_moins_chere.png" title="Solution la moins chère du marché" buttonText="Découvrir" />
|
||||
</div>
|
||||
<div style={{ flexGrow: 1, display: 'flex', justifyContent: 'center' }}>
|
||||
<div style={{ flexGrow: 1, display: 'flex', justifyContent: 'center' }}
|
||||
onClick={() => {
|
||||
window.open(
|
||||
"/fonctionnalites/",
|
||||
'_self'
|
||||
);
|
||||
}}
|
||||
>
|
||||
<ButtonText text="Découvrir nos fonctionnalités" />
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -0,0 +1,87 @@
|
|||
import React from 'react';
|
||||
|
||||
const ButtonSection = ({ style }) => {
|
||||
return (
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '20px',
|
||||
width: '100%',
|
||||
maxWidth: '287px',
|
||||
...style
|
||||
}}>
|
||||
<button
|
||||
style={{
|
||||
width: '100%',
|
||||
height: '48px',
|
||||
padding: '12px 20px',
|
||||
borderRadius: '200px',
|
||||
border: '1px solid #c7c9ce',
|
||||
background: 'transparent',
|
||||
cursor: 'pointer',
|
||||
transition: 'all 0.2s ease-in-out',
|
||||
textAlign: 'center'
|
||||
}}
|
||||
onMouseOver={(e) => {
|
||||
e.target.style.background = '#f5f5f5';
|
||||
}}
|
||||
onMouseOut={(e) => {
|
||||
e.target.style.background = 'transparent';
|
||||
}}
|
||||
>
|
||||
<div style={{
|
||||
padding: '0 8px'
|
||||
}}>
|
||||
<span style={{
|
||||
fontFamily: 'DM Sans',
|
||||
fontSize: '16px',
|
||||
fontWeight: 700,
|
||||
lineHeight: '122%',
|
||||
color: '#4b5162'
|
||||
}}>
|
||||
Découvrir nos fonctionnalités
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<a
|
||||
href="#"
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
padding: '0 0 6px 0',
|
||||
border: 'none',
|
||||
borderBottom: '1px solid #4b5162',
|
||||
color: '#4b5162',
|
||||
textDecoration: 'none',
|
||||
cursor: 'pointer',
|
||||
alignSelf: 'center',
|
||||
transition: 'all 0.2s ease-in-out'
|
||||
}}
|
||||
onMouseOver={(e) => {
|
||||
e.target.style.color = '#2d3142';
|
||||
e.target.style.borderBottom = '1px solid #2d3142';
|
||||
}}
|
||||
onMouseOut={(e) => {
|
||||
e.target.style.color = '#4b5162';
|
||||
e.target.style.borderBottom = '1px solid #4b5162';
|
||||
}}
|
||||
>
|
||||
<span style={{
|
||||
fontFamily: 'DM Sans',
|
||||
fontSize: '14px',
|
||||
fontWeight: 700,
|
||||
lineHeight: '126%'
|
||||
}}>
|
||||
Créer un compte
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
ButtonSection.defaultProps = {
|
||||
style: {}
|
||||
};
|
||||
|
||||
export default ButtonSection;
|
||||
|
|
@ -0,0 +1,287 @@
|
|||
import React from 'react';
|
||||
|
||||
const IllustrationSection = ({ style = {} }) => {
|
||||
return (
|
||||
<div style={{ ...style, padding: '20px', boxSizing: 'border-box' }}>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'space-between',
|
||||
alignItems: 'flex-start',
|
||||
width: '100%',
|
||||
maxWidth: '1136px',
|
||||
minHeight: '338px',
|
||||
margin: '0 auto',
|
||||
flexWrap: 'wrap'
|
||||
}}>
|
||||
{/* First illustration */}
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '35px',
|
||||
width: '256px',
|
||||
boxSizing: 'border-box',
|
||||
margin: '10px'
|
||||
}}>
|
||||
<div style={{
|
||||
width: '188px',
|
||||
height: '157px',
|
||||
marginLeft: '34px'
|
||||
}}>
|
||||
<img
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z7B1E49nxTWt8i5i/illustra.png"
|
||||
alt="Configuration"
|
||||
style={{ width: '100%', height: '100%' }}
|
||||
/>
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '12px',
|
||||
width: '100%'
|
||||
}}>
|
||||
<h3 style={{
|
||||
fontFamily: 'DM Sans',
|
||||
fontSize: '20px',
|
||||
fontWeight: 700,
|
||||
lineHeight: '130%',
|
||||
color: '#16274f',
|
||||
textAlign: 'center',
|
||||
margin: 0,
|
||||
padding: '0 8px'
|
||||
}}>
|
||||
Configuration<br />de votre espace
|
||||
</h3>
|
||||
<p style={{
|
||||
fontFamily: 'Inter',
|
||||
fontSize: '14px',
|
||||
fontWeight: 400,
|
||||
lineHeight: '160%',
|
||||
color: '#4b5162',
|
||||
opacity: 0.8,
|
||||
textAlign: 'center',
|
||||
margin: 0
|
||||
}}>
|
||||
Nous vous accompagnons dans la création et paramétrage de votre espace.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Divider 1 */}
|
||||
<div style={{
|
||||
width: '150px',
|
||||
height: '20px',
|
||||
borderTop: '2px solid #3e6ee3',
|
||||
margin: '105px 0'
|
||||
}} />
|
||||
|
||||
{/* Second illustration */}
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '29px',
|
||||
width: '256px',
|
||||
boxSizing: 'border-box',
|
||||
margin: '10px'
|
||||
}}>
|
||||
<div style={{
|
||||
width: '183px',
|
||||
height: '169px',
|
||||
marginLeft: '36.5px',
|
||||
position: 'relative'
|
||||
}}>
|
||||
<div style={{
|
||||
width: '170px',
|
||||
height: '128px',
|
||||
backgroundColor: '#ffffff',
|
||||
borderRadius: '6px',
|
||||
padding: '20px'
|
||||
}}>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '10px'
|
||||
}}>
|
||||
<div style={{
|
||||
fontSize: '18px',
|
||||
fontFamily: 'Chivo',
|
||||
fontWeight: 700,
|
||||
color: '#060c3c',
|
||||
lineHeight: '120%'
|
||||
}}>
|
||||
1200+
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '8px'
|
||||
}}>
|
||||
<div style={{
|
||||
width: '65px',
|
||||
height: '6px',
|
||||
backgroundColor: '#b4b6c4',
|
||||
borderRadius: '6px'
|
||||
}} />
|
||||
<div style={{
|
||||
width: '65px',
|
||||
height: '6px',
|
||||
backgroundColor: '#b4b6c4',
|
||||
borderRadius: '6px'
|
||||
}} />
|
||||
<div style={{
|
||||
width: '130px',
|
||||
height: '20px',
|
||||
backgroundColor: '#0aa690',
|
||||
borderRadius: '6px'
|
||||
}} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '12px',
|
||||
width: '100%'
|
||||
}}>
|
||||
<h3 style={{
|
||||
fontFamily: 'DM Sans',
|
||||
fontSize: '20px',
|
||||
fontWeight: 700,
|
||||
lineHeight: '130%',
|
||||
color: '#16274f',
|
||||
textAlign: 'center',
|
||||
margin: 0,
|
||||
padding: '0 8px'
|
||||
}}>
|
||||
Gestion<br />de vos formations
|
||||
</h3>
|
||||
<p style={{
|
||||
fontFamily: 'Inter',
|
||||
fontSize: '14px',
|
||||
fontWeight: 400,
|
||||
lineHeight: '160%',
|
||||
color: '#4b5162',
|
||||
opacity: 0.8,
|
||||
textAlign: 'center',
|
||||
margin: 0
|
||||
}}>
|
||||
Organisez vos formations, suivez les progrès de vos apprenants, et automatisez vos tâches administratives.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Divider 2 */}
|
||||
<div style={{
|
||||
width: '150px',
|
||||
height: '20px',
|
||||
borderTop: '2px solid #3e6ee3',
|
||||
margin: '108px 0'
|
||||
}} />
|
||||
|
||||
{/* Third illustration */}
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '35px',
|
||||
width: '256px',
|
||||
boxSizing: 'border-box',
|
||||
margin: '10px'
|
||||
}}>
|
||||
<div style={{
|
||||
width: '192px',
|
||||
height: '156px',
|
||||
marginLeft: '32px',
|
||||
position: 'relative'
|
||||
}}>
|
||||
<img
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z7B1E49nxTWt8i5i/group-33.png"
|
||||
alt="Analytics"
|
||||
style={{
|
||||
width: '170px',
|
||||
height: '128px',
|
||||
position: 'absolute',
|
||||
top: '28px',
|
||||
left: '22px'
|
||||
}}
|
||||
/>
|
||||
<img
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z7B1E49nxTWt8i5i/group-91.png"
|
||||
alt="Chart"
|
||||
style={{
|
||||
width: '72px',
|
||||
height: '58px',
|
||||
position: 'absolute',
|
||||
top: 0,
|
||||
left: 0
|
||||
}}
|
||||
/>
|
||||
<div style={{
|
||||
position: 'absolute',
|
||||
top: '34px',
|
||||
right: '8px',
|
||||
width: '70px',
|
||||
height: '38px',
|
||||
backgroundColor: '#0aa690',
|
||||
borderRadius: '4px',
|
||||
padding: '6px'
|
||||
}}>
|
||||
<div style={{
|
||||
color: '#ffffff',
|
||||
fontSize: '14px',
|
||||
fontFamily: 'Chivo',
|
||||
lineHeight: '110%'
|
||||
}}>
|
||||
40%
|
||||
</div>
|
||||
<img
|
||||
src="https://dashboard.codeparrot.ai/api/image/Z7B1E49nxTWt8i5i/group-87.png"
|
||||
alt="Icon"
|
||||
style={{
|
||||
width: '14px',
|
||||
height: '14px',
|
||||
position: 'absolute',
|
||||
top: '9px',
|
||||
right: '8px'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '12px',
|
||||
width: '100%'
|
||||
}}>
|
||||
<h3 style={{
|
||||
fontFamily: 'DM Sans',
|
||||
fontSize: '20px',
|
||||
fontWeight: 700,
|
||||
lineHeight: '130%',
|
||||
color: '#16274f',
|
||||
textAlign: 'center',
|
||||
margin: 0,
|
||||
padding: '0 66px'
|
||||
}}>
|
||||
Développez<br />vos activités
|
||||
</h3>
|
||||
<p style={{
|
||||
fontFamily: 'Inter',
|
||||
fontSize: '14px',
|
||||
fontWeight: 400,
|
||||
lineHeight: '160%',
|
||||
color: '#4b5162',
|
||||
opacity: 0.8,
|
||||
textAlign: 'center',
|
||||
margin: 0
|
||||
}}>
|
||||
Exploitez les données et fonctionnalités avancées pour améliorer vos offres.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default IllustrationSection;
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
import React from 'react';
|
||||
import TitleSection from './TitleSection';
|
||||
import IllustrationSection from './IllustrationSection';
|
||||
import ButtonSection from './ButtonSection';
|
||||
|
||||
const LayoutComponent = () => {
|
||||
return (
|
||||
<div style={{
|
||||
width: '100%',
|
||||
minHeight: '100vh',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
backgroundColor: '#f9f9fd',
|
||||
paddingTop: '80px',
|
||||
paddingBottom: '80px'
|
||||
}}>
|
||||
<TitleSection style={{ flexGrow: 1, width: '100%', maxWidth: '1440px' }} />
|
||||
<IllustrationSection style={{ flexGrow: 1, width: '100%', maxWidth: '1136px' }} />
|
||||
<ButtonSection style={{ flexGrow: 1, width: '100%', maxWidth: '287px' }} />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default LayoutComponent;
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
import React from 'react';
|
||||
|
||||
const TitleSection = ({ style }) => {
|
||||
return (
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
gap: '4px',
|
||||
padding: '20px',
|
||||
width: '100%',
|
||||
maxWidth: '1440px',
|
||||
boxSizing: 'border-box',
|
||||
...style
|
||||
}}>
|
||||
<span style={{
|
||||
fontFamily: 'DM Sans',
|
||||
fontSize: '16px',
|
||||
fontWeight: 700,
|
||||
lineHeight: '16px',
|
||||
textAlign: 'center',
|
||||
color: '#3258b6',
|
||||
textTransform: 'uppercase',
|
||||
width: '100%'
|
||||
}}>
|
||||
Comment ça marche ?
|
||||
</span>
|
||||
<h1 style={{
|
||||
fontFamily: 'DM Sans',
|
||||
fontSize: '40px',
|
||||
fontWeight: 700,
|
||||
lineHeight: '120%',
|
||||
textAlign: 'center',
|
||||
color: '#16274f',
|
||||
margin: 0,
|
||||
width: '100%'
|
||||
}}>
|
||||
De la complexité à la simplicité.
|
||||
</h1>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
TitleSection.defaultProps = {
|
||||
style: {}
|
||||
};
|
||||
|
||||
export default TitleSection;
|
||||
|
|
@ -3,8 +3,6 @@ import SolutionDescription from './SolutionDescription';
|
|||
import "./aboutussection.css";
|
||||
|
||||
|
||||
import Stat_Img from "./../img/stat_img.png"
|
||||
|
||||
const AboutUsSection = () => {
|
||||
return (
|
||||
<div className='aboutussection'>
|
||||
|
@ -15,7 +13,7 @@ const AboutUsSection = () => {
|
|||
<div className='AboutUsSection_block3'>
|
||||
|
||||
<div>
|
||||
<img src={Stat_Img} alt="Background" className='img_section' />
|
||||
<img src={"/img/home_page_marge_img_aboutus.png"} alt="Background" className='img_section' />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -2,14 +2,15 @@ import React from 'react';
|
|||
import "./aboutussection.css";
|
||||
|
||||
const SolutionDescription = ({
|
||||
title = "Votre outil tout-en-un pour la gestion de la formation",
|
||||
subtitle = "Notre solution",
|
||||
description = "Découvrez nos solutions logicielles adaptées à la gestion administrative, à la communication et au suivi des performances de votre établissement de formation.",
|
||||
buttonText = "Découvrir notre solution"
|
||||
title = "Une expertise dédiée à votre réussite",
|
||||
subtitle = "À PROPOS DE NOUS",
|
||||
description_1 = "Chez MySy Training, nous sommes passionnés par l'éducation et la technologie. Notre mission est de fournir des solutions innovantes pour faciliter la gestion des formations et améliorer l'expérience d'apprentissage.",
|
||||
description_2 = "Avec une équipe d'experts dévoués, nous accompagnons les établissements éducatifs dans leur transformation digitale.",
|
||||
buttonText = "En savoir plus"
|
||||
}) => {
|
||||
return (
|
||||
<div className='aboutussection' >
|
||||
|
||||
|
||||
<div className='SolutionDescription_block1'>
|
||||
<div className='SolutionDescription_block2'>
|
||||
<div className='SolutionDescription_block3'>
|
||||
|
@ -21,7 +22,10 @@ const SolutionDescription = ({
|
|||
</h1>
|
||||
</div>
|
||||
<p className='SolutionDescription_block3_p'>
|
||||
{description}
|
||||
{description_1}
|
||||
</p>
|
||||
<p className='SolutionDescription_block3_p'>
|
||||
{description_2}
|
||||
</p>
|
||||
</div>
|
||||
<button
|
||||
|
@ -35,7 +39,12 @@ const SolutionDescription = ({
|
|||
|
||||
|
||||
>
|
||||
<span className='SolutionDescription_block3_bton_text'>
|
||||
<span className='SolutionDescription_block3_bton_text' onClick={() => {
|
||||
window.open(
|
||||
"/fonctionnalites/",
|
||||
'_self'
|
||||
);
|
||||
}}>
|
||||
{buttonText}
|
||||
</span>
|
||||
</button>
|
||||
|
|
|
@ -69,6 +69,10 @@
|
|||
cursor: pointer;
|
||||
width: fit-content;
|
||||
transition: all 0.2s ease-in-out;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.SolutionDescription_block3_bton_text {
|
||||
|
|
|
@ -1,25 +0,0 @@
|
|||
.home_page_automatic_files {
|
||||
|
||||
@media only screen and (max-width: 600px) {}
|
||||
|
||||
@media only screen and (min-width: 601px) and (max-width: 991px) {}
|
||||
|
||||
@media only screen and (min-width: 992px) and (max-width: 1199px) {}
|
||||
|
||||
@media only screen and (min-width: 1200px) {
|
||||
|
||||
/* Background_hero */
|
||||
.background_hero {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 900px;
|
||||
left: calc(50% - 1440px/2);
|
||||
top: 0px;
|
||||
|
||||
background: #C4C8EE;
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
|
@ -3,7 +3,7 @@
|
|||
@media only screen and (max-width: 600px) {
|
||||
.fonctionnalite_Background {
|
||||
width: 100%;
|
||||
height: 650px;
|
||||
height: 900px;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
|
||||
|
@ -26,7 +26,7 @@
|
|||
gap: 30px;
|
||||
|
||||
|
||||
height: 280px;
|
||||
height: 600px;
|
||||
/* left: calc(50% - 1081px/2 + 0.5px);*/
|
||||
top: 176px;
|
||||
width: 100%;
|
||||
|
@ -46,7 +46,7 @@
|
|||
gap: 20px;
|
||||
|
||||
width: 100%;
|
||||
min-height: 420px;
|
||||
min-height: 500px;
|
||||
|
||||
|
||||
/* Inside auto layout */
|
||||
|
@ -443,17 +443,17 @@
|
|||
gap: 50px;
|
||||
left: calc(50% - 1206px/2);
|
||||
top: 0px;
|
||||
mix-blend-mode: luminosity;
|
||||
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.LogoCloud_cb2_logo {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
flex: none;
|
||||
flex-grow: 0;
|
||||
flex-grow: 0;
|
||||
order: 0;
|
||||
flex-grow: 0;
|
||||
|
||||
|
@ -759,6 +759,175 @@
|
|||
}
|
||||
|
||||
|
||||
.CommentMarche_block1 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 50px;
|
||||
|
||||
background: #F9F9FD;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_block2 {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.CommentMarche_Card_Title_block1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
min-width: 280px;
|
||||
align-items: center;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.CommentMarche_Card_Title_block2 {
|
||||
font-family: DM Sans;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
line-height: 16px;
|
||||
text-align: center;
|
||||
color: #3e6ee3;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
|
||||
.CommentMarche_Card_Title_block3 {
|
||||
font-family: DM Sans;
|
||||
font-size: 40px;
|
||||
font-weight: 700;
|
||||
line-height: 48px;
|
||||
text-align: center;
|
||||
color: #16274f;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_cardStyle {
|
||||
width: 100%;
|
||||
max-width: 350px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 40px 16px;
|
||||
gap: 24px;
|
||||
background: #ecf1fc1a;
|
||||
border-radius: 12px;
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_imageContainerStyle {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_imageStyle {
|
||||
width: 100%;
|
||||
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_contentStyle {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_titleStyle {
|
||||
font-family: DM Sans, sans-serif;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
line-height: 24px;
|
||||
color: #16274f;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.CommentMarche_ListCard_buttonStyle {
|
||||
padding: 12px 20px;
|
||||
border-radius: 200px;
|
||||
border: 1px solid #c7c9ce;
|
||||
background: transparent;
|
||||
color: #4b5162;
|
||||
font-family: DM Sans, sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
line-height: 122%;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease-in-out;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_buttonHoverStyle {
|
||||
background: #f5f5f5;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_description {
|
||||
color: #4B5162;
|
||||
font-family: Inter;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
opacity: 0.8;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.home_page_img_saas {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.FrenchSolution_block {
|
||||
position: absolute;
|
||||
top: 26rem;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_containerStyle {
|
||||
width: 162px;
|
||||
|
||||
background: #FFF;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
font-family: DM Sans, sans-serif;
|
||||
color: #16274f;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_solutionsStyle {
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_percentageStyle {
|
||||
font-size: 30px;
|
||||
font-weight: 700;
|
||||
line-height: 120%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
|
||||
.FrenchSolution_block_frenchStyle {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
line-height: 120%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
@ -787,10 +956,10 @@
|
|||
gap: 30px;
|
||||
|
||||
|
||||
height: 280px;
|
||||
height: 320px;
|
||||
/* left: calc(50% - 1081px/2 + 0.5px);*/
|
||||
top: 176px;
|
||||
width: 90%;
|
||||
width: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 3rem;
|
||||
|
@ -806,7 +975,7 @@
|
|||
padding: 0px;
|
||||
gap: 20px;
|
||||
|
||||
width: 1081px;
|
||||
|
||||
min-height: 202px;
|
||||
|
||||
|
||||
|
@ -815,7 +984,7 @@
|
|||
order: 0;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
width: 90%;
|
||||
width: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
|
@ -824,7 +993,7 @@
|
|||
.title_and_cat_title_text1 {
|
||||
/* Des fonctionnalités pensées pour simplifier la gestion de vos formations. */
|
||||
|
||||
width: 90%;
|
||||
width: 100%;
|
||||
min-height: 134px;
|
||||
|
||||
font-family: 'DM Sans';
|
||||
|
@ -869,7 +1038,7 @@
|
|||
flex: none;
|
||||
order: 1;
|
||||
flex-grow: 0;
|
||||
width: 80%;
|
||||
width: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
|
@ -1153,7 +1322,7 @@
|
|||
.LogoCloud_block1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 20px 50px;
|
||||
padding: 20px 20px;
|
||||
gap: 40px;
|
||||
background: #FFFFFF;
|
||||
width: 100%;
|
||||
|
@ -1186,7 +1355,7 @@
|
|||
order: 1;
|
||||
flex-grow: 0;
|
||||
overflow: hidden;
|
||||
width: 90%;
|
||||
width: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
|
@ -1203,8 +1372,9 @@
|
|||
height: 72px;
|
||||
left: calc(50% - 1206px/2);
|
||||
top: 0px;
|
||||
width: 100%;
|
||||
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
}
|
||||
|
||||
.LogoCloud_cb2_logo {
|
||||
|
@ -1469,7 +1639,7 @@
|
|||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.Features_cardTitle {
|
||||
|
@ -1507,12 +1677,182 @@
|
|||
}
|
||||
|
||||
.block_logo_client {
|
||||
width: 90%;
|
||||
width: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
|
||||
.CommentMarche_block1 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 50px;
|
||||
gap: 48px;
|
||||
background: #F9F9FD;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_block2 {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 0px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.CommentMarche_Card_Title_block1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
min-width: 280px;
|
||||
align-items: center;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.CommentMarche_Card_Title_block2 {
|
||||
font-family: DM Sans;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
line-height: 16px;
|
||||
text-align: center;
|
||||
color: #3e6ee3;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
|
||||
.CommentMarche_Card_Title_block3 {
|
||||
font-family: DM Sans;
|
||||
font-size: 40px;
|
||||
font-weight: 700;
|
||||
line-height: 48px;
|
||||
text-align: center;
|
||||
color: #16274f;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_cardStyle {
|
||||
width: 100%;
|
||||
max-width: 350px;
|
||||
min-height: 304px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 40px 16px;
|
||||
gap: 24px;
|
||||
background: #ecf1fc1a;
|
||||
border-radius: 12px;
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_imageContainerStyle {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_imageStyle {
|
||||
width: 100%;
|
||||
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_contentStyle {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_titleStyle {
|
||||
font-family: DM Sans, sans-serif;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
line-height: 24px;
|
||||
color: #16274f;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.CommentMarche_ListCard_buttonStyle {
|
||||
padding: 12px 20px;
|
||||
border-radius: 200px;
|
||||
border: 1px solid #c7c9ce;
|
||||
background: transparent;
|
||||
color: #4b5162;
|
||||
font-family: DM Sans, sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
line-height: 122%;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease-in-out;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_buttonHoverStyle {
|
||||
background: #f5f5f5;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_description {
|
||||
color: #4B5162;
|
||||
font-family: Inter;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
opacity: 0.8;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.home_page_img_saas {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.FrenchSolution_block {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 12rem;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_containerStyle {
|
||||
width: 162px;
|
||||
|
||||
background: #FFF;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
font-family: DM Sans, sans-serif;
|
||||
color: #16274f;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_solutionsStyle {
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_percentageStyle {
|
||||
font-size: 30px;
|
||||
font-weight: 700;
|
||||
line-height: 120%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
|
||||
.FrenchSolution_block_frenchStyle {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
line-height: 120%;
|
||||
margin: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 992px) and (max-width: 1199px) {
|
||||
|
@ -1540,7 +1880,7 @@
|
|||
gap: 30px;
|
||||
|
||||
|
||||
height: 280px;
|
||||
height: 300px;
|
||||
/* left: calc(50% - 1081px/2 + 0.5px);*/
|
||||
top: 176px;
|
||||
width: 90%;
|
||||
|
@ -1583,7 +1923,7 @@
|
|||
font-family: 'DM Sans';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 56px;
|
||||
font-size: 50px;
|
||||
line-height: 120%;
|
||||
/* or 67px */
|
||||
text-align: center;
|
||||
|
@ -1817,9 +2157,9 @@
|
|||
}
|
||||
|
||||
.ListCard_imageStyle {
|
||||
width: 88px;
|
||||
height: 88px;
|
||||
width: 100%;
|
||||
object-fit: contain;
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
.ListCard_contentStyle {
|
||||
|
@ -1909,7 +2249,7 @@
|
|||
.LogoCloud_block1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 50px 112px;
|
||||
padding: 50px 20px;
|
||||
gap: 40px;
|
||||
background: #FFFFFF;
|
||||
width: 100%;
|
||||
|
@ -1941,7 +2281,7 @@
|
|||
order: 1;
|
||||
flex-grow: 0;
|
||||
overflow: hidden;
|
||||
width: 80%;
|
||||
width: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
|
@ -1953,13 +2293,13 @@
|
|||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 0px;
|
||||
gap: 56px;
|
||||
width: 1206px;
|
||||
gap: 30px;
|
||||
width: 100%;
|
||||
height: 72px;
|
||||
left: calc(50% - 1206px/2);
|
||||
top: 0px;
|
||||
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
}
|
||||
|
||||
.LogoCloud_cb2_logo {
|
||||
|
@ -2146,7 +2486,7 @@
|
|||
}
|
||||
|
||||
.Features_container {
|
||||
padding: 100px 80px;
|
||||
padding: 80px 80px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
@ -2258,14 +2598,182 @@
|
|||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.block_logo_client {
|
||||
width: 90%;
|
||||
width: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
|
||||
.CommentMarche_block1 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 50px;
|
||||
gap: 48px;
|
||||
background: #F9F9FD;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_block2 {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 0px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.CommentMarche_Card_Title_block1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
min-width: 280px;
|
||||
align-items: center;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.CommentMarche_Card_Title_block2 {
|
||||
font-family: DM Sans;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
line-height: 16px;
|
||||
text-align: center;
|
||||
color: #3e6ee3;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
|
||||
.CommentMarche_Card_Title_block3 {
|
||||
font-family: DM Sans;
|
||||
font-size: 40px;
|
||||
font-weight: 700;
|
||||
line-height: 48px;
|
||||
text-align: center;
|
||||
color: #16274f;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_cardStyle {
|
||||
width: 100%;
|
||||
max-width: 350px;
|
||||
min-height: 304px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 40px 16px;
|
||||
gap: 24px;
|
||||
background: #ecf1fc1a;
|
||||
border-radius: 12px;
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_imageContainerStyle {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_imageStyle {
|
||||
width: 100%;
|
||||
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_contentStyle {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_titleStyle {
|
||||
font-family: DM Sans, sans-serif;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
line-height: 24px;
|
||||
color: #16274f;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.CommentMarche_ListCard_buttonStyle {
|
||||
padding: 12px 20px;
|
||||
border-radius: 200px;
|
||||
border: 1px solid #c7c9ce;
|
||||
background: transparent;
|
||||
color: #4b5162;
|
||||
font-family: DM Sans, sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
line-height: 122%;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease-in-out;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_buttonHoverStyle {
|
||||
background: #f5f5f5;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_description {
|
||||
color: #4B5162;
|
||||
font-family: Inter;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
opacity: 0.8;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.home_page_img_saas {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.FrenchSolution_block {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 10rem;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_containerStyle {
|
||||
width: 162px;
|
||||
|
||||
background: #FFF;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
font-family: DM Sans, sans-serif;
|
||||
color: #16274f;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_solutionsStyle {
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_percentageStyle {
|
||||
font-size: 30px;
|
||||
font-weight: 700;
|
||||
line-height: 120%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
|
||||
.FrenchSolution_block_frenchStyle {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
line-height: 120%;
|
||||
margin: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1200px) {
|
||||
|
@ -2570,9 +3078,9 @@
|
|||
}
|
||||
|
||||
.ListCard_imageStyle {
|
||||
width: 88px;
|
||||
height: 88px;
|
||||
width: 100%;
|
||||
object-fit: contain;
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
.ListCard_contentStyle {
|
||||
|
@ -2710,7 +3218,7 @@
|
|||
left: calc(50% - 1206px/2);
|
||||
top: 0px;
|
||||
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
/* mix-blend-mode: luminosity;*/
|
||||
}
|
||||
|
||||
.LogoCloud_cb2_logo {
|
||||
|
@ -2897,7 +3405,7 @@
|
|||
}
|
||||
|
||||
.Features_container {
|
||||
padding: 100px 80px;
|
||||
padding: 80px 80px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
@ -3010,6 +3518,174 @@
|
|||
}
|
||||
|
||||
|
||||
.CommentMarche_block1 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 50px;
|
||||
gap: 48px;
|
||||
background: #F9F9FD;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_block2 {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 0px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.CommentMarche_Card_Title_block1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
width: 100%;
|
||||
min-width: 280px;
|
||||
align-items: center;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.CommentMarche_Card_Title_block2 {
|
||||
font-family: DM Sans;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
line-height: 16px;
|
||||
text-align: center;
|
||||
color: #3e6ee3;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
|
||||
.CommentMarche_Card_Title_block3 {
|
||||
font-family: DM Sans;
|
||||
font-size: 40px;
|
||||
font-weight: 700;
|
||||
line-height: 48px;
|
||||
text-align: center;
|
||||
color: #16274f;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_cardStyle {
|
||||
width: 100%;
|
||||
max-width: 350px;
|
||||
min-height: 304px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 40px 16px;
|
||||
gap: 24px;
|
||||
background: #ecf1fc1a;
|
||||
border-radius: 12px;
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_imageContainerStyle {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_imageStyle {
|
||||
width: 100%;
|
||||
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_contentStyle {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_titleStyle {
|
||||
font-family: DM Sans, sans-serif;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
line-height: 24px;
|
||||
color: #16274f;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.CommentMarche_ListCard_buttonStyle {
|
||||
padding: 12px 20px;
|
||||
border-radius: 200px;
|
||||
border: 1px solid #c7c9ce;
|
||||
background: transparent;
|
||||
color: #4b5162;
|
||||
font-family: DM Sans, sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
line-height: 122%;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease-in-out;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_buttonHoverStyle {
|
||||
background: #f5f5f5;
|
||||
|
||||
}
|
||||
|
||||
.CommentMarche_ListCard_description {
|
||||
color: #4B5162;
|
||||
font-family: Inter;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
opacity: 0.8;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.FrenchSolution_block {
|
||||
position: absolute;
|
||||
right: 10%;
|
||||
top: 12rem;
|
||||
|
||||
}
|
||||
|
||||
.FrenchSolution_block_containerStyle {
|
||||
width: 162px;
|
||||
|
||||
background: #FFF;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
font-family: DM Sans, sans-serif;
|
||||
color: #16274f;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_solutionsStyle {
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.FrenchSolution_block_percentageStyle {
|
||||
font-size: 30px;
|
||||
font-weight: 700;
|
||||
line-height: 120%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
|
||||
.FrenchSolution_block_frenchStyle {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
line-height: 120%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -8,13 +8,20 @@ import VisionSection from './VisionSection.js';
|
|||
import KeyMetrics from './KeyMetrics.js';
|
||||
import Features from './Features.js';
|
||||
import AboutUsSection from './block_stat/AboutUsSection.js';
|
||||
|
||||
import FrenchSolution from './FrenchSolution.js';
|
||||
|
||||
//import home_page_img_saas from "/img/home_page_img_saas.png";
|
||||
import CommentMarche from './CommentMarche.js';
|
||||
import New_C_Tatif_Section from "../tarif_section_automatic_files/PricingSection"
|
||||
|
||||
const New_C_A_Propos_2025 = (props) => {
|
||||
|
||||
useEffect(() => {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
|
||||
}, []);
|
||||
|
||||
return (
|
||||
|
||||
<div className="new_homepage_2025">
|
||||
|
@ -31,7 +38,7 @@ const New_C_A_Propos_2025 = (props) => {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div style={{ position: 'absolute', right: '15%' }}>
|
||||
<div className="FrenchSolution_block">
|
||||
<FrenchSolution />
|
||||
</div>
|
||||
|
||||
|
@ -53,7 +60,7 @@ const New_C_A_Propos_2025 = (props) => {
|
|||
<div className="title_and_cat_title_cat_bton_tarif" onClick={(e) => {
|
||||
|
||||
window.open(
|
||||
"/new_contact/",
|
||||
"/contact/",
|
||||
'_self'
|
||||
);
|
||||
}}>
|
||||
|
@ -62,24 +69,21 @@ const New_C_A_Propos_2025 = (props) => {
|
|||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src='/img/home_page_img_saas.png' />
|
||||
</div>
|
||||
<img src='/img/home_page_img_saas.png' className="home_page_img_saas" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<LogoCloud />
|
||||
|
||||
<WhyUsLayout />
|
||||
|
||||
|
||||
<CommentMarche />
|
||||
|
||||
<VisionSection />
|
||||
|
||||
<KeyMetrics />
|
||||
<AboutUsSection />
|
||||
|
||||
<Features />
|
||||
|
||||
|
||||
<AboutUsSection />
|
||||
<New_C_Tatif_Section />
|
||||
|
||||
</div>
|
||||
)
|
||||
|
|
|
@ -939,22 +939,6 @@ const New_C_Marketplace_2025 = () => {
|
|||
useEffect(() => {
|
||||
|
||||
|
||||
/*
|
||||
console.log(" zzzzzzzzzzzzzzzzzz ");
|
||||
|
||||
// Verifier s'il y a un sous domaine
|
||||
var tab_split_sous_domain = window.location.host.split(".");
|
||||
|
||||
if (tab_split_sous_domain.length > 2) {
|
||||
var new_url = process.env.REACT_APP_FRONT_URL_CANONICAL_BASE + tab_split_sous_domain[0] + "." + process.env.REACT_APP_FRONT_URL_CANONICAL + "moncatalog";
|
||||
window.open(String(new_url),
|
||||
'_self'
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
*/
|
||||
|
||||
|
||||
var ip = "";
|
||||
async function fetchData() {
|
||||
|
@ -1153,7 +1137,10 @@ const New_C_Marketplace_2025 = () => {
|
|||
|
||||
//document.getElementById("_1234").checked = true;
|
||||
|
||||
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: "smooth",
|
||||
});
|
||||
|
||||
}, [initAllfiter, categorie]);
|
||||
|
||||
|
@ -3731,7 +3718,7 @@ const New_C_Marketplace_2025 = () => {
|
|||
|
||||
{result && myApiResponse == "True" && fin == 0 && !newresult &&
|
||||
result.slice(0, PageSize).map((formation) => (
|
||||
<div className="block_formation" ref={inputEl} id="inputEl_element">
|
||||
<div className="block_formation" ref={inputEl} id="inputEl_element">
|
||||
<New_C_Formation_2025 formation={JSON.parse(formation)} key={JSON.parse(formation).title} coeur={JSON.parse(formation).title} />
|
||||
</div>
|
||||
|
||||
|
|
|
@ -25,7 +25,7 @@ const AdministrativeManagement = ({ style }) => {
|
|||
<div className="features-container">
|
||||
{features.map((feature, index) => (
|
||||
<div key={index} className="feature-row">
|
||||
<span className="feature-text">{feature}</span>
|
||||
<span className="feature-text">{feature} </span>
|
||||
<div className="check-icon">
|
||||
<img src={`https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-${index + 1}.png`} alt="check" />
|
||||
</div>
|
|
@ -6,7 +6,7 @@ const ClientRelationManagement = ({ style }) => {
|
|||
<div className="crm-container" style={style}>
|
||||
<div className="header">
|
||||
<h2>Gestion relation client (CRM)</h2>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/arrow-do-2.png" alt="arrow down" className="arrow-icon" />
|
||||
<img src="/img/market_place_img_arrow1.png" alt="arrow down" className="arrow-icon" />
|
||||
</div>
|
||||
|
||||
<div className="content-row">
|
||||
|
@ -25,7 +25,7 @@ const ClientRelationManagement = ({ style }) => {
|
|||
<div className="price-content">
|
||||
<div className="check-item">
|
||||
<div className="check-circle">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-10.png" alt="check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="check" className="check-icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -38,7 +38,7 @@ const ClientRelationManagement = ({ style }) => {
|
|||
<div className="price-content">
|
||||
<div className="check-item">
|
||||
<div className="check-circle">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-11.png" alt="check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="check" className="check-icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -48,14 +48,14 @@ const ClientRelationManagement = ({ style }) => {
|
|||
<div className="price-header highlight">
|
||||
<div className="check-item">
|
||||
<div className="check-circle">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-12.png" alt="check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="check" className="check-icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="price-content">
|
||||
<div className="check-item">
|
||||
<div className="check-circle">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-12.png" alt="check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="check" className="check-icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -6,63 +6,63 @@ const Marketplace = ({ style }) => {
|
|||
<div className="marketplace" style={style}>
|
||||
<div className="title-section">
|
||||
<h2>Marketplace</h2>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/arrow-do-4.png" alt="arrow down" />
|
||||
<img src="/img/market_place_img_arrow1.png" alt="arrow down" />
|
||||
</div>
|
||||
|
||||
<div className="content-section">
|
||||
<div className="text-row">
|
||||
<p>Mise en ligne de votre formation (Description, Objectif, Programme, etc)</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-17.png" alt="check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="check" className="check-icon" />
|
||||
</div>
|
||||
|
||||
<div className="text-row">
|
||||
<p>Mise en forme des textes selon votre souhait</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-17.png" alt="check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="check" className="check-icon" />
|
||||
</div>
|
||||
|
||||
<div className="text-row">
|
||||
<p>Définition du pays et la région de publication</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-17.png" alt="check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="check" className="check-icon" />
|
||||
</div>
|
||||
|
||||
<div className="text-row">
|
||||
<p>Import/Export Excel</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/add-3.png" alt="add" className="add-icon" />
|
||||
<img src="/img/market_place_img_no_check.png" alt="add" className="add-icon" />
|
||||
</div>
|
||||
|
||||
<div className="text-row">
|
||||
<p>Gestion des prix : Remise client / Tout public par période.</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/add-3.png" alt="add" className="add-icon" />
|
||||
<img src="/img/market_place_img_no_check.png" alt="add" className="add-icon" />
|
||||
</div>
|
||||
|
||||
<div className="text-row">
|
||||
<p>Ajout de vos propres images pour communiquer sur votre structure et votre marque.</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/add-3.png" alt="add" className="add-icon" />
|
||||
<img src="/img/market_place_img_no_check.png" alt="add" className="add-icon" />
|
||||
</div>
|
||||
|
||||
<div className="text-row">
|
||||
<p>Affichage de votre logo à côté de la formation</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/add-3.png" alt="add" className="add-icon" />
|
||||
<img src="/img/market_place_img_no_check.png" alt="add" className="add-icon" />
|
||||
</div>
|
||||
|
||||
<div className="text-row">
|
||||
<p>Affichage de votre bannière en grand sur la page détaillée.</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/add-3.png" alt="add" className="add-icon" />
|
||||
<img src="/img/market_place_img_no_check.png" alt="add" className="add-icon" />
|
||||
</div>
|
||||
|
||||
<div className="text-row">
|
||||
<p>Génération automatique de leads</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-17.png" alt="check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="check" className="check-icon" />
|
||||
</div>
|
||||
|
||||
<div className="text-row">
|
||||
<p>Consultation des appels d'offre de formation pour manifestation d'intérêt.</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/add-3.png" alt="add" className="add-icon" />
|
||||
<img src="/img/market_place_img_no_check.png" alt="add" className="add-icon" />
|
||||
</div>
|
||||
|
||||
<div className="text-row">
|
||||
<p>Publication d'un appel d'offre de formation et gestion des réponses.</p>
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/add-3.png" alt="add" className="add-icon" />
|
||||
<img src="/img/market_place_img_no_check.png" alt="add" className="add-icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -1,19 +1,14 @@
|
|||
import React from 'react';
|
||||
import AdministrativeManagement from './AdministrativeManagement';
|
||||
import ClientRelationManagement from './ClientRelationManagement';
|
||||
import TrainingHosting from './TrainingHosting';
|
||||
//import AdministrativeManagement from './AdministrativeManagement';
|
||||
//import ClientRelationManagement from './ClientRelationManagement';
|
||||
//import TrainingHosting from './TrainingHosting';
|
||||
import Marketplace from './Marketplace';
|
||||
|
||||
const PricingLayout = () => {
|
||||
return (
|
||||
<div style={styles.container}>
|
||||
<div style={styles.section}>
|
||||
<AdministrativeManagement style={styles.component} />
|
||||
</div>
|
||||
|
||||
<div style={styles.section}>
|
||||
<TrainingHosting style={styles.component} />
|
||||
</div>
|
||||
<div >
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
);
|
|
@ -31,14 +31,14 @@ const TrainingHosting = ({ style }) => {
|
|||
<div className="price-content">
|
||||
<div className="circle-container">
|
||||
<div className="gray-circle">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/add.png" alt="Add" className="icon" />
|
||||
<img src="/img/market_place_img_no_check.png" alt="Add" className="icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="price-content">
|
||||
<div className="circle-container">
|
||||
<div className="green-circle">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-13.png" alt="Check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="Check" className="check-icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -51,14 +51,14 @@ const TrainingHosting = ({ style }) => {
|
|||
<div className="price-content">
|
||||
<div className="circle-container">
|
||||
<div className="gray-circle">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/add-2.png" alt="Add" className="icon" />
|
||||
<img src="/img/market_place_img_no_check.png" alt="Add" className="icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="price-content">
|
||||
<div className="circle-container">
|
||||
<div className="green-circle">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-14.png" alt="Check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="Check" className="check-icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -67,20 +67,20 @@ const TrainingHosting = ({ style }) => {
|
|||
<div className="price-column">
|
||||
<div className="price-header">
|
||||
<span className="dropdown-container">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/arrow-do-3.png" alt="Dropdown" className="dropdown-icon" />
|
||||
<img src="/img/market_place_img_arrow1.png" alt="Dropdown" className="dropdown-icon" />
|
||||
</span>
|
||||
</div>
|
||||
<div className="price-content">
|
||||
<div className="circle-container">
|
||||
<div className="green-circle">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-15.png" alt="Check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="Check" className="check-icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="price-content">
|
||||
<div className="circle-container">
|
||||
<div className="green-circle">
|
||||
<img src="https://dashboard.codeparrot.ai/api/image/Z5OupHhIZI-ZK8k9/check-16.png" alt="Check" className="check-icon" />
|
||||
<img src="/img/market_place_img_check.png" alt="Check" className="check-icon" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -1,17 +1,15 @@
|
|||
import React from 'react';
|
||||
import PricingPlanCard from './PricingPlanCard';
|
||||
import PricingDescription from './PricingDescription';
|
||||
import New_C_Tatif_Detail_Section_Head from "../tarif_detail_automatic_files/PricingLayout";
|
||||
|
||||
import check_img_check_17 from "../../img_new_design_2025/check_17.png";
|
||||
|
||||
import check_ko_fond_gris from "../../img_new_design_2025/check_ko_fond_gris.png";
|
||||
import './detail.css';
|
||||
|
||||
|
||||
|
||||
import { Button, FormGroup, Label, Input } from "reactstrap";
|
||||
import WhyUsLayout from './../a_propos_automatic_files/WhyUsLayout.js';
|
||||
|
||||
const PricingLayout = () => {
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className='tarif_head_automatic_files' style={{ width: '90%', marginLeft: '5%' }}>
|
||||
|
@ -36,7 +34,6 @@ const PricingLayout = () => {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className='position_detail_price'>
|
||||
|
||||
{/*** Gestion admin */}
|
||||
|
@ -413,7 +410,9 @@ const PricingLayout = () => {
|
|||
<div className='coupure_fin_fonctionnalite'> </div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div className='new_a_propos_2025' >
|
||||
<WhyUsLayout />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
@ -0,0 +1,81 @@
|
|||
.marketplace {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
min-width: 320px;
|
||||
max-width: 1251px;
|
||||
border: 1px solid #ecf1fc;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.title-section {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20px 32px;
|
||||
background-color: #ecf1fc;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.title-section h2 {
|
||||
font-family: 'DM Sans', sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 20px;
|
||||
color: #16274f;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.content-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.text-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20px 32px;
|
||||
min-height: 80px;
|
||||
border-bottom: 1px solid #ecf1fc;
|
||||
}
|
||||
|
||||
.text-row p {
|
||||
font-family: 'Inter', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: #171717;
|
||||
margin: 0;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.check-icon, .add-icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 100%;
|
||||
background-color: #0aa690;
|
||||
padding: 4px;
|
||||
box-sizing: border-box;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.add-icon {
|
||||
background-color: #b7b7b7;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.marketplace {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.title-section {
|
||||
padding: 10px 16px;
|
||||
}
|
||||
|
||||
.text-row {
|
||||
padding: 10px 16px;
|
||||
}
|
||||
}
|
||||
|
|
@ -169,6 +169,7 @@
|
|||
padding-right: 30px;
|
||||
padding-left: 30px;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 64px;
|
||||
}
|
||||
|
||||
|
||||
|
@ -381,6 +382,7 @@
|
|||
padding-right: 64px;
|
||||
padding-left: 64px;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 64px;
|
||||
}
|
||||
|
||||
|
||||
|
@ -587,6 +589,7 @@
|
|||
padding-right: 64px;
|
||||
padding-left: 64px;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 64px;
|
||||
}
|
||||
|
||||
|
||||
|
@ -791,6 +794,7 @@
|
|||
padding-right: 64px;
|
||||
padding-left: 64px;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 64px;
|
||||
}
|
||||
|
||||
|
||||
|
@ -798,7 +802,7 @@
|
|||
.entete_pricingsection_H1 {
|
||||
font-family: 'DM Sans';
|
||||
font-weight: 700;
|
||||
font-size: 48px;
|
||||
font-size: 40px;
|
||||
letter-spacing: -0.48px;
|
||||
line-height: 52px;
|
||||
text-align: center;
|
||||
|
|