Julia Weppler

Per the assignment specifications, generative AI was used to create this page, but was modified slightly to my personal taste. It was originally created with GPT-5.4 mini.

Prompt used:

You are helping me build out the Career page of my personal portfolio website. I need you to make ONLY the changes I describe. Do not redesign other pages, restructure my files, or add features I didn't ask for.

## Tech constraints (strict)
- Vanilla JavaScript with ES6 modules only
- Bootstrap 5 for layout and utilities where possible
- NO additional JavaScript libraries, plugins, or templates
- NO inline styles (style="...") in HTML or in JS template strings
- Custom CSS only where Bootstrap can't do what is needed

## What I want
A horizontal, scrollable timeline rendered into the existing #timeline div on career.html.

Layout requirements:
- All milestones laid out in a single horizontal row, left to right, oldest to newest
- Container scrolls horizontally when content exceeds the viewport width
- Each milestone should have:
  - A date label (use the displayDate field)
  - A dot or marker sitting on a horizontal connecting line that spans the full timeline
  - A short title (use the title field)
  - An "extra info" detail (use the hover field) that is HIDDEN by default

Hover behavior:
- On hover over a milestone, the milestone expands to reveal the hover detail
- The expansion should feel smooth but I do NOT want fade/slide animations on the rest of the page, only the hover reveal itself
- Other milestones should not shift around dramatically when one is hovered (some shift is okay)

Responsiveness:
- The horizontal scroll behavior should work on desktop and mobile
- On very narrow screens, the horizontal layout can stay horizontal — do not collapse to vertical

## What to deliver
1. The updated career.js (full file)
2. Any new CSS rules to add to my existing styles.css (just the new additions, clearly marked)
3. Any needed changes to career.html (just the diff, not the full file)

## What NOT to do
- Don't touch index.html, projects.html, home.js, projects.js, or data.js
- Don't add npm, build steps, or package.json
- Don't introduce new HTML files
- Don't rename or restructure existing classes
- Don't add a "back to top" button, navigation arrows, scroll indicators, or any feature I didn't ask for