From 995305ff59ad0e3e6b5497e2ec7867c547fa6506 Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Tue, 20 Aug 2024 19:21:45 -0400
Subject: [PATCH 02/34] fix: On hover experience element
---
src/Components/Experience/ExperienceTimeline.scss | 12 ++++--------
1 file changed, 4 insertions(+), 8 deletions(-)
diff --git a/src/Components/Experience/ExperienceTimeline.scss b/src/Components/Experience/ExperienceTimeline.scss
index 1287f5b..12b4f8b 100644
--- a/src/Components/Experience/ExperienceTimeline.scss
+++ b/src/Components/Experience/ExperienceTimeline.scss
@@ -34,22 +34,18 @@ $font-color: #a2aa94;
rgba(255, 255, 255, 0) 0%,
rgba(245, 245, 245, 0.1) 200%
);
+ background-size: 200% 100%;
+ background-position: left;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
overflow: hidden;
position: relative;
transform-origin: left center;
+ transition: background-position 0.3s ease-in-out, transform 0.3s ease-in-out;
&:hover {
- background: linear-gradient(
- 90deg,
- rgba(255, 255, 255, 0.1) 0%,
- rgba(245, 245, 245, 0.2) 200%
- );
+ background-position: right;
transform: translateY(-5px);
- transition:
- transform 0.3s ease-in-out,
- background 0.3s ease-in-out;
}
.timeline-content {
From 141705f5dae478f196e6b3b616943b25b4f55a12 Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Tue, 20 Aug 2024 19:24:05 -0400
Subject: [PATCH 03/34] style: Rename component
---
src/App.tsx | 4 ++--
.../{Test-Onepager/OnePager.tsx => Content/Content.tsx} | 4 ++--
2 files changed, 4 insertions(+), 4 deletions(-)
rename src/Components/{Test-Onepager/OnePager.tsx => Content/Content.tsx} (83%)
diff --git a/src/App.tsx b/src/App.tsx
index 067750f..d1b3bbf 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -8,13 +8,13 @@ import Navbar from './Components/Navbar';
import './App.scss';
import Footer from './Components/Footer/Footer';
-import OnePager from './Components/Test-Onepager/OnePager';
+import Content from './Components/Content/Content';
const App: React.FC = () => {
return (
-
+
);
diff --git a/src/Components/Test-Onepager/OnePager.tsx b/src/Components/Content/Content.tsx
similarity index 83%
rename from src/Components/Test-Onepager/OnePager.tsx
rename to src/Components/Content/Content.tsx
index 812f86d..4d453f8 100644
--- a/src/Components/Test-Onepager/OnePager.tsx
+++ b/src/Components/Content/Content.tsx
@@ -4,7 +4,7 @@ import Projects from '../Projects/Projects';
import Experience from '../Experience/Experience';
import About from '../About/About';
-const OnePager: React.FC = () => {
+const Content: React.FC = () => {
return (
@@ -15,4 +15,4 @@ const OnePager: React.FC = () => {
);
};
-export default OnePager;
+export default Content;
From f671599084d03d7c2f4614f5bf3684b35340a3cf Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Tue, 20 Aug 2024 19:24:33 -0400
Subject: [PATCH 04/34] style: Cleaning up
---
src/App.tsx | 10 ++--------
1 file changed, 2 insertions(+), 8 deletions(-)
diff --git a/src/App.tsx b/src/App.tsx
index d1b3bbf..89c2d2c 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,14 +1,8 @@
import React from 'react';
-import Hero from './Components/Home/Hero/Hero';
-import Project from './Components/Projects/Projects';
-import About from './Components/About/About';
-import Experience from './Components/Experience/Experience';
-import { Route, Routes } from 'react-router-dom';
import Navbar from './Components/Navbar';
-import './App.scss';
-import Footer from './Components/Footer/Footer';
-
import Content from './Components/Content/Content';
+import Footer from './Components/Footer/Footer';
+import './App.scss';
const App: React.FC = () => {
return (
From 655f5ed200726f96b281e922c38479a28fd37207 Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Tue, 20 Aug 2024 19:25:30 -0400
Subject: [PATCH 05/34] style: Moving things around
---
src/Components/{ => Navbar}/Navbar.scss | 0
src/Components/{ => Navbar}/Navbar.tsx | 2 +-
src/Components/Spacer.tsx | 0
3 files changed, 1 insertion(+), 1 deletion(-)
rename src/Components/{ => Navbar}/Navbar.scss (100%)
rename src/Components/{ => Navbar}/Navbar.tsx (95%)
create mode 100644 src/Components/Spacer.tsx
diff --git a/src/Components/Navbar.scss b/src/Components/Navbar/Navbar.scss
similarity index 100%
rename from src/Components/Navbar.scss
rename to src/Components/Navbar/Navbar.scss
diff --git a/src/Components/Navbar.tsx b/src/Components/Navbar/Navbar.tsx
similarity index 95%
rename from src/Components/Navbar.tsx
rename to src/Components/Navbar/Navbar.tsx
index 4f5d1d9..1556634 100644
--- a/src/Components/Navbar.tsx
+++ b/src/Components/Navbar/Navbar.tsx
@@ -1,7 +1,7 @@
import React, { useState } from 'react';
import { NavLink } from 'react-router-dom';
import { FaBars, FaTimes } from 'react-icons/fa';
-import { links } from './Data/navbarLinks';
+import { links } from '../Data/navbarLinks';
import './Navbar.scss';
const Navbar: React.FC = () => {
diff --git a/src/Components/Spacer.tsx b/src/Components/Spacer.tsx
new file mode 100644
index 0000000..e69de29
From be21bf1261782b3808a60c14138e720c11c50425 Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Tue, 20 Aug 2024 19:37:39 -0400
Subject: [PATCH 06/34] fix: Import
---
src/App.tsx | 2 +-
src/Components/Spacer.tsx | 0
2 files changed, 1 insertion(+), 1 deletion(-)
delete mode 100644 src/Components/Spacer.tsx
diff --git a/src/App.tsx b/src/App.tsx
index 89c2d2c..c2f35a1 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,5 +1,5 @@
import React from 'react';
-import Navbar from './Components/Navbar';
+import Navbar from './Components/Navbar/Navbar';
import Content from './Components/Content/Content';
import Footer from './Components/Footer/Footer';
import './App.scss';
diff --git a/src/Components/Spacer.tsx b/src/Components/Spacer.tsx
deleted file mode 100644
index e69de29..0000000
From 6621dd7826ac8b781562c24c56818584721ea3ef Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Tue, 20 Aug 2024 19:43:17 -0400
Subject: [PATCH 07/34] feat: Past experience
---
src/Components/Home/Hero/LeftContainer.tsx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/Components/Home/Hero/LeftContainer.tsx b/src/Components/Home/Hero/LeftContainer.tsx
index 7743b8b..7595853 100644
--- a/src/Components/Home/Hero/LeftContainer.tsx
+++ b/src/Components/Home/Hero/LeftContainer.tsx
@@ -12,7 +12,7 @@ const LeftContainer: React.FC = () => {
Date: Tue, 20 Aug 2024 19:50:44 -0400
Subject: [PATCH 08/34] feat: Improved size of experiences/education
---
.../Experience/ExperienceTimeline.scss | 60 +++++++++----------
1 file changed, 29 insertions(+), 31 deletions(-)
diff --git a/src/Components/Experience/ExperienceTimeline.scss b/src/Components/Experience/ExperienceTimeline.scss
index 12b4f8b..424f5ef 100644
--- a/src/Components/Experience/ExperienceTimeline.scss
+++ b/src/Components/Experience/ExperienceTimeline.scss
@@ -8,27 +8,27 @@ $font-color: #a2aa94;
.timeline {
position: relative;
- padding: 20px 0;
+ padding: 15px 0;
margin-left: 10px;
display: flex;
flex-direction: column;
align-items: flex-start;
@media (max-width: 768px) {
- margin-left: 20px;
+ margin-left: 15px;
}
@media (max-width: 430px) {
- margin-left: 15px;
- padding: 10px 0;
+ margin-left: 10px;
+ padding: 5px 0;
}
}
.timeline-item {
position: relative;
- margin-right: 20px;
- margin-bottom: 30px;
- padding-left: 20px;
+ margin-right: 15px;
+ margin-bottom: 20px;
+ padding-left: 15px;
background: linear-gradient(
90deg,
rgba(255, 255, 255, 0) 0%,
@@ -49,43 +49,41 @@ $font-color: #a2aa94;
}
.timeline-content {
- padding-left: 10px;
- margin-right: 20px;
+ padding-left: 10px;
+ margin-right: 10px;
color: $text-color;
border-left: 2px solid $primary-color;
h3 {
- font-size: 1.5em;
+ font-size: 1.5em;
margin-bottom: 3px;
color: darken($primary-color, 20%);
transition: color 0.3s ease-in-out;
@media (max-width: 768px) {
- font-size: 1.3em;
+ font-size: 1.3em;
}
@media (max-width: 430px) {
- font-size: 1.1em;
+ font-size: 1.1em;
}
}
p {
- font-size: 1em;
+ font-size: 1em;
color: lighten($font-color, 30%);
@media (max-width: 768px) {
- font-size: 0.9em;
+ font-size: 0.9em;
}
@media (max-width: 430px) {
- font-size: 0.8em;
+ font-size: 0.8em;
}
}
}
- .timeline-company {
- color: lighten($secondary-color, 10%);
- }
+ .timeline-company,
.timeline-institution {
color: lighten($secondary-color, 10%);
}
@@ -96,14 +94,14 @@ $font-color: #a2aa94;
.timeline-date {
margin-top: 5px;
- font-size: 0.9em;
+ font-size: 0.9em;
color: $quaternary-color;
}
}
.timeline-step {
position: absolute;
- left: -12px;
+ left: -10px;
top: 0;
height: 100%;
display: flex;
@@ -111,36 +109,36 @@ $font-color: #a2aa94;
}
.timeline-section {
- margin-left: 30px;
- margin-right: 30px;
+ margin-left: 20px;
+ margin-right: 20px;
}
.timeline-section-title {
- font-size: 2em;
+ font-size: 2em;
color: $text-color;
- margin-bottom: 15px;
- padding-left: 10px;
+ margin-bottom: 10px;
+ padding-left: 5px;
font-weight: bold;
@media (max-width: 768px) {
- font-size: 1.7em;
+ font-size: 1.7em;
}
@media (max-width: 430px) {
- font-size: 1.4em;
+ font-size: 1.4em;
}
}
.timeline-stats {
- margin-top: 10px;
- margin-bottom: 10px;
+ margin-top: 5px;
+ margin-bottom: 5px;
display: flex;
flex-direction: column;
.stat-item {
- font-size: 0.9em;
+ font-size: 0.9em;
color: $text-color;
- margin-bottom: 5px;
+ margin-bottom: 3px;
strong {
color: $primary-color;
From bb6fc665b97f10940a2dbefbc531daf75eebff12 Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Tue, 20 Aug 2024 19:57:43 -0400
Subject: [PATCH 09/34] style: Changing text
---
src/Components/Data/experience.ts | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
diff --git a/src/Components/Data/experience.ts b/src/Components/Data/experience.ts
index 4a4f7b4..ca51610 100644
--- a/src/Components/Data/experience.ts
+++ b/src/Components/Data/experience.ts
@@ -8,8 +8,8 @@ export const experience = [
},
{
date: 'March 2024 - Ongoing',
- title: 'Head Delegate Montreal',
- company: 'Canadian University Software Engineering Conference (CUSEC)',
+ title: 'HD Montreal',
+ company: 'CUSEC',
description:
'Leading the delegation of post-secondary students across Montreal for the annual conference.',
statsKey: 'Head Delegate Montreal',
@@ -19,7 +19,7 @@ export const experience = [
title: 'IT Intern',
company: 'Town of Kirkland',
description:
- 'Delivered technical support to government employees and received training in cybersecurity under the Cybersecurity Analyst of the municipality.',
+ 'Delivered technical support to government employees and trained under the Cybersecurity Lead of the municipality.',
statsKey: 'IT Intern',
},
{
From b455a9ff6b17481923015e9a62b4b1c5b046cda4 Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Tue, 20 Aug 2024 20:27:44 -0400
Subject: [PATCH 10/34] feat: Add tech stack to experience page
---
.../Experience/ExperienceTimeline.tsx | 358 ++++++++++++++----
1 file changed, 292 insertions(+), 66 deletions(-)
diff --git a/src/Components/Experience/ExperienceTimeline.tsx b/src/Components/Experience/ExperienceTimeline.tsx
index e455ce9..c694901 100644
--- a/src/Components/Experience/ExperienceTimeline.tsx
+++ b/src/Components/Experience/ExperienceTimeline.tsx
@@ -4,12 +4,63 @@ import { education } from '../Data/education';
import { experience } from '../Data/experience';
import { statistics } from '../Data/statistics';
import './ExperienceTimeline.scss';
+import {
+ FaPython,
+ FaJava,
+ FaJsSquare,
+ FaReact,
+ FaGitAlt,
+ FaDocker,
+ FaHtml5,
+ FaCss3Alt,
+ FaAws,
+ FaNodeJs,
+ FaSass,
+ FaPhp,
+ FaMarkdown,
+ FaAngular,
+ FaBootstrap,
+ FaFigma,
+ FaRaspberryPi,
+} from 'react-icons/fa';
+import {
+ SiCsharp,
+ SiSqlite,
+ SiKotlin,
+ SiDotnet,
+ SiXamarin,
+ SiTypescript,
+ SiJquery,
+ SiNextdotjs,
+ SiAzuredevops,
+ SiFirebase,
+ SiVercel,
+ SiCloudflare,
+ SiExpress,
+ SiTailwindcss,
+ SiNginx,
+ SiMongodb,
+ SiMysql,
+ SiMicrosoftsqlserver,
+ SiKeras,
+ SiPytorch,
+ SiScikitlearn,
+ SiPostman,
+ SiSwagger,
+ SiJira,
+ SiKubernetes,
+ SiCisco,
+ SiUnity,
+ SiMantine,
+ SiGnubash,
+ SiPowershell,
+} from 'react-icons/si';
const ExperienceTimeline = () => {
const controls = useAnimation();
useEffect(() => {
- controls.start(i => ({
+ controls.start((i) => ({
opacity: 1,
y: 0,
transition: { delay: i * 0.2 },
@@ -17,75 +68,250 @@ const ExperienceTimeline = () => {
}, [controls]);
return (
-
-
+
+
+
-
-
Education
- {education.map((item, index) => (
-
-
-
-
- {item.title} @
- {item.institution}
-
-
{item.date}
-
{item.description}
-
- {Object.entries(statistics[item.statsKey] || {}).map(
- ([key, value]: [string, number | string]) => (
-
- {value}{' '}
- {key.replace(/([A-Z])/g, ' $1').toLowerCase()}
-
- ),
- )}
+
+
Education
+ {education.map((item, index) => (
+
+
+
+
+ {item.title} @
+ {item.institution}
+
+
{item.date}
+
{item.description}
+
+ {Object.entries(statistics[item.statsKey] || {}).map(
+ ([key, value]: [string, number | string]) => (
+
+ {value}{' '}
+ {key.replace(/([A-Z])/g, ' $1').toLowerCase()}
+
+ ),
+ )}
+
-
- ))}
-
+
+ ))}
+
-
Experience
- {experience.map((item, index) => (
-
-
-
-
- {item.title} @
- {item.company}
-
-
{item.date}
-
{item.description}
-
- {Object.entries(statistics[item.statsKey] || {}).map(
- ([key, value]: [string, number | string]) => (
-
- {value}{' '}
- {key.replace(/([A-Z])/g, ' $1').toLowerCase()}
-
- ),
- )}
+
+
Experience
+ {experience.map((item, index) => (
+
+
+
+
+ {item.title} @
+ {item.company}
+
+
{item.date}
+
{item.description}
+
+ {Object.entries(statistics[item.statsKey] || {}).map(
+ ([key, value]: [string, number | string]) => (
+
+ {value}{' '}
+ {key.replace(/([A-Z])/g, ' $1').toLowerCase()}
+
+ ),
+ )}
+
-
- ))}
+
+ ))}
+
+
+
+
Languages
+
+ -
+ Python
+
+ -
+ Java
+
+ -
+ JavaScript
+
+ -
+ TypeScript
+
+ -
+ C#
+
+ -
+ Kotlin
+
+ -
+ PHP
+
+ -
+ PowerShell
+
+ -
+ Bash
+
+ -
+ Markdown
+
+ -
+ HTML
+
+ -
+ CSS
+
+ -
+ MSSQL
+
+ -
+ SQLite
+
+ -
+ MySQL
+
+
+
+
+
+
Frameworks & Libraries
+
+ -
+ ASP.NET
+
+ -
+ .NET MAUI
+
+ -
+ WPF
+
+ -
+ Xamarin
+
+ -
+ React
+
+ -
+ Next.js
+
+ -
+ jQuery
+
+ -
+ Angular
+
+ -
+ Bootstrap
+
+ -
+ Mantine
+
+ -
+ Node.js
+
+ -
+ SCSS
+
+ -
+ TailwindCSS
+
+ -
+ Express.js
+
+ -
+ Keras
+
+ -
+ PyTorch
+
+ -
+ scikit-learn
+
+
+
+
+
+
Tools
+
+ -
+ Git
+
+ -
+ Docker
+
+ -
+ Microsoft Azure
+
+ -
+ AWS
+
+ -
+ Cloudflare
+
+ -
+ Firebase
+
+ -
+ Vercel
+
+ -
+ Nginx
+
+ -
+ Unity
+
+ -
+ Kubernetes
+
+ -
+ Postman
+
+ -
+ Swagger
+
+ -
+ Jira
+
+ -
+ Cisco
+
+ -
+ Raspberry Pi
+
+ -
+ Figma
+
+ -
+ GNS3
+
+ -
+ Gimp
+
+ -
+ Canva
+
+
+
From dae7d851826ea087b70d6b3e8b50beacb5cd011c Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Tue, 20 Aug 2024 20:58:02 -0400
Subject: [PATCH 19/34] chore: Remove Gimp
---
src/Components/Experience/ExperienceTimeline.tsx | 3 ---
1 file changed, 3 deletions(-)
diff --git a/src/Components/Experience/ExperienceTimeline.tsx b/src/Components/Experience/ExperienceTimeline.tsx
index dc12b1e..5297305 100644
--- a/src/Components/Experience/ExperienceTimeline.tsx
+++ b/src/Components/Experience/ExperienceTimeline.tsx
@@ -303,9 +303,6 @@ const ExperienceTimeline = () => {
GNS3
-
- Gimp
-
+