diff --git a/.anima/.gitignore b/.anima/.gitignore new file mode 100644 index 0000000..5e46596 --- /dev/null +++ b/.anima/.gitignore @@ -0,0 +1 @@ +cache \ No newline at end of file diff --git a/.anima/conventions.json b/.anima/conventions.json new file mode 100644 index 0000000..28699e2 --- /dev/null +++ b/.anima/conventions.json @@ -0,0 +1 @@ +{"assetsPath":"src/mysy_img/","componentLibrary":"none","componentsPath":"src/components","defaultConfigPath":"/.anima","framework":"html","language":"typescript","nextRouterType":null,"projectRoot":"c:\\Users\\billa\\Documents\\myclass.com\\Siteweb\\Production\\Ela_Front\\Front_Office","styleguidePath":"","styling":"css","tailwindConfigPath":"","tailwindConfigReuseEnabled":false} \ No newline at end of file diff --git a/.anima/workspace.json b/.anima/workspace.json new file mode 100644 index 0000000..e90f7d1 --- /dev/null +++ b/.anima/workspace.json @@ -0,0 +1 @@ +{"activePackage":"/","subPackages":["/","build/tinymce","public/tinymce"],"workspaceId":"67513b4c-c3fd-4391-aa8c-8f0a03fa7efe"} \ No newline at end of file diff --git a/.vscode/extensions.json b/.vscode/extensions.json new file mode 100644 index 0000000..0103765 --- /dev/null +++ b/.vscode/extensions.json @@ -0,0 +1,5 @@ +{ + "recommendations": [ + "codeparrot-ai.codeparrot" + ] +} \ No newline at end of file diff --git a/public/img/client_logo_1.png b/public/img/client_logo_1.png new file mode 100644 index 0000000..0039bc2 Binary files /dev/null and b/public/img/client_logo_1.png differ diff --git a/public/img/client_logo_2.png b/public/img/client_logo_2.png new file mode 100644 index 0000000..d6e2925 Binary files /dev/null and b/public/img/client_logo_2.png differ diff --git a/public/img/client_logo_3.png b/public/img/client_logo_3.png new file mode 100644 index 0000000..3ef0885 Binary files /dev/null and b/public/img/client_logo_3.png differ diff --git a/public/img/client_logo_4.png b/public/img/client_logo_4.png new file mode 100644 index 0000000..9034c5e Binary files /dev/null and b/public/img/client_logo_4.png differ diff --git a/public/img/client_logo_5.png b/public/img/client_logo_5.png new file mode 100644 index 0000000..a9d0d34 Binary files /dev/null and b/public/img/client_logo_5.png differ diff --git a/public/img/client_logo_6.png b/public/img/client_logo_6.png new file mode 100644 index 0000000..6b43329 Binary files /dev/null and b/public/img/client_logo_6.png differ diff --git a/public/img/img_a_propos_main.jfif b/public/img/img_a_propos_main.jfif new file mode 100644 index 0000000..9993f31 Binary files /dev/null and b/public/img/img_a_propos_main.jfif differ diff --git a/public/img/img_a_propos_main.jpg b/public/img/img_a_propos_main.jpg new file mode 100644 index 0000000..e0b5dea Binary files /dev/null and b/public/img/img_a_propos_main.jpg differ diff --git a/public/img/stat_img.png b/public/img/stat_img.png new file mode 100644 index 0000000..350d35c Binary files /dev/null and b/public/img/stat_img.png differ diff --git a/public/index.html b/public/index.html index 1c6a0c6..6f34e29 100644 --- a/public/index.html +++ b/public/index.html @@ -101,7 +101,7 @@ diff --git a/public/robots.txt b/public/robots.txt index 5fd82ce..4f950d2 100644 --- a/public/robots.txt +++ b/public/robots.txt @@ -1,5 +1,13 @@ # https://www.robotstxt.org/robotstxt.html User-agent: * -Disallow: /google06c10352a49f1dc0 -Disallow: /sample -Sitemap: https://www.mysy-training.com/sitemap.xml \ No newline at end of file +Disallow: / + +User-agent: * +Disallow: / +Disallow: /cgi-bin/ +Sitemap: https://dev.mysy-training.com/sitemap.xml + +User-agent: * +Disallow: / +Disallow: /cgi-bin/ +Sitemap: https://demo.mysy-training.com/sitemap.xml diff --git a/src/App.js b/src/App.js index 4a2f346..5ed29df 100644 --- a/src/App.js +++ b/src/App.js @@ -269,6 +269,7 @@ function App() { + diff --git a/src/components/a_propos_automatic_files/ButtonText.js b/src/components/a_propos_automatic_files/ButtonText.js new file mode 100644 index 0000000..9789d3f --- /dev/null +++ b/src/components/a_propos_automatic_files/ButtonText.js @@ -0,0 +1,49 @@ +import React from 'react'; + +const ButtonText = ({ text = 'Découvrir' }) => { + const buttonStyle = { + display: 'flex', + flexDirection: 'row', + justifyContent: 'center', + alignItems: 'center', + padding: '12px 20px', + borderRadius: '200px', + border: '1px solid #c7c9ce', + backgroundColor: 'inherit', + minWidth: '133px', + height: '48px', + cursor: 'pointer', + transition: 'all 0.2s ease-in-out', + boxSizing: 'border-box' + }; + + const textStyle = { + color: '#4b5162', + fontFamily: 'DM Sans', + fontSize: '16px', + fontWeight: 700, + lineHeight: '122%', + textAlign: 'center' + }; + + const handleHover = (e) => { + e.currentTarget.style.backgroundColor = '#f5f5f5'; + }; + + const handleLeave = (e) => { + e.currentTarget.style.backgroundColor = 'inherit'; + }; + + return ( + + ); +}; + +export default ButtonText; + diff --git a/src/components/a_propos_automatic_files/Card_Title.js b/src/components/a_propos_automatic_files/Card_Title.js new file mode 100644 index 0000000..f5a8889 --- /dev/null +++ b/src/components/a_propos_automatic_files/Card_Title.js @@ -0,0 +1,23 @@ +import React from 'react'; +import './new_a_propos.css' + +const Card_Title = ({ + subtitle = "POURQUOI NOUS CHOISIR ?", + title = "Un besoin, une solution personnalisée" +}) => { + return ( +
+
+
+ {subtitle} +
+
+ {title} +
+
+
+ ); +}; + +export default Card_Title; + diff --git a/src/components/a_propos_automatic_files/Features.js b/src/components/a_propos_automatic_files/Features.js new file mode 100644 index 0000000..696ca7f --- /dev/null +++ b/src/components/a_propos_automatic_files/Features.js @@ -0,0 +1,162 @@ +import './new_a_propos.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: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons-2.png", + title: "Proximité", + description: "Un accompagnement humain et personnalisé pour chaque client." + }, + { + icon: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons-3.png", + title: "Excellence", + description: "Des solutions fiables qui font leurs preuves au quotidien." + }, + { + icon: "https://dashboard.codeparrot.ai/api/image/Z6x2GGNxokPE5KUG/icons-4.png", + title: "Transparence", + description: "Nous construisons des relations basées sur la confiance." + } + ]; + + return ( +
+
+ +
+ NOS VALEURS +

Des valeurs qui nous guident.

+
+ +
+ {values.map((value, index) => ( +
+
+ +
+
+

{value.title}

+

{value.description}

+
+
+ ))} +
+ + +
+
+ ); +}; + +const styles = { + container: { + padding: '100px 80px', + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + gap: '48px', + background: '#ffffff', + }, + titleContainer: { + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + gap: '4px', + width: '100%', + }, + subtitle: { + fontFamily: 'DM Sans', + fontSize: '16px', + fontWeight: 700, + color: '#ecae49', + textAlign: 'center', + textTransform: 'uppercase', + lineHeight: '16px', + }, + title: { + fontFamily: 'DM Sans', + fontSize: '40px', + fontWeight: 700, + color: '#16274f', + textAlign: 'center', + lineHeight: '120%', + margin: '20px 0 0 0', + }, + cardContainer: { + display: 'flex', + flexDirection: 'row', + gap: '24px', + width: '100%', + justifyContent: 'center', + }, + card: { + width: '270px', + padding: '48px 16px', + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + gap: '24px', + background: '#fdf6ec1a', + borderRadius: '12px', + border: '1px solid #ecae49', + }, + iconWrapper: { + width: '88px', + height: '88px', + display: 'flex', + justifyContent: 'center', + alignItems: 'center', + }, + icon: { + width: '88px', + height: '88px', + }, + content: { + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + gap: '8px', + width: '100%', + }, + cardTitle: { + fontFamily: 'DM Sans', + fontSize: '20px', + fontWeight: 700, + color: '#16274f', + textAlign: 'center', + lineHeight: '24px', + margin: 0, + }, + description: { + fontFamily: 'Inter', + fontSize: '14px', + fontWeight: 400, + color: '#4b5162', + textAlign: 'center', + lineHeight: '160%', + opacity: 0.8, + margin: 0, + }, + button: { + padding: '12px 20px', + borderRadius: '200px', + border: '1px solid #c7c9ce', + background: 'transparent', + fontFamily: 'DM Sans', + fontSize: '16px', + fontWeight: 700, + color: '#4b5162', + cursor: 'pointer', + transition: 'all 0.2s ease', + }, +}; + +export default Features; + diff --git a/src/components/a_propos_automatic_files/KeyMetrics.js b/src/components/a_propos_automatic_files/KeyMetrics.js new file mode 100644 index 0000000..6142ef1 --- /dev/null +++ b/src/components/a_propos_automatic_files/KeyMetrics.js @@ -0,0 +1,116 @@ +const KeyMetrics = () => { + const metrics = [ + { + value: "10 ans", + description: "d'expériences." + }, + { + value: "98%", + description: "de satisfaction\nclient." + }, + { + value: "500+", + description: "organismes de formation\naccompagnés." + }, + { + value: "20+", + description: "partenariats avec des\ninstitutions." + } + ]; + + const containerStyle = { + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + padding: '100px 0', + backgroundColor: '#ffffff', + width: '100%' + }; + + const headerStyle = { + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + gap: '4px', + marginBottom: '40px' + }; + + const subtitleStyle = { + fontFamily: 'DM Sans', + fontSize: '16px', + fontWeight: 700, + color: '#0aa690', + textTransform: 'uppercase', + textAlign: 'center', + lineHeight: '16px' + }; + + const titleStyle = { + fontFamily: 'DM Sans', + fontSize: '40px', + fontWeight: 700, + color: '#16274f', + textAlign: 'center', + lineHeight: '120%', + maxWidth: '679px', + margin: '20px 0 0 0' + }; + + const metricsContainerStyle = { + display: 'flex', + flexDirection: 'row', + gap: '20px', + justifyContent: 'center', + maxWidth: '1116px', + width: '100%' + }; + + const metricStyle = { + display: 'flex', + flexDirection: 'column', + gap: '8px', + width: '260px', + alignItems: 'center' + }; + + const valueStyle = { + fontFamily: 'Plus Jakarta Sans', + fontSize: '60px', + fontWeight: 700, + color: '#0aa690', + textAlign: 'center', + lineHeight: '70px', + margin: 0 + }; + + const descriptionStyle = { + fontFamily: 'Inter', + fontSize: '14px', + fontWeight: 400, + color: '#16274f', + textAlign: 'center', + lineHeight: '160%', + margin: 0, + whiteSpace: 'pre-line' + }; + + return ( +
+
+
Nos chiffres clés
+

Quelques chiffres qui parlent de nous.

+
+
+ {metrics.map((metric, index) => ( +
+
{metric.value}
+

{metric.description}

+
+ ))} +
+
+ ); +}; + +export default KeyMetrics; + diff --git a/src/components/a_propos_automatic_files/ListCard.js b/src/components/a_propos_automatic_files/ListCard.js new file mode 100644 index 0000000..bd1aa08 --- /dev/null +++ b/src/components/a_propos_automatic_files/ListCard.js @@ -0,0 +1,96 @@ +import React from 'react'; + +const ListCard = ({ imageUrl, title, buttonText }) => { + const cardStyle = { + width: '100%', + maxWidth: '270px', + minHeight: '304px', + display: 'flex', + flexDirection: 'column', + padding: '40px 16px', + gap: '24px', + backgroundColor: '#ecf1fc1a', + borderRadius: '12px', + border: '1px solid #3e6ee3', + boxSizing: 'border-box', + }; + + const imageContainerStyle = { + display: 'flex', + justifyContent: 'center', + alignItems: 'center', + }; + + const imageStyle = { + width: '88px', + height: '88px', + objectFit: 'contain', + }; + + const contentStyle = { + width: '100%', + display: 'flex', + flexDirection: 'column', + gap: '16px', + alignItems: 'center', + }; + + const titleStyle = { + fontFamily: 'DM Sans, sans-serif', + fontSize: '20px', + fontWeight: 700, + lineHeight: '24px', + color: '#16274f', + textAlign: 'center', + }; + + 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 ( +
+
+ {title} +
+
+

{title}

+
+ +
+
+
+ ); +}; + +ListCard.defaultProps = { + imageUrl: 'https://dashboard.codeparrot.ai/api/image/Z6xpvmNxokPE5KTq/france-1.png', + title: 'Editeur Français', + buttonText: 'Découvrir' +}; + +export default ListCard; + diff --git a/src/components/a_propos_automatic_files/LogoCloud.js b/src/components/a_propos_automatic_files/LogoCloud.js new file mode 100644 index 0000000..e1ab540 --- /dev/null +++ b/src/components/a_propos_automatic_files/LogoCloud.js @@ -0,0 +1,101 @@ +import './new_a_propos.css' + + +const list_img = [ + { + icon: "./img/client_logo_1.png", + title: "5 Discovery", + }, + + { + icon: "./img/client_logo_2.png", + title: "Potentials", + }, + + { + icon: "./img/client_logo_3.png", + title: "Univ Clermont-Ferrant", + }, + + { + icon: "./img/client_logo_5.png", + title: "Ecole aromathérapie ", + }, + + { + icon: "./img/client_logo_6.png", + title: "Groupe CAPL", + }, + + { + icon: "./img/client_logo_1.png", + title: "5 Discovery", + }, + + { + icon: "./img/client_logo_2.png", + title: "Potentials", + }, + + { + icon: "./img/client_logo_3.png", + title: "Univ Clermont-Ferrant", + }, + +]; + +const LogoCloud = () => { + return ( +
+
+

+ 1000+ institutions éducatifs ont confiance en Mysy Training +

+
+ +
+
+ + {list_img.map((value, index) => ( +
+ {value.title} +
+ ))} + + +
+ +
+ + +
+ + {/*
+ Partner Logos +
*/} +
+ +
+ ); +}; + +export default LogoCloud; + diff --git a/src/components/a_propos_automatic_files/VisionSection.js b/src/components/a_propos_automatic_files/VisionSection.js new file mode 100644 index 0000000..53b1428 --- /dev/null +++ b/src/components/a_propos_automatic_files/VisionSection.js @@ -0,0 +1,48 @@ +const VisionSection = ({ + title = "NOTRE VISION", + heading = "Nous simplifions la gestion de votre organisme de formation.", + description = "Chez MySy Training, nous croyons en une gestion de formation simplifiée pour booster l'efficacité des établissements éducatifs. Notre mission est de fournir des solutions technologiques innovantes pour faciliter la vie des formateurs et enrichir l'expérience des apprenants. Nous nous engageons à rendre la formation accessible, efficace et durable.", + buttonText = "Découvrez notre solution", + imageSrc = "/img/img_a_propos_main.jpg" +}) => { + return ( +
+ {/* Image Section */} +
+ + {/* Content Section */} +
+ {/* Title and Heading */} +
+ + {title} + +

+ {heading} +

+
+ + {/* Description */} +

+ {description} +

+ + {/* Button */} + +
+
+ ); +}; + +export default VisionSection; + diff --git a/src/components/a_propos_automatic_files/WhyUsLayout.js b/src/components/a_propos_automatic_files/WhyUsLayout.js new file mode 100644 index 0000000..9225634 --- /dev/null +++ b/src/components/a_propos_automatic_files/WhyUsLayout.js @@ -0,0 +1,26 @@ +import React from 'react'; +import Card_Title from './Card_Title'; +import ListCard from './ListCard'; +import ButtonText from './ButtonText'; + +const WhyUsLayout = () => { + return ( +
+
+ +
+
+ + + + +
+
+ +
+
+ ); +}; + +export default WhyUsLayout; + diff --git a/src/components/a_propos_automatic_files/block_stat/AboutUsSection.js b/src/components/a_propos_automatic_files/block_stat/AboutUsSection.js new file mode 100644 index 0000000..a630e94 --- /dev/null +++ b/src/components/a_propos_automatic_files/block_stat/AboutUsSection.js @@ -0,0 +1,36 @@ +import React from 'react'; +import SolutionDescription from './SolutionDescription'; +import "./aboutussection.css"; + + +import Stat_Img from "./../img/stat_img.png" + +const AboutUsSection = () => { + return ( +
+
+
+ +
+
+ + +
+ Background + +
+
+
+
+ + ); +}; + +export default AboutUsSection; + diff --git a/src/components/a_propos_automatic_files/block_stat/SolutionDescription.js b/src/components/a_propos_automatic_files/block_stat/SolutionDescription.js new file mode 100644 index 0000000..6747833 --- /dev/null +++ b/src/components/a_propos_automatic_files/block_stat/SolutionDescription.js @@ -0,0 +1,48 @@ +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" +}) => { + return ( +
+ +
+
+
+ + {subtitle} + +

+ {title} +

+
+

+ {description} +

+
+ +
+
+ ); +}; + +export default SolutionDescription; + diff --git a/src/components/a_propos_automatic_files/block_stat/aboutussection.css b/src/components/a_propos_automatic_files/block_stat/aboutussection.css new file mode 100644 index 0000000..dee1ce2 --- /dev/null +++ b/src/components/a_propos_automatic_files/block_stat/aboutussection.css @@ -0,0 +1,128 @@ +.aboutussection { + + + @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) { + + + + .SolutionDescription_block1 { + display: flex; + flex-direction: column; + align-items: flex-start; + gap: 32px; + width: 100%; + max-width: 540px; + min-width: 320px; + padding: 20px; + text-align: left; + } + + .SolutionDescription_block2 { + display: flex; + flex-direction: column; + gap: 20px; + width: 100%; + } + + .SolutionDescription_block3 { + display: flex; + flex-direction: column; + gap: 4px; + + } + + .SolutionDescription_block3_span { + font-family: DM Sans; + font-weight: 700; + font-size: 16px; + line-height: 16px; + text-transform: uppercase; + color: #3E6EE3 + } + + .SolutionDescription_block3_h1 { + font-family: DM Sans; + font-weight: 700; + font-size: 40px; + line-height: 120%; + margin: 0; + color: #16274F + } + + + .SolutionDescription_block3_p { + font-family: Inter; + font-weight: 400; + font-size: 16px; + line-height: 24px; + margin: 0; + color: #4B5162; + opacity: 0.8; + margin-bottom: 1rem; + } + + .SolutionDescription_block3_bton_solution { + display: flex; + align-items: center; + padding: 12px 20px; + background: transparent; + border: 1px solid #C7C9CE; + border-radius: 200px; + cursor: pointer; + width: fit-content; + transition: all 0.2s ease-in-out; + } + + .SolutionDescription_block3_bton_text { + font-family: DM Sans; + font-weight: 700; + font-size: 16px; + line-height: 122%; + color: #4B5162; + padding: 0 8px; + } + + .AboutUsSection_block1 { + display: flex; + flex-direction: row; + width: 80%; + padding: 80px 48px; + box-sizing: border-box; + background: #FFF; + margin-left: auto; + margin-right: auto; + } + + .AboutUsSection_block2 { + flex-grow: 1; + display: flex; + flex-direction: column; + gap: 32px; + max-width: 540px; + } + + + .AboutUsSection_block3 { + flex-grow: 1; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 20px; + max-width: 692px; + + } + + + + + + + } +} \ No newline at end of file diff --git a/src/components/a_propos_automatic_files/img/img_a_propos_main.jpg b/src/components/a_propos_automatic_files/img/img_a_propos_main.jpg new file mode 100644 index 0000000..e0b5dea Binary files /dev/null and b/src/components/a_propos_automatic_files/img/img_a_propos_main.jpg differ diff --git a/src/components/a_propos_automatic_files/img/stat_img.png b/src/components/a_propos_automatic_files/img/stat_img.png new file mode 100644 index 0000000..350d35c Binary files /dev/null and b/src/components/a_propos_automatic_files/img/stat_img.png differ diff --git a/src/components/a_propos_automatic_files/new_a_propos.css b/src/components/a_propos_automatic_files/new_a_propos.css new file mode 100644 index 0000000..009732b --- /dev/null +++ b/src/components/a_propos_automatic_files/new_a_propos.css @@ -0,0 +1,1492 @@ +.new_a_propos_2025 { + + @media only screen and (max-width: 600px) { + .fonctionnalite_Background { + width: 100%; + height: 590px; + left: 0px; + top: 0px; + + background: #C4C8EE; + background: #f3f4fb; + + opacity: 1; + padding: 5px; + } + + .title_and_cat { + /* Title + CTA */ + + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 20px; + + + height: 280px; + /* left: calc(50% - 1081px/2 + 0.5px);*/ + + width: 100%; + margin-left: auto; + margin-right: auto; + } + + .title_and_cat_title { + /* Title + Description */ + + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 20px; + + + min-height: 202px; + + + /* Inside auto layout */ + flex: none; + order: 0; + align-self: stretch; + flex-grow: 0; + width: 100%; + margin-left: auto; + margin-right: auto; + height: 500px; + + } + + .title_and_cat_title_text1 { + /* Des fonctionnalités pensées pour simplifier la gestion de vos formations. */ + + width: 100%; + min-height: 134px; + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 36px; + line-height: 120%; + text-align: center; + color: #16274F; + flex: none; + flex-grow: 0; + order: 0; + flex-grow: 0; + margin-left: auto; + margin-right: auto; + margin-top: 5rem; + + } + + .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. */ + + /* Commons/Body/Body - L */ + font-family: 'Inter'; + font-style: normal; + font-weight: 400; + font-size: 16px; + line-height: 24px; + /* or 150% */ + text-align: center; + + /* Foundation /Blue-Grey/Normal */ + color: #4B5162; + + opacity: 0.8; + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + width: 80%; + margin-left: auto; + margin-right: auto; + + } + + .title_and_cat_title_cat { + /* CTA's */ + + /* Auto layout */ + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: center; + padding: 0px; + gap: 20px; + + + height: 48px; + + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + + width: 90%; + margin-left: auto; + margin-right: auto; + + + + } + + .title_and_cat_title_cat_bton_demo { + /* Button text */ + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 12px 20px; + + width: 207px; + height: 48px; + + /* Foundation /Blue/Normal */ + background: #3E6EE3; + border-radius: 200px; + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + cursor: pointer; + } + + .title_and_cat_title_cat_bton_demo_txt { + /* Text */ + + width: 151px; + height: 20px; + + /* Button/Base - Bold */ + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 122%; + /* identical to box height, or 20px */ + + /* Foundation/White */ + color: #FFFFFF; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + + + } + + + .title_and_cat_title_cat_bton_tarif { + /* Button text */ + + box-sizing: border-box; + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 12px 20px; + + width: 217px; + height: 48px; + + /* Foundation /Blue-Grey/Light :active */ + border: 1px solid #FFF; + backdrop-filter: blur(6px); + /* Note: backdrop-filter has minimal browser support */ + border-radius: 200px; + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + background: #FFF; + cursor: pointer; + + } + + .title_and_cat_title_cat_bton_tarif_txt { + /* Text */ + + width: 161px; + height: 20px; + + /* Button/Base - Bold */ + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 122%; + /* identical to box height, or 20px */ + + /* Foundation /Blue-Grey/Normal */ + color: #4B5162; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + + } + + + } + + @media only screen and (min-width: 601px) and (max-width: 991px) { + .fonctionnalite_Background { + width: 100%; + height: 420px; + left: 0px; + top: 0px; + + background: #C4C8EE; + background: #f3f4fb; + + opacity: 1; + padding: 20px; + } + + .title_and_cat { + /* Title + CTA */ + + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 30px; + + + height: 280px; + /* left: calc(50% - 1081px/2 + 0.5px);*/ + top: 176px; + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .title_and_cat_title { + /* Title + Description */ + + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 20px; + + + min-height: 202px; + + + /* Inside auto layout */ + flex: none; + order: 0; + align-self: stretch; + flex-grow: 0; + width: 90%; + margin-left: auto; + margin-right: auto; + + } + + .title_and_cat_title_text1 { + /* Des fonctionnalités pensées pour simplifier la gestion de vos formations. */ + + width: 90%; + min-height: 134px; + + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 120%; + /* or 67px */ + text-align: center; + + /* Foundation /Blue/Darker */ + color: #16274F; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + margin-left: auto; + margin-right: auto; + + } + + .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. */ + + + height: 48px; + + /* Commons/Body/Body - L */ + font-family: 'Inter'; + font-style: normal; + font-weight: 400; + font-size: 16px; + line-height: 24px; + /* or 150% */ + text-align: center; + + /* Foundation /Blue-Grey/Normal */ + color: #4B5162; + + opacity: 0.8; + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + width: 80%; + margin-left: auto; + margin-right: auto; + + } + + .title_and_cat_title_cat { + /* CTA's */ + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 0px; + gap: 50px; + + + height: 48px; + + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + + + margin-left: auto; + margin-right: auto; + + + + } + + .title_and_cat_title_cat_bton_demo { + /* Button text */ + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 12px 20px; + + width: 207px; + height: 48px; + + /* Foundation /Blue/Normal */ + background: #3E6EE3; + border-radius: 200px; + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + cursor: pointer; + } + + .title_and_cat_title_cat_bton_demo_txt { + /* Text */ + + width: 151px; + height: 20px; + + /* Button/Base - Bold */ + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 122%; + /* identical to box height, or 20px */ + + /* Foundation/White */ + color: #FFFFFF; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + + + } + + + .title_and_cat_title_cat_bton_tarif { + /* Button text */ + + box-sizing: border-box; + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 12px 20px; + + width: 217px; + height: 48px; + + /* Foundation /Blue-Grey/Light :active */ + border: 1px solid #FFF; + backdrop-filter: blur(6px); + /* Note: backdrop-filter has minimal browser support */ + border-radius: 200px; + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + background: #FFF; + cursor: pointer; + + } + + .title_and_cat_title_cat_bton_tarif_txt { + /* Text */ + + width: 161px; + height: 20px; + + /* Button/Base - Bold */ + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 122%; + /* identical to box height, or 20px */ + + /* Foundation /Blue-Grey/Normal */ + color: #4B5162; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + + } + + + } + + @media only screen and (min-width: 992px) and (max-width: 1199px) { + .fonctionnalite_Background { + width: 100%; + height: 420px; + left: 0px; + top: 0px; + + background: #C4C8EE; + background: #f3f4fb; + + opacity: 1; + padding: 30px; + } + + .title_and_cat { + /* Title + CTA */ + + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 30px; + + + height: 280px; + /* left: calc(50% - 1081px/2 + 0.5px);*/ + top: 176px; + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .title_and_cat_title { + /* Title + Description */ + + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 20px; + + + min-height: 202px; + + + /* Inside auto layout */ + flex: none; + order: 0; + align-self: stretch; + flex-grow: 0; + width: 90%; + margin-left: auto; + margin-right: auto; + + } + + .title_and_cat_title_text1 { + /* Des fonctionnalités pensées pour simplifier la gestion de vos formations. */ + + width: 90%; + min-height: 134px; + + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 120%; + /* or 67px */ + text-align: center; + + /* Foundation /Blue/Darker */ + color: #16274F; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + margin-left: auto; + margin-right: auto; + + } + + .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. */ + + + height: 48px; + + /* Commons/Body/Body - L */ + font-family: 'Inter'; + font-style: normal; + font-weight: 400; + font-size: 16px; + line-height: 24px; + /* or 150% */ + text-align: center; + + /* Foundation /Blue-Grey/Normal */ + color: #4B5162; + + opacity: 0.8; + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + width: 80%; + margin-left: auto; + margin-right: auto; + + } + + .title_and_cat_title_cat { + /* CTA's */ + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 0px; + gap: 50px; + + + height: 48px; + + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + + + margin-left: auto; + margin-right: auto; + + + + } + + .title_and_cat_title_cat_bton_demo { + /* Button text */ + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 12px 20px; + + width: 207px; + height: 48px; + + /* Foundation /Blue/Normal */ + background: #3E6EE3; + border-radius: 200px; + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + cursor: pointer; + } + + .title_and_cat_title_cat_bton_demo_txt { + /* Text */ + + width: 151px; + height: 20px; + + /* Button/Base - Bold */ + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 122%; + /* identical to box height, or 20px */ + + /* Foundation/White */ + color: #FFFFFF; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + + + } + + + .title_and_cat_title_cat_bton_tarif { + /* Button text */ + + box-sizing: border-box; + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 12px 20px; + + width: 217px; + height: 48px; + + /* Foundation /Blue-Grey/Light :active */ + border: 1px solid #FFF; + backdrop-filter: blur(6px); + /* Note: backdrop-filter has minimal browser support */ + border-radius: 200px; + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + background: #FFF; + cursor: pointer; + + } + + .title_and_cat_title_cat_bton_tarif_txt { + /* Text */ + + width: 161px; + height: 20px; + + /* Button/Base - Bold */ + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 122%; + /* identical to box height, or 20px */ + + /* Foundation /Blue-Grey/Normal */ + color: #4B5162; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + + } + + + + } + + @media only screen and (min-width: 1200px) { + .fonctionnalite_Background { + width: 100%; + height: 420px; + left: 0px; + top: 0px; + + background: #C4C8EE; + background: #f3f4fb; + + opacity: 1; + padding: 50px; + } + + .title_and_cat { + /* Title + CTA */ + + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 30px; + + + height: 280px; + /* left: calc(50% - 1081px/2 + 0.5px);*/ + top: 176px; + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .title_and_cat_title { + /* Title + Description */ + + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 20px; + + width: 1081px; + min-height: 202px; + + + /* Inside auto layout */ + flex: none; + order: 0; + align-self: stretch; + flex-grow: 0; + width: 90%; + margin-left: auto; + margin-right: auto; + + } + + .title_and_cat_title_text1 { + /* Des fonctionnalités pensées pour simplifier la gestion de vos formations. */ + + width: 90%; + min-height: 134px; + + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 56px; + line-height: 120%; + /* or 67px */ + text-align: center; + + /* Foundation /Blue/Darker */ + color: #16274F; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + margin-left: auto; + margin-right: auto; + + } + + .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. */ + + + height: 48px; + + /* Commons/Body/Body - L */ + font-family: 'Inter'; + font-style: normal; + font-weight: 400; + font-size: 16px; + line-height: 24px; + /* or 150% */ + text-align: center; + + /* Foundation /Blue-Grey/Normal */ + color: #4B5162; + + opacity: 0.8; + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + width: 80%; + margin-left: auto; + margin-right: auto; + + } + + .title_and_cat_title_cat { + /* CTA's */ + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 0px; + gap: 80px; + + + height: 48px; + + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + + width: 40%; + margin-left: auto; + margin-right: auto; + + + + } + + .title_and_cat_title_cat_bton_demo { + /* Button text */ + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 12px 20px; + + width: 207px; + height: 48px; + + /* Foundation /Blue/Normal */ + background: #3E6EE3; + border-radius: 200px; + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + cursor: pointer; + } + + .title_and_cat_title_cat_bton_demo_txt { + /* Text */ + + width: 151px; + height: 20px; + + /* Button/Base - Bold */ + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 122%; + /* identical to box height, or 20px */ + + /* Foundation/White */ + color: #FFFFFF; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + + + } + + + .title_and_cat_title_cat_bton_tarif { + /* Button text */ + + box-sizing: border-box; + + /* Auto layout */ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 12px 20px; + + width: 217px; + height: 48px; + + /* Foundation /Blue-Grey/Light :active */ + border: 1px solid #FFF; + backdrop-filter: blur(6px); + /* Note: backdrop-filter has minimal browser support */ + border-radius: 200px; + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + background: #FFF; + cursor: pointer; + + } + + .title_and_cat_title_cat_bton_tarif_txt { + /* Text */ + + width: 161px; + height: 20px; + + /* Button/Base - Bold */ + font-family: 'DM Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 122%; + /* identical to box height, or 20px */ + + /* Foundation /Blue-Grey/Normal */ + color: #4B5162; + + + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + + } + + .Card_Title_block1 { + display: flex; + flex-direction: column; + gap: 4px; + width: 100%; + min-width: 280px; + align-items: center; + padding: 20px 0; + } + + .Card_Title_block2 { + font-family: DM Sans; + font-size: 16px; + font-weight: 700; + line-height: 16px; + text-align: center; + color: #3e6ee3; + text-transform: uppercase; + } + + + .Card_Title_block3 { + font-family: DM Sans; + font-size: 40px; + font-weight: 700; + line-height: 48px; + text-align: center; + color: #16274f; + } + + .ListCard_cardStyle { + width: 100%; + max-width: 270px; + min-height: 304px; + display: flex; + flex-direction: column; + padding: 40px 16px; + gap: 24px; + background: #ecf1fc1a; + border-radius: 12px; + border: 1px solid #3e6ee3; + box-sizing: border-box; + } + + .ListCard_imageContainerStyle { + display: flex; + justify-content: center; + align-items: center; + + } + + .ListCard_imageStyle { + width: 88px; + height: 88px; + object-fit: contain; + } + + .ListCard_contentStyle { + width: 100%; + display: flex; + flex-direction: column; + gap: 16px; + align-items: center; + } + + .ListCard_titleStyle { + font-family: DM Sans, sans-serif; + font-size: 20px; + font-weight: 700; + line-height: 24px; + color: #16274f; + text-align: center; + } + + + .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; + + } + + .ListCard_buttonHoverStyle { + background: #f5f5f5; + + } + + + .ButtonText_buttonStyle { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 12px 20px; + border-radius: 200px; + border: 1px solid #c7c9ce; + background: inherit; + min-width: 133px; + height: 48px; + cursor: pointer; + transition: all 0.2s ease-in-out; + box-sizing: border-box; + } + + + + .ButtonText_textStyle { + color: #4b5162; + font-family: DM Sans; + font-size: 16px; + font-weight: 700, ; + line-height: '122%'; + text-align: 'center'; + } + + + .WhyUsLayout_block1 { + width: 100%; + display: flex; + flex-direction: column; + padding: 50px; + gap: 48px; + + } + + .WhyUsLayout_block2 { + flex-grow: 1; + display: flex; + flex-direction: row; + gap: 24px; + justify-content: center; + } + + .LogoCloud_block1 { + display: flex; + flex-direction: column; + padding: 50px 112px; + gap: 40px; + background: #FFFFFF; + width: 100%; + align-items: center; + } + + .LogoCloud_h2 { + font-family: DM Sans; + font-size: 32px; + font-weight: 700; + line-height: 120%; + color: #16274f; + text-align: center; + margin: 0; + width: 100%; + } + + + .LogoCloud_cb1 { + /* Slider logos */ + + width: 1206px; + height: 72px; + + + /* Inside auto layout */ + flex: none; + order: 1; + flex-grow: 0; + overflow: hidden; + + } + + .LogoCloud_cb2 { + /* Auto layout */ + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 56px; + width: 1206px; + height: 72px; + left: calc(50% - 1206px/2); + top: 0px; + + mix-blend-mode: luminosity; + } + + .LogoCloud_cb2_logo { + width: 162.16px; + height: 57.66px; + /* Inside auto layout */ + flex: none; + order: 0; + flex-grow: 0; + + } + + .LogoCloud_block2 { + width: 1206px; + height: 72px; + display: flex; + justify-content: center; + align-items: center; + } + + .VisionSection_block1 { + display: flex; + flex-direction: column; + align-items: center; + gap: 40px; + padding: 40px 0 80px; + width: 100%; + } + + .VisionSection_section_img { + width: 1116px; + height: 500px; + background-size: cover; + background: #d9d9d9; + background-image: url("./img/img_a_propos_main.jpg"); + } + + .VisionSection_content_section { + width: 888px; + display: flex; + flex-direction: column; + gap: 40px; + align-items: center; + } + + + .VisionSection_title { + width: 655px; + display: flex; + flex-direction: column; + gap: 4px; + text-align: center; + + } + + + .VisionSection_title_span { + color: #3E6EE3; + font-family: DM Sans; + font-size: 16px; + font-weight: 700; + line-height: 16px; + text-transform: uppercase; + } + + .VisionSection_title_h2 { + color: #16274F; + font-family: DM Sans; + font-size: 40px; + font-weight: 700; + line-height: 120%; + margin: 20px 0 0 0; + } + + + .VisionSection_description { + color: #4B5162; + font-family: Inter; + font-size: 16px; + font-weight: 400; + line-height: 24px; + opacity: 0.8; + text-align: center; + margin: 0; + } + + + .VisionSection_buton { + padding: 12px 20px; + border-radius: 200px; + border: 1px solid #C7C9CE; + background: transparent; + color: #4B5162; + font-family: DM Sans; + font-size: 16px; + font-weight: 700; + line-height: 122%; + cursor: pointer; + transition: all 0.3s ease; + } + + .KeyMetrics_containerStyle { + display: flex; + flex-direction: column; + align-items: center; + padding: 100px 0; + width: 100%; + background: linear-gradient(0deg, rgba(196, 200, 238, 0.1), rgba(196, 200, 238, 0.1)), #FFFFFF; + } + + .KeyMetrics_headerStyle { + display: flex; + flex-direction: column; + align-items: center; + gap: 4px; + margin-bottom: 40px; + + } + + + .KeyMetrics_subtitleStyle { + font-family: DM Sans; + font-size: 16px; + font-weight: 700; + color: #0aa690; + text-transform: uppercase; + text-align: center; + line-height: 16px; + + } + + .KeyMetrics_titleStyle { + font-family: DM Sans; + font-size: 40px; + font-weight: 700; + color: #16274f; + text-align: center; + line-height: 120%; + max-width: 679px; + margin: 20px 0 0 0; + } + + .KeyMetrics_metricsContainerStyle { + display: flex; + flex-direction: row; + gap: 20px; + justify-content: center; + max-width: 1116px; + width: 100%; + + } + + .KeyMetrics_metricStyle { + display: flex; + flex-direction: column; + gap: 8px; + width: 260px; + align-items: center; + + } + + .KeyMetrics_valueStyle { + font-family: Plus Jakarta Sans; + font-size: 60px; + font-weight: 700; + color: #0aa690; + text-align: center; + line-height: 70px; + margin: 0; + } + + .KeyMetrics_descriptionStyle { + font-family: Inter; + font-size: 14px; + font-weight: 400; + color: #16274f; + text-align: center; + line-height: 160%; + margin: 0; + white-space: 'pre-line'; + } + + .Features_container { + padding: 100px 80px; + display: flex; + flex-direction: column; + align-items: center; + gap: 48px; + background: #FFFFFF; + } + + .Features_titleContainer { + display: flex; + flex-direction: column; + align-items: center; + gap: 4px; + width: 100%; + } + + .Features_subtitle { + font-family: DM Sans; + font-size: 16px; + font-weight: 700; + color: #ecae49; + text-align: center; + text-transform: uppercase; + line-height: 16px; + } + + .Features_title { + font-family: DM Sans; + font-size: 40px; + font-weight: 700; + color: #16274f; + text-align: center; + line-height: 120%; + margin: 20px 0 0 0; + } + + .Features_cardContainer { + display: flex; + flex-direction: row; + gap: 24px; + width: 100%; + justify-content: center; + } + + + .Features_card { + width: 270px; + padding: 48px 16px; + display: flex; + flex-direction: column; + align-items: center; + gap: 24px; + background: #fdf6ec1a; + border-radius: 12px; + border: 1px solid #ecae49, + } + + .Features_iconWrapper { + width: 88px; + height: 88px; + display: flex; + justify-content: center; + align-items: center; + } + + .Features_icon { + width: 88px; + height: 88px; + } + + .Features_content { + display: flex; + flex-direction: column; + align-items: center; + gap: 8px; + width: 100%; + } + + .Features_cardTitle { + font-family: DM Sans; + font-size: 20px; + font-weight: 700; + color: #16274f; + text-align: center; + line-height: 24px; + margin: 0; + } + + .Features_description { + font-family: Inter; + font-size: 14px; + font-weight: 400; + color: #4b5162; + text-align: center; + line-height: 160%; + opacity: 0.8; + margin: 0; + } + + .Features_button { + padding: 12px 20px; + border-radius: 200px; + border: 1px solid #c7c9ce; + background: transparent; + font-family: DM Sans; + font-size: 16px; + font-weight: 700; + color: #4b5162; + cursor: pointer; + transition: all 0.2s ease; + } + + + + } + +} \ No newline at end of file diff --git a/src/components/a_propos_automatic_files/new_a_propos.js b/src/components/a_propos_automatic_files/new_a_propos.js new file mode 100644 index 0000000..939a296 --- /dev/null +++ b/src/components/a_propos_automatic_files/new_a_propos.js @@ -0,0 +1,77 @@ +import React, { useRef, useState, useEffect } from "react"; +import moment from "moment"; +import "./new_a_propos.css"; + +import WhyUsLayout from './WhyUsLayout.js'; +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'; + +const New_C_A_Propos_2025 = (props) => { + + return ( + +
+
+
+ +
+
+ Votre partenaire pour des formations &
une gestion simplifiée. +
+ +
+ 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. +
+
+ +
+ +
{ + e.preventDefault(); + var date2 = new Date(); + const format2 = "YYYY-MM"; + var dateTime2 = moment(date2).format(format2); + window.open( + "https://calendly.com/mysytraining/demo-mysy-training-solution?month=" + String(dateTime2), + '_blank' + ); + }}> + +
+ +
{ + + window.open( + "/new_contact/", + '_self' + ); + }}> + +
+
+
+
+ + + + + + + + + + + + + + +
+ ) + +} + + +export default New_C_A_Propos_2025; \ No newline at end of file diff --git a/src/components/fonctionalites_automatic_files/new_fonctionnalites_2025.js b/src/components/fonctionalites_automatic_files/new_fonctionnalites_2025.js index 3658a00..8ab49ec 100644 --- a/src/components/fonctionalites_automatic_files/new_fonctionnalites_2025.js +++ b/src/components/fonctionalites_automatic_files/new_fonctionnalites_2025.js @@ -1,11 +1,8 @@ import React, { useRef, useState, useEffect } from "react"; import moment from "moment"; import "./new_fonctionalites_2025.css"; -import "./ContentSection.js"; -import "./ELearningSection.js"; -import "./ContentSection.js"; -import "./ContentSection.js"; + import FeaturesLayout from './FeaturesLayout.js'; import ContentSection from './ContentSection'; import Badge_Fonctionnalite from './Badge_Fonctionnalite'; diff --git a/src/index.css b/src/index.css index bb9c966..6032628 100644 --- a/src/index.css +++ b/src/index.css @@ -6,7 +6,7 @@ body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; - font-family: 'DM Sans', 'Inter'; + font-family: 'DM Sans', 'Inter', 'Plus Jakarta Sans'; } diff --git a/src/pages/new_p_test_header_footer_2025.js b/src/pages/new_p_test_header_footer_2025.js index 0863acc..03f0075 100644 --- a/src/pages/new_p_test_header_footer_2025.js +++ b/src/pages/new_p_test_header_footer_2025.js @@ -6,22 +6,11 @@ import New_C_Footer_2025 from "../components/New_C_Footer_2025"; import New_C_Footer_2025_V2 from "../components/footer_automatic_files/Layout"; import New_C_Footer_Without_Testimony_2025_V2 from "../components/footer_automatic_files/Layout_Without_Testimony"; import New_C_Header_2025_V2 from "../components/header_automatic_files/Header"; -import New_C_Tatif_Section from "../components/tarif_section_automatic_files/PricingSection"; - -import New_C_Detail_Formation_Automatic_Files from "../components/detail_formation_automatic_files/new_detail_formation_2025" - -import New_C_Article_Detail_2025 from "../components/New_C_Article_Detail_2025"; import New_Navigation_2025 from "../components/New_Navigation_2025"; -import New_C_Tarif_Section_Head from "../components/tarif_head_automatic_files/PricingLayout" -import New_C_Contact_2025 from "../components/contact_automatic_files/Contact_Layout"; - -import New_C_Marketplace_2025 from "../components/marketplace_automatic_files/new_marketplace_2025"; - - -import New_C_Fonctionnalites_2025 from "../components/fonctionalites_automatic_files/new_fonctionnalites_2025"; +import New_C_A_Propos_2025 from "../components/a_propos_automatic_files/new_a_propos"; const new_p_test_header_footer_2025 = () => { @@ -31,7 +20,7 @@ const new_p_test_header_footer_2025 = () => { - +