jhoogie
released this
2026-09-15 14:06:24 +02:00
| 18 commits to main since this release
Toegevoegd
- Kleurthema's. Negen paletten in
frontend/src/constants/themas.js, te kiezen
onder Instellingen naast de dark-mode schakelaar. Thema en licht/donker staan
los van elkaar: het thema levert het accent, de schakelaar de ondergrond. Dat
scheelt een compleet tweede palet per thema en laat de bestaande schakelaar
doen wat hij deed
useTheme(themaId, darkMode) leidt randen, invoervelden en schaduwen af uit
het accent van het thema, dus die kleuren vanzelf mee. Nieuwe sleutels op T:
accent, accentLicht, accentTekst, accentGradient, chartVan,
chartTot, darkMode, themaId en themaNaam. De bestaande sleutels houden
hun naam en betekenis, zodat er niets hoeft te wijzigen dat ze al gebruikt- Het accent dat tekst draagt is per ondergrond een andere stap van dezelfde
kleur — de lichte op donker, de donkere op licht. Eén stap voor beide modi
haalt aan één kant altijd te weinig contrast
Opgelost
- De weergavevoorkeuren overleven een herlaad.
darkMode stond op
useState(true) en werd nergens bewaard: zette je de app op licht en laadde je
opnieuw, dan stond je weer in het donker. Thema en modus gaan nu naar
localStorage, net als de kolombreedtes. Ze staan los van je financiële data en
gaan dus niet mee in de backup-ZIP
VoortgangTab.jsx bepaalde de modus met T.bg === "#0f1117". Die kleur is de
achtergrond allang niet meer (dat is #241A39), dus de grafiek gebruikte
altijd de lichte rasterlijnen — ook in het donker. Leest nu T.darkMode, wat
met instelbare thema's sowieso de enige werkbare manier is- De kolomkoppen van de categorieën hebben een
title, net als de
Opmerkingen-cellen al hadden: bij de standaardbreedte kapt "Crowdfunding" af
- De dark-mode schakelaar in
InstellingenModal.jsx was een <div> met een
klik-handler en dus niet met het toetsenbord te bedienen. Nu een
<button role="switch"> met aria-checked
Gewijzigd
- De accenten door de hele app lopen via het thema. Ongeveer 80 verwijzingen in
negen bestanden: knoppen, badges, de actieve tab, de doelbalk, de avatar, het
logo in de navigatiebalk en de gradient van de vermogenslijn in de grafiek.
PURPLE en PURPLE_LIGHT werden in vijf bestanden uit constants/index.js
geïmporteerd; die blijven bestaan voor het loginscherm, maar de app leest nu
T.accent en T.accentTekst
- De knopstijlen
primaryBtn, editBtn en addBtn in EigenVermogenTab.jsx en
SchuldTab.jsx zijn functies van T geworden, zoals cancelBtn al was — een
object op moduleniveau kan het thema niet volgen
VBadge, TabBtn en VProgressBar in components/ui/index.jsx lezen hun
standaardkleur uit het thema in plaats van uit een geïmporteerde constante. Wie
een kleur meegeeft houdt die, dus de categorie- en schuldkleuren blijven staan- Een paar plekken die in lichte modus nauwelijks werkten, lopen nu ook via het
thema: de doelbalk had rgba(255,255,255,0.07) als achtergrond (onzichtbaar op
wit) en de tooltips in beide grafieken hadden een vaste donkere vulling
Bekend
- Het loginscherm blijft bewust op de huisstijl. Daar zit bijna de helft van alle
paarse accenten (32 van de 70) voor een scherm dat je enkele seconden ziet — en
bij opslag per account weet je daar nog niet welk thema je moet tonen
- De kleurenkiezer voor schuldblokken (
SchuldTab.jsx) en de categoriekleuren
houden hun vaste lijst. Dat is data van de gebruiker, geen thema
Downloads