ADR 0014: Class-Based Dark Mode with CSS Variables
Decision to implement dark mode using class-based approach with CSS variables and localStorage persistence.
Decision to implement dark mode using class-based approach with CSS variables and localStorage persistence.
Decision to use tri-layer metadata approach (OG/Twitter/JSON-LD) for rich social previews and search engine understanding.
Decision to use native Intersection Observer API for scroll animations instead of external animation libraries.
Decision to use Docusaurus as the docs-as-code platform for the portfolio documentation system.
Decision to use filesystem-driven navigation with autogenerated sidebars and per-folder category metadata for enterprise scalability.
Decision to host the Docusaurus documentation site on Vercel, enabling PR preview deployments and main-branch production publishing.
Decision to implement additional CI quality gates and Vercel deployment checks to enforce build determinism, code quality, and documentation integrity for the Documentation App.
Decision to implement the Portfolio App as a Next.js App Router application using TypeScript, pnpm, and modern UI/tooling aligned to enterprise delivery expectations.
Decision to keep the Portfolio App focused on a polished product experience and use the Docusaurus Documentation App as the enterprise evidence engine.
Decision to deploy the Portfolio App to Vercel using preview deployments for PRs and production promotion gated by imported GitHub checks.
Establishes mandatory CI gates with stable check naming, deterministic installs, baseline CodeQL + Dependabot posture, and main-branch enforcement via GitHub Rulesets.
Decision to enable the experimental React Compiler (React 19) for the Portfolio App to optimize performance and adopt modern React patterns.
Context
Adopt a YAML-backed, Zod-validated project registry with environment-aware URL construction as the single source of truth for portfolio projects.
Environment-first URL construction for portable, consistent linking across portfolio-app and portfolio-docs repositories.
Adopt explicit preview/staging/production tiers with immutable builds and environment-aware configuration to strengthen deployment credibility and operational safety.
Adopt semantic versioning and explicit lifecycle policies for the portfolio program.
Adopt a defense-in-depth baseline for React/Next.js server surfaces after React2Shell-class vulnerabilities.
Adopt a lightweight hardening baseline for the Docusaurus-based Portfolio Docs app to reduce supply-chain and content injection risk.
Adopt React Testing Library with jsdom for component/page tests and add unit coverage for API routes.
System design, C4 views, integrations, data flows, and Architecture Decision Records (ADRs) that establish clear, reviewable technical intent.
Decision traceability for the portfolio program: why key architectural choices were made, what alternatives were considered, and how decisions are validated and operationalized.