diff --git a/src/components/careerPage/Occupation.js b/src/components/careerPage/Occupation.js index f6fd0a6..f8b6d26 100644 --- a/src/components/careerPage/Occupation.js +++ b/src/components/careerPage/Occupation.js @@ -40,31 +40,33 @@ function Occupation({ t }) { )} -
-

-
- {occupation.projects && ( -
-

- {occupation.projects.map((project, index) => ( -

navigate(`/projects/${project}`)}>{t(project)}

- ))} +
+
+

- )} - {occupation.skills && ( -
-

-
- {occupation.skills.map((tool) => { - return ( -
-

-
- ); - })} + {occupation.projects && ( +
+

+ {occupation.projects.map((project, index) => ( +

navigate(`/projects/${project}`)}>{t(project)}

+ ))}
-
- )} + )} + {occupation.skills && ( +
+

+
+ {occupation.skills.map((tool) => { + return ( +
+

+
+ ); + })} +
+
+ )} +
diff --git a/src/components/careerPage/css/Occupation.css b/src/components/careerPage/css/Occupation.css index 361402f..85f4e9d 100644 --- a/src/components/careerPage/css/Occupation.css +++ b/src/components/careerPage/css/Occupation.css @@ -28,12 +28,12 @@ max-width: 15vw; } -.colorprimary { - text-align: start; - box-shadow: inset 0 0 0 0 var(--color-text-primary); - color: var(--color-text-primary); - transition: color .5s ease-in-out, box-shadow .5s ease-in-out; - font-size: var(--font-link); + +.occupation-content { + display: flex; + flex-direction: column; + gap: 1rem; + max-width: 40vw; } .occupation-description { @@ -46,13 +46,10 @@ } .skills-tools { - justify-content: center; + justify-content: space-between; } .title { - margin: auto; - text-align: center; - width: auto; justify-content: start; }