Interactive salary gap calculator (public/lonn/) showing how percentage-based raises amplify absolute salary differences over time. Includes landing page, README, and CLAUDE.md. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1.7 KiB
1.7 KiB
CLAUDE.md
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
Project Overview
Interactive web application that visualizes how percentage-based salary increases amplify absolute salary differences over time. Norwegian-language UI ("Lønnsforskjellen vokser" = "The salary gap grows").
Architecture
Hosted at forskjeller.naiv.no. Static site in public/ — no build system, no package manager. Serve public/ as the site root. Each topic gets its own subdirectory (e.g. public/lonn/).
public/lonn/index.html— Page structure: header, 4 range-slider controls, 4 stat cards, 4 chart canvases, explainer sectionpublic/lonn/style.css— CSS custom properties in:root, CSS Grid layouts, responsive breakpoints at 560px/480px/360pxpublic/lonn/app.js— All logic:fmtKr(n)/fmtShort(n)— Norwegian locale number formatting (nb-NO)getData()— Computes compound growth arrays from slider valuesbaseOpts()— Shared Chart.js config factory for all 4 chartsupdate()— Reads sliders, recalculates, updates DOM and charts (called on everyinputevent)
External dependencies (loaded via CDN, no install needed): Chart.js 4.4.1, Google Fonts (Fraunces + DM Sans).
Key Design Decisions
- All 4 charts share
baseOpts()— modify this for consistent chart styling changes - Charts update with
'none'animation mode for responsive slider interaction - Mathematical model: gap =
(B₀ − A₀) × (1 + r)ⁿ
Development
python3 -m http.server 8000 -d public
# open http://localhost:8000/lonn/
Language
All user-facing text is in Norwegian Bokmål (nb-NO). Use Norwegian for UI strings and nb-NO locale for number formatting.