This commit is contained in:
Jordy Hoogeveen
2026-09-15 14:02:17 +02:00
parent 750dc69e56
commit 0b67f346e1
19 changed files with 449 additions and 161 deletions
+12 -3
View File
@@ -10,7 +10,7 @@ Eigen vermogen · Schulden · Voortgang · Gebruikersbeheer
![Node.js](https://img.shields.io/badge/Node.js_22-339933?style=flat&logo=node.js&logoColor=white)
![PostgreSQL](https://img.shields.io/badge/PostgreSQL_18-4169E1?style=flat&logo=postgresql&logoColor=white)
![Docker](https://img.shields.io/badge/Docker_Compose-2496ED?style=flat&logo=docker&logoColor=white)
![Version](https://img.shields.io/badge/versie-1.0.6-8b5cf6?style=flat)
![Version](https://img.shields.io/badge/versie-1.0.7-8b5cf6?style=flat)
![Built with Claude](https://img.shields.io/badge/Gebouwd_met-Claude.ai-8b5cf6?style=flat&logo=anthropic&logoColor=white)
<img src="docs/screenshot-dashboard.png" alt="VibeFinance dashboard" width="820">
@@ -171,7 +171,7 @@ build — anders zou de release met een placeholder als notes online komen.
| 📉 **Schuld** | Schulden bijhouden per blok met afbetalingsoverzicht |
| 📈 **Voortgang Schuld & EV** | Grafieken en trends van EV en schuld over tijd (apart bij te houden) |
| 👥 **Gebruikers** | Accounts aanmaken, bewerken en beheren (Admin-rol vereist) |
| ⚙️ **Instellingen** | Licht/donker thema, backup downloaden en backup terugzetten |
| ⚙️ **Instellingen** | Kleurthema, licht/donker, backup downloaden en backup terugzetten |
De grafiek "Ontwikkeling van Eigen Vermogen" op het dashboard tekent twee lijnen
op één as: je netto waarde per voortgangsmoment, en daaronder de cumulatief
@@ -181,6 +181,15 @@ inleglijn is per definitie gelijk aan de KPI "Totaal geïnvesteerde fiat" — be
rekenen het oudste voortgangsmoment als startinleg en tellen daar de stortingen
per rij bij op.
Onder **Instellingen** kies je een van de negen kleurthema's. Thema en
licht/donker staan los van elkaar: het thema levert het accent, de schakelaar de
ondergrond. De paletten staan in
[`frontend/src/constants/themas.js`](frontend/src/constants/themas.js);
`useTheme(themaId, darkMode)` leidt daar randen, invoervelden en schaduwen uit af.
Groen, rood en goud veranderen bewust nooit mee — die betekenen winst, verlies en
inleg, en betekenis hoort niet van een kleurkeuze af te hangen. Thema en modus
worden per browser bewaard.
De kolommen in de tabellen op Eigen vermogen en Voortgang zijn versleepbaar: pak
de rechterrand van een kolomkop. De breedtes worden per tabel in de browser
bewaard; dubbelklik op de greep voor de standaardbreedte.
@@ -223,7 +232,7 @@ vibefinance/
│ ├── App.css # Reset + losse klassen (o.a. .kolom-grip)
│ ├── main.jsx
│ ├── version.js # Draaiende versie (__APP_VERSION__ uit de build)
│ ├── constants/ # Kleuren, tabs, begindata
│ ├── constants/ # index.js (kleuren, tabs, begindata), themas.js
│ ├── utils/ # format.js (bedragen/datums), storage.js
│ ├── hooks/ # useTheme, useUpdateCheck, useKolomBreedtes
│ ├── context/ # AppContext (global state + API sync + backup)