diff --git a/public/arv/index.html b/public/arv/index.html index f6b5353..4198f84 100644 --- a/public/arv/index.html +++ b/public/arv/index.html @@ -23,50 +23,51 @@ +

Lik innsats. Ulikt utgangspunkt.

Arvens
forsprang

Person A starter fra null. Person B arver en sum. Begge sparer likt — men gapet lukkes aldri. Se hvordan arv forsterkes over tid.

-
Fødselslotteriet
+
- ↗ + Pass på å velge rike foreldre. En arv på vokser til over på år — uten at B løfter en finger.
-
+

Sjekk selv

- +
- 500 000 kr + 500 000 kr
- +
- 3 000 kr + 3 000 kr
- +
- 7,0 % + 7,0 %
- +
- 30 år + 30 år
@@ -107,7 +108,7 @@ Person B
-
+
@@ -121,7 +122,7 @@ Gap (arv × (1+r)ⁿ) -
+
@@ -137,7 +138,7 @@ Arv-andel (%) -
+
diff --git a/public/bolig/index.html b/public/bolig/index.html index 7d3d228..5eeb246 100644 --- a/public/bolig/index.html +++ b/public/bolig/index.html @@ -23,50 +23,51 @@ +

Samme prisvekst. Ikke det samme resultatet.

Boligforskjellen
forsterkes

To boliger med ulik pris stiger like mye i prosent — men belåningen forsterker gapet i egenkapital dramatisk.

-
Boligfesten
+
- ↗ + Med i prisforskjell og % årlig vekst: egenkapitalgapet vokser til over på år.
-
+

Sjekk selv

- +
- 3 000 000 kr + 3 000 000 kr
- +
- 4 000 000 kr + 4 000 000 kr
- +
- 4,0 % + 4,0 %
- +
- 15 år + 15 år
@@ -107,7 +108,7 @@ Bolig B
-
+
@@ -121,7 +122,7 @@ Verdidifferanse -
+
@@ -139,7 +140,7 @@ EK-gap -
+
diff --git a/public/boligeierskap/index.html b/public/boligeierskap/index.html index 70aed36..c8d5a8f 100644 --- a/public/boligeierskap/index.html +++ b/public/boligeierskap/index.html @@ -93,12 +93,13 @@ +

SSB-data 2015–2024

Hvem eier
boligen din?

Over halvparten av norske «boligeiere» har boliglån. I snitt eier banken 43 % av boligens verdi. Og 28 % leier.

-
Boligdrømmen
+
@@ -108,7 +109,7 @@ — Boligeierskap og boligøkonomi, husholdninger
-
+
@@ -148,7 +149,7 @@ Leier
-
+
@@ -171,7 +172,7 @@ Over 3 mill
-
+
@@ -193,7 +194,7 @@ Leier
-
+
diff --git a/public/boutgifter/index.html b/public/boutgifter/index.html index 9079d1c..6730f68 100644 --- a/public/boutgifter/index.html +++ b/public/boutgifter/index.html @@ -100,12 +100,13 @@ +

SSB-data 2015–2024

Det er dyrt
å være fattig

De fattigste betaler minst i kroner — men mest av inntekten sin. 41 % av de fattigste bruker over 40 % av inntekten på bolig. Blant de rikeste: 7 %.

-
Boligbyrden
+
@@ -114,7 +115,7 @@ — Boligøkonomi og boligeierskap, husholdninger
-
+
@@ -154,7 +155,7 @@ 60 %+
-
+
@@ -172,7 +173,7 @@
-
+
@@ -194,7 +195,7 @@ Leier
-
+
diff --git a/public/index.html b/public/index.html index 14eee90..d16bdbf 100644 --- a/public/index.html +++ b/public/index.html @@ -120,10 +120,15 @@ color: var(--ink); transition: border-color 0.15s, box-shadow 0.15s; } - .topic-card:hover { + .topic-card:hover, + .topic-card:focus-visible { border-color: var(--accent); box-shadow: 0 2px 12px rgba(192,57,43,0.08); } + .topic-card:focus-visible { + outline: 2px solid var(--accent); + outline-offset: 2px; + } .topic-card h2 { font-family: 'Fraunces', serif; font-size: 1.1rem; @@ -166,6 +171,29 @@ border-top: 1px solid var(--border); } footer a { color: var(--ink3); } + footer a:focus-visible { + outline: 2px solid var(--accent); + outline-offset: 2px; + } + .skip-link { + position: absolute; + top: -100%; + left: 1rem; + background: var(--ink); + color: var(--bg); + padding: 0.75rem 1.25rem; + border-radius: 0 0 4px 4px; + font-size: 0.9rem; + z-index: 1000; + text-decoration: none; + } + .skip-link:focus { top: 0; } + @media (prefers-reduced-motion: reduce) { + *, *::before, *::after { + transition-duration: 0.01ms !important; + animation-duration: 0.01ms !important; + } + } @@ -175,6 +203,7 @@ +

forskjeller.naiv.no

@@ -182,7 +211,7 @@

Interaktive visualiseringer som viser hvordan tilsynelatende små forskjeller vokser over tid.

-
+

Lønn & arbeid

diff --git a/public/lonn/index.html b/public/lonn/index.html index ee731bd..ff92b2d 100644 --- a/public/lonn/index.html +++ b/public/lonn/index.html @@ -23,50 +23,51 @@ +

Samme prosent. Ikke det samme resultatet.

Lønnsforskjellen
vokser

Prosentvise lønnstillegg ser rettferdige ut — men de gjør de rike rikere, hvert eneste år. Se hva som skjer over tid.

-
Spis de rike
+
- ↗ + Selv en liten forskjell på i startlønn blir til over i løpet av en karriere — med identisk prosentvekst.
-
+

Sjekk selv

- +
- 500 000 kr + 500 000 kr
- +
- 550 000 kr + 550 000 kr
- +
- 3,5 % + 3,5 %
- +
- 20 år + 20 år
@@ -110,7 +111,7 @@ Lønn B
-
+
@@ -124,7 +125,7 @@ Gap (år) -
+
@@ -140,7 +141,7 @@ Gap (måned) -
+
@@ -156,7 +157,7 @@ Akkum. gap -
+
diff --git a/public/lonnsutvikling/index.html b/public/lonnsutvikling/index.html index f6d3306..1a90c85 100644 --- a/public/lonnsutvikling/index.html +++ b/public/lonnsutvikling/index.html @@ -95,19 +95,20 @@ +

Reelle tall fra SSB, 2016–2025

Dobbel
ulikhet

De høyest lønte fikk ikke bare flere kroner — de fikk også høyere prosentvis vekst. Dobbel ulikhet i praksis.

-
Lønnsfesten
+
Data: SSB tabell 11418 — Gjennomsnittlig månedslønn, alle sektorer, begge kjønn, 2016–2025
-
+
@@ -146,7 +147,7 @@
-
+
@@ -167,7 +168,7 @@ Prosentvekst
-
+
@@ -185,7 +186,7 @@
-
+
diff --git a/public/sparing/index.html b/public/sparing/index.html index 1c29c6d..a40feb1 100644 --- a/public/sparing/index.html +++ b/public/sparing/index.html @@ -23,50 +23,51 @@ +

Samme sparebeløp. Ikke det samme resultatet.

Rentes rente
forsterker

Noen få prosentpoeng i avkastning ser ubetydelig ut — men over tid skaper de enorme forskjeller. Se hva rentes rente gjør med sparepengene dine.

-
Penger lager penger
+
- ↗ + Med i år: bare prosentpoeng mer i avkastning gir over ekstra.
-
+

Sjekk selv

- +
- 3 000 kr + 3 000 kr
- +
- 4,0 % + 4,0 %
- +
- 7,0 % + 7,0 %
- +
- 25 år + 25 år
@@ -107,7 +108,7 @@ Konto B
-
+
@@ -121,7 +122,7 @@ Gap -
+
@@ -139,7 +140,7 @@ Renter B -
+
diff --git a/public/style.css b/public/style.css index 8db04e6..4d0e22f 100644 --- a/public/style.css +++ b/public/style.css @@ -27,6 +27,23 @@ body { min-height: 100vh; } +/* SKIP LINK */ +.skip-link { + position: absolute; + top: -100%; + left: 1rem; + background: var(--ink); + color: var(--bg); + padding: 0.75rem 1.25rem; + border-radius: 0 0 4px 4px; + font-size: 0.9rem; + z-index: 1000; + text-decoration: none; +} +.skip-link:focus { + top: 0; +} + /* HEADER */ header { background: var(--ink); @@ -97,7 +114,7 @@ main { font-size: 1rem; font-weight: 300; font-style: italic; - color: rgba(245,242,235,0.5); + color: rgba(245,242,235,0.6); margin-bottom: 1.5rem; letter-spacing: 0.03em; } @@ -115,7 +132,7 @@ main { font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; - color: rgba(245,242,235,0.45); + color: rgba(245,242,235,0.6); margin-bottom: 0.5rem; font-weight: 400; } @@ -142,6 +159,11 @@ main { transition: transform 0.1s; } .control-group input[type=range]::-webkit-slider-thumb:hover { transform: scale(1.2); } +.control-group input[type=range]:focus-visible { + outline: 2px solid #e8b4a0; + outline-offset: 4px; + border-radius: 2px; +} .control-group input[type=range]::-moz-range-thumb { width: 16px; height: 16px; border-radius: 50%; @@ -356,6 +378,10 @@ footer { margin-top: 3rem; } footer a { color: var(--ink3); } +footer a:focus-visible { + outline: 2px solid var(--accent); + outline-offset: 2px; +} /* RESPONSIVE CHART HEIGHTS */ .h-240 { height: 240px; } @@ -368,3 +394,12 @@ footer a { color: var(--ink3); } .controls-card { padding: 1.25rem; } .explainer { padding: 1.25rem; } } + +/* REDUCED MOTION */ +@media (prefers-reduced-motion: reduce) { + *, *::before, *::after { + transition-duration: 0.01ms !important; + animation-duration: 0.01ms !important; + } + html { scroll-behavior: auto; } +}