Root cause: WXSS compiler resolves var(--primary) at compile time
against page{} declarations in app.wxss. The orange defaults
(--primary:#FF6B35 etc.) were being baked into compiled WXSS,
so the inline style theme override on .container was ignored.
Records and settings pages always rendered orange regardless of
the user's theme choice.
Fix:
1. Remove --primary, --primary-light, --primary-bg, --primary-rgb
from page{} in app.wxss, forcing WXSS to resolve var() at
runtime from inline style on .container
2. Expand BASE_VARS in theme.js to include default orange theme
vars, so the initial render (before onLoad) still has valid
CSS custom properties — no flash of unstyled content
3. Export BASE_VARS from theme.js
4. Change all 4 pages + custom-tab-bar initial data.themeStyle
from '' to themeMod.BASE_VARS, eliminating the empty-string
gap between first render and onLoad
Root cause: WeChat miniprogram components have style isolation by default.
Changing tab bar hardcoded #888/#666 to var(--text-secondary) broke
because --text-secondary was only defined on page{} in app.wxss and
couldn't cascade into the custom-tab-bar component.
Fix:
1. theme.js: inject BASE_VARS (--text, --text-secondary, --border, etc.)
into themeStyle string so they're available via inline style everywhere
2. Add styleIsolation: apply-shared to all 3 component JSONs so page-level
CSS variables cascade into components
- var→const/let, function→arrow/class across all 13 JS files
- Timer: prototype→class with ES6 getters
- plan days: IIFE→Array.from declarative generation
- storage/plan: unified formatDate via util.js
- Bugfix: getPlanDay now filters by planId (plan switch accuracy)
- Bugfix: getTodayRecord searches all months (cross-month boundary)
- WXML/WXSS unchanged; public API unchanged
lc