Octopusdesign/Octopus-React-Wp
Template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Templates des services

Browse Source
This commit is contained in:
sebvtl728
2025-01-08 21:27:24 +01:00
parent 7d2863e2d0
commit a97011c484
5 changed files with 118 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/Header.jsx
+19 -42
View File
@@ -102,31 +102,12 @@ const Header = () => {
onClick={toggleDrawer(true)}
sx={{
display: { xs: "block", md: "none" },
color: " #ffffff"
color: " #ffffff",
}}
>
<MenuIcon />
</IconButton>
{/* Logo as Home Link */}
{/* <Typography
variant="h6"
component={Link}
to="/"
sx={{
flexGrow: 1,
textAlign: { xs: "center", md: "left" },
fontWeight: "bold",
textDecoration: "none",
color: "white",
"&:hover": {
color: "#00bcd4",
},
}}
>
Mon Site React
</Typography> */}
{/* Logo */}
<Box
component={Link}
@@ -152,7 +133,6 @@ const Header = () => {
{/* Navigation Links */}
<Box sx={{ display: { xs: "none", md: "flex" }, gap: 2 }}>
{/* Services Dropdown */}
<Button
color="inherit"
@@ -182,11 +162,11 @@ const Header = () => {
>
<MenuItem
component={Link}
to="/services/formation-web"
to="/services/prestation-maitrise-oeuvre"
onClick={handleMenuClose}
>
<WorkIcon sx={{ marginRight: 1 }} />
Formation Web
Prestation maitrise oeuvre
</MenuItem>
<MenuItem
component={Link}
@@ -298,8 +278,6 @@ const Header = () => {
</IconButton>
</Box>
{/* Drawer for mobile */}
<Drawer anchor="left" open={drawerOpen} onClose={toggleDrawer(false)}>
<Box
@@ -314,13 +292,9 @@ const Header = () => {
onKeyDown={toggleDrawer(false)}
>
<Box
sx={{
display:"block",
display: "block",
textAlign: "center",
}}
>
<img
@@ -346,8 +320,9 @@ const Header = () => {
to="/"
selected={location.pathname === "/"}
>
<HomeIcon sx={{
marginRight: 1,
<HomeIcon
sx={{
marginRight: 0.5,
}}
/>
<ListItemText primary="Accueil" />
@@ -355,11 +330,11 @@ const Header = () => {
<ListItem
button
component={Link}
to="/services/formation-web"
selected={location.pathname.includes("/services/formation-web")}
to="/services/prestation-maitrise-oeuvre"
selected={location.pathname.includes("/services/prestation-maitrise-oeuvre")}
>
<WorkIcon sx={{ marginRight: 1 }} />
<ListItemText primary="Formation Web" />
<WorkIcon sx={{ marginRight: 0.5 }} />
<ListItemText primary="Prestation maitrise oeuvre" />
</ListItem>
<ListItem
button
@@ -367,16 +342,18 @@ const Header = () => {
to="/services/formation-ia"
selected={location.pathname.includes("/services/formation-ia")}
>
<WorkIcon sx={{ marginRight: 1 }} />
<WorkIcon sx={{ marginRight: 0.5 }} />
<ListItemText primary="Formation IA" />
</ListItem>
<ListItem
button
component={Link}
to="/services/formation-video"
selected={location.pathname.includes("/services/formation-video")}
selected={location.pathname.includes(
"/services/formation-video"
)}
>
<WorkIcon sx={{ marginRight: 1 }} />
<WorkIcon sx={{ marginRight: 0.5 }} />
<ListItemText primary="Formation Video" />
</ListItem>
<ListItem
@@ -385,7 +362,7 @@ const Header = () => {
to="/posts"
selected={location.pathname === "/posts"}
>
<ArticleIcon sx={{ marginRight: 1 }} />
<ArticleIcon sx={{ marginRight: 0.5 }} />
<ListItemText primary="Réalisations" />
</ListItem>
<ListItem
@@ -394,7 +371,7 @@ const Header = () => {
to="/about"
selected={location.pathname === "/about"}
>
<InfoIcon sx={{ marginRight: 1 }} />
<InfoIcon sx={{ marginRight: 0.5 }} />
<ListItemText primary="À propos" />
</ListItem>
<ListItem
@@ -403,7 +380,7 @@ const Header = () => {
to="/contact"
selected={location.pathname === "/contact"}
>
<ContactMailIcon sx={{ marginRight: 1 }} />
<ContactMailIcon sx={{ marginRight: 0.5 }} />
<ListItemText primary="Contact" />
</ListItem>
</List>
frontend/src/components/Pages/FormationIA.jsx → frontend/src/components/Pages/ServiceDeux.jsx
+2 -2
View File
@@ -1,7 +1,7 @@
import React from 'react';
import ServicePageTemplate from '../ServicePageTemplate';
const FormationIA = () => {
const ServiceDeux = () => {
const serviceDetails = {
title: 'Formation IA',
subtitle: 'Dominez l’intelligence artificielle.',
@@ -52,4 +52,4 @@ const FormationIA = () => {
return <ServicePageTemplate {...serviceDetails} />;
};
export default FormationIA;
export default ServiceDeux;
frontend/src/components/Pages/ServiceTrois.jsx
+55
View File
@@ -0,0 +1,55 @@
import React from 'react';
import ServicePageTemplate from '../ServicePageTemplate';
const ServiceTrois = () => {
const serviceDetails = {
title: 'Formation IA',
subtitle: 'Dominez l’intelligence artificielle.',
description:
'Plongez dans le futur ! Notre formation IA vous prépare aux outils modernes d’intelligence artificielle comme Python, TensorFlow et OpenAI API. Apprenez à créer des modèles IA performants.',
features: [
{
title: 'Fondamentaux de l’IA',
description: 'Concepts, algorithmes et applications.',
modalText: 'Découvrez les bases de l’IA, des algorithmes aux applications concrètes dans divers domaines.',
modalImage: 'https://picsum.photos/id/200/800/400.webp',
},
{
title: 'Python pour l’IA',
description: 'Bibliothèques populaires : TensorFlow, PyTorch.',
modalText: 'Apprenez à utiliser Python et ses bibliothèques pour concevoir des modèles d’IA puissants.',
modalImage: 'https://picsum.photos/id/201/800/400.webp',
},
{
title: 'Projets Pratiques',
description: 'Créez vos propres modèles IA.',
modalText: 'Mettez vos compétences en pratique en développant des projets IA réels.',
modalImage: 'https://picsum.photos/id/202/800/400.webp',
},
],
image: 'https://picsum.photos/id/239/1920/1080.webp',
ctaText: 'Découvrir la formation IA',
ctaLink: '/contact',
carouselItems: [
{
title: 'Site E-commerce',
description: 'Un projet e-commerce performant et moderne.',
image: 'https://picsum.photos/id/453/800/400.webp',
},
{
title: 'Portfolio Personnel',
description: 'Montrez vos compétences avec un portfolio sur mesure.',
image: 'https://picsum.photos/id/454/800/400.webp',
},
{
title: 'Blog Dynamique',
description: 'Créez un blog interactif et optimisé pour le SEO.',
image: 'https://picsum.photos/id/455/800/400.webp',
},
],
};
return <ServicePageTemplate {...serviceDetails} />;
};
export default ServiceTrois;
frontend/src/components/Pages/FormationWeb.jsx → frontend/src/components/Pages/ServiceUn.jsx
+3 -3
View File
@@ -1,9 +1,9 @@
import React from 'react';
import ServicePageTemplate from '../ServicePageTemplate';
const FormationWeb = () => {
const ServiceUn = () => {
const serviceDetails = {
title: 'Formation Web',
title: 'Prestation-maitrise-oeuvre',
subtitle: 'Apprenez à maîtriser les technologies du web.',
description:
'Notre formation web vous permet de développer vos compétences en développement frontend, backend et design. Rejoignez notre programme pour apprendre HTML, CSS, JavaScript et bien plus.',
@@ -47,4 +47,4 @@ const FormationWeb = () => {
return <ServicePageTemplate {...serviceDetails} />;
};
export default FormationWeb;
export default ServiceUn;
frontend/src/main.jsx
+6 -4
View File
@@ -16,8 +16,9 @@ import Search from "./components/Pages/Search"; // Nouveau composant pour la rec
import Header from "./components/Header";
// Import des services
import FormationWeb from "./components/Pages/FormationWeb";
import FormationIA from "./components/Pages/FormationIA";
import ServiceUn from "./components/Pages/ServiceUn.jsx";
import ServiceDeux from "./components/Pages/ServiceDeux.jsx";
import ServiceTrois from "./components/Pages/ServiceTrois.jsx";
function App() {
return (
@@ -40,8 +41,9 @@ ReactDOM.createRoot(document.getElementById("root")).render(
<Route path="/contact" element={<Contact />} />
<Route path="/search" element={<Search />} /> {/* Route pour les recherches */}
{/* Routes pour les services */}
<Route path="/services/formation-web" element={<FormationWeb />} />
<Route path="/services/formation-ia" element={<FormationIA />} />
<Route path="/services/prestation-maitrise-oeuvre" element={<ServiceUn />} />
<Route path="/services/formation-ia" element={<ServiceDeux />} />
<Route path="/services/formation-video" element={<ServiceTrois />} />
</Routes>
</Router>
</HelmetProvider>