diff --git a/README.md b/README.md index 9e2c62a..ca583d6 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,6 @@ ## For V1 : - Revoir les titres de section (+espace au dessus des titres) -- Revoir ma section experiences ## For V2 : - Mettre la base de donnée en place diff --git a/public/assets/images/proxmox/proxmox_5.png b/public/assets/images/proxmox/proxmox_5.png index fe4f08c..c968f4b 100644 Binary files a/public/assets/images/proxmox/proxmox_5.png and b/public/assets/images/proxmox/proxmox_5.png differ diff --git a/src/components/Experiences.jsx b/src/components/Experiences.jsx index 4e64680..8a79d11 100644 --- a/src/components/Experiences.jsx +++ b/src/components/Experiences.jsx @@ -4,7 +4,6 @@ import SingleExperience from './SingleExperience'; function Experiences() { const experiencesData = [ { - id: 1, role: "Web Development Intern", company: "Pandora", duration: "April 2024", @@ -16,7 +15,6 @@ function Experiences() { ] }, { - id: 2, role: "IT Support Intern", company: "INRAE", duration: "April 2023", @@ -34,8 +32,8 @@ function Experiences() {

Experiences

- {experiencesData.map((exp, index) => ( - + {experiencesData.map((exp) => ( + ))}
diff --git a/src/components/SingleExperience.jsx b/src/components/SingleExperience.jsx index 733ae2c..0e74bab 100644 --- a/src/components/SingleExperience.jsx +++ b/src/components/SingleExperience.jsx @@ -1,22 +1,21 @@ import '../styles/SingleExperience.css'; -function SingleExperience({ experience, whichSide }) { +function SingleExperience({ experience }) { return ( -
-
-
-

{experience.role}

-

- {experience.company} • {experience.location} -

-
+
+
+

{experience.company}

+

{experience.location}

{experience.duration}

-
    - {experience.tasks.map((task, index) => ( -
  • {task}
  • - ))} -
+
+

{experience.role}

+
    + {experience.tasks.map((task, index) => ( +
  • {task}
  • + ))} +
+
); } diff --git a/src/styles/Experiences.css b/src/styles/Experiences.css index f7729d8..e7b9a2c 100644 --- a/src/styles/Experiences.css +++ b/src/styles/Experiences.css @@ -3,23 +3,22 @@ flex-direction: column; align-items: center; width: 100%; - scroll-margin-top: 40px; } .experiences-container { - width: 90%; + width: 50%; position: relative; display: flex; flex-direction: column; align-items: center; } - .experiences-container::before { content: ''; position: absolute; + left: 50%; transform: translateX(-50%); width: 2px; height: 100%; background-color: rgba(176, 176, 176, 0.2); -} \ No newline at end of file +} diff --git a/src/styles/SingleExperience.css b/src/styles/SingleExperience.css index 35b4631..f5bc9a2 100644 --- a/src/styles/SingleExperience.css +++ b/src/styles/SingleExperience.css @@ -1,40 +1,39 @@ .experience-card { position: relative; - width: 50%; + width: 100%; margin-bottom: 3rem; - box-sizing: border-box; - border-radius: 12px; - background-color: rgba(255, 255, 255, 0.03); - transition: all 0.3s ease; padding: 1.5rem; -} - -.experience-card.left { - align-self: flex-start; - border-left: 3px solid #D95F46; -} - -.experience-card.right { - align-self: flex-end; - border-right: 3px solid #D95F46; -} - -.experience-card:hover { - transform: translateY(-5px); - background-color: rgba(255, 255, 255, 0.05); -} - -.experience-card-header { display: flex; - justify-content: space-between; - align-items: flex-start; - gap: 1rem; - margin-bottom: 1rem; } -.experience-card-header-left { - display: flex; - flex-direction: column; +.experience-card::before { + content: ''; + position: absolute; + top: 25px; + left: 50%; + transform: translateX(-50%); + width: 15px; + height: 15px; + border-radius: 50%; + background-color: #D95F46; + border: 3px solid rgba(176, 176, 176, 0.2); +} + + +.experience-card-left { + width: 50%; + text-align: end; + margin-right: 8rem; +} + +.experience-card-right { + width: 50%; +} + +.experience-company { + color: #D95F46; + font-size: 1.2rem; + margin: 0; } .experience-role { @@ -43,9 +42,6 @@ color: #EAEAEA; margin: 0; } -.experience-location{ - font-weight: 600; -} .experience-location, .experience-duration { @@ -53,7 +49,6 @@ color: #B0B0B0; margin: 0.25rem 0 0; white-space: nowrap; - } .experience-tasks { @@ -64,15 +59,19 @@ .experience-tasks li { position: relative; - padding-left: 1.2rem; + padding-left: 1.5rem; margin-bottom: 0.5rem; color: #B0B0B0; + text-align: left; } .experience-tasks li::before { content: '›'; position: absolute; left: 0; + top: 0; color: #D95F46; font-weight: bold; -} + font-size: 1.2rem; + line-height: 1; +} \ No newline at end of file diff --git a/src/styles/SingleProject.css b/src/styles/SingleProject.css index 0421a0b..583a373 100644 --- a/src/styles/SingleProject.css +++ b/src/styles/SingleProject.css @@ -20,9 +20,9 @@ width: 100%; display: flex; justify-content: center; - align-items: center; + align-items: start; overflow: hidden; - max-height: 225px; + height: 210px; } .single-project-left img { @@ -32,7 +32,6 @@ transition: opacity 0.3s ease-in-out; opacity: 1; object-fit: cover; - } .single-project-left img.fade-out {