Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/apursley2012/oracle/llms.txt

Use this file to discover all available pages before exploring further.

The Altar of Experience

Oracle’s Work Experience page is set before a stone altar illuminated by three ritual candles. Each candle represents a chapter of Alex Weaver’s career: the taller the flame and the wax column, the longer Alex held that role. Clicking a candle causes it to flare brightly, and a parchment scroll unfurls beneath it to reveal the company name, title, dates, and key achievements. The candles are arranged chronologically left to right, so the altar reads like a timeline from earliest role to present day.

Career Timeline

1

Senior Frontend Alchemist — Arcane Systems (2021–Present)

The current and longest-burning candle on the altar. Alex leads frontend architecture across Arcane Systems’ product suite.Tenure bar: 80%Key Achievements
  • Architected a micro-frontend architecture reducing load times by 40%.
  • Mentored junior developers in the dark arts of React performance optimization.
  • Led the migration from legacy REST scrolls to modern GraphQL incantations.
2

Fullstack Developer — Mystic Web Co (2018–2021)

The mid-height candle, representing three years of fullstack work across e-commerce and content platforms.Tenure bar: 60%Key Achievements
  • Maintained the core e-commerce platform handling 10k+ daily rituals (transactions).
  • Implemented automated testing wards that caught 95% of bugs before production.
  • Designed a custom CMS using Node.js and React.
3

Junior Web Weaver — Digital Coven (2016–2018)

The shortest candle — the spark that started it all. Alex’s first professional role, focused on foundational front-end craft.Tenure bar: 40%Key Achievements
  • Crafted responsive landing pages for various magical entities.
  • Optimized asset delivery, shrinking bundle sizes by 30%.
  • Learned the foundational spells of HTML, CSS, and JavaScript.

Interaction Design

The Candle Metaphor

Each candle is an SVG element composed of three parts: the wick, the wax column, and the animated flame. The height of the wax column is data-driven — it maps directly to the duration value stored per job entry (80%, 60%, and 40% respectively), so a glance at the altar communicates relative tenure before a word is read. Flame animation The flame uses a looping Framer Motion keyframes variant that oscillates the flame path’s scaleX and scaleY values, creating a realistic flicker. On hover, the flame brightens via a filter brightness transition. On click, a brief scaleY spike animates an enthusiastic flare. Scroll reveal Selecting a candle triggers an AnimatePresence-managed detail panel beneath it. The panel enters with a height spring from 0 to auto and an opacity fade, mimicking a scroll of parchment unrolling downward. Deselecting (or selecting a different candle) reverses the animation before the new content mounts. Timeline progression The candles are spaced along a horizontal stone shelf rendered in CSS. A faint glow (box-shadow in the matching accent color) radiates from the active candle, drawing the eye to the currently focused role.

Build docs developers (and LLMs) love