diff --git a/src/lib/components/common/Metadata.svelte b/src/lib/components/common/Metadata.svelte index 1151162..c607600 100644 --- a/src/lib/components/common/Metadata.svelte +++ b/src/lib/components/common/Metadata.svelte @@ -38,6 +38,13 @@ p { margin: 0; } + + a { + transition: opacity 0.5s; + &:hover { + opacity: 0.6; + } + } } } diff --git a/src/lib/components/timeline/TimeNode.svelte b/src/lib/components/timeline/TimeNode.svelte index 63430a4..1ea98fd 100644 --- a/src/lib/components/timeline/TimeNode.svelte +++ b/src/lib/components/timeline/TimeNode.svelte @@ -3,12 +3,13 @@ export let project: any; export let numProjects: number; + export let i: number; let isCurrentProject: boolean = project.end_date; let hasLink: boolean = project.hasOwnProperty("link"); - let isReverse: boolean = project.id % 2 == 0; - let isFirstChild: boolean = project.id == 1; - let isLastChild: boolean = project.id == numProjects; + let isReverse: boolean = i % 2 != 0; + let isFirstChild: boolean = i == 0; + let isLastChild: boolean = i == numProjects-1; let node: HTMLElement; let isNodeVisited: boolean = false; diff --git a/src/lib/components/timeline/Timeline.svelte b/src/lib/components/timeline/Timeline.svelte index fc6bc46..ca99f5d 100644 --- a/src/lib/components/timeline/Timeline.svelte +++ b/src/lib/components/timeline/Timeline.svelte @@ -36,8 +36,8 @@
- {#each data.projects as project} - + {#each data.projects as project, i} + diff --git a/src/lib/data/yml/projects.yml b/src/lib/data/yml/projects.yml index 867030a..d376376 100644 --- a/src/lib/data/yml/projects.yml +++ b/src/lib/data/yml/projects.yml @@ -1,5 +1,17 @@ # next_id: 5 projects: + - id: 2 + title: AthenaHacks 2024 + start_date: Aug 2023 + end_date: Mar 2024 + desc: The 2024 website of SoCal's premier women-centric hackathon. Created from scratch with SvelteKit, TypeScript, and Sass. Prototype designed in Figma. + tags: + tech: + - Front-End + art: + - UI/UX + link: https://athenahacks.github.io/AthenaHacks2024/ + link_text: View the website. - id: 1 title: Google STEP Internship start_date: May 2023 @@ -14,22 +26,23 @@ projects: - Back-End art: - UI/UX - - id: 2 - title: Milkcee Studios - start_date: Dec 2022 - end_date: - desc: - What you're looking at right now! Started as a winter break project and built - up little by little. Created from scratch with SvelteKit, TypeScript, and Sass. - tags: - tech: - - Front-End - - Back-End - art: - - UI/UX - - Illustration - link: https://github.com/milkcee12/milkcee12.github.io/tree/main - link_text: View the Github repo + + # - id: 2 + # title: Milkcee Studios + # start_date: Dec 2022 + # end_date: + # desc: + # What you're looking at right now! Started as a winter break project and built + # up little by little. Created from scratch with SvelteKit, TypeScript, and Sass. + # tags: + # tech: + # - Front-End + # - Back-End + # art: + # - UI/UX + # - Illustration + # link: https://github.com/milkcee12/milkcee12.github.io/tree/main + # link_text: View the Github repo - id: 3 title: Trojan Dining start_date: 2021