fix: theme not applying to training/records pages
Root cause: themeStyle was on .container only, but modals (picker, day-detail) were siblings of .container in the WXML tree. CSS custom properties set via inline style on .container don't cascade to sibling elements — those elements fall back to app.wxss page-level defaults (always orange). Users saw modal buttons in orange and concluded the whole page didn't follow theme. Fixes: - index.wxml: Move picker modal inside .container so it inherits themeStyle CSS variables (position:fixed is viewport-relative, so nesting doesn't affect modal positioning) - index.js, records.js: Add applyThemeToPage in onLoad alongside onShow, preventing a flash of default orange before onShow fires - timer.js: Add onShow with applyThemeToPage as lifecycle safety net; extract _init from onLoad for clean separation
This commit is contained in:
@@ -23,6 +23,7 @@ Page({
|
|||||||
},
|
},
|
||||||
|
|
||||||
onLoad() {
|
onLoad() {
|
||||||
|
themeMod.applyThemeToPage(this)
|
||||||
this.refresh()
|
this.refresh()
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
+31
-31
@@ -76,39 +76,39 @@
|
|||||||
<text class="tip-icon">💡</text>
|
<text class="tip-icon">💡</text>
|
||||||
<text class="tip-text">保持身体成一条直线,核心收紧,均匀呼吸</text>
|
<text class="tip-text">保持身体成一条直线,核心收紧,均匀呼吸</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
|
||||||
|
|
||||||
<!-- 时间选择弹窗 -->
|
<!-- 时间选择弹窗 -->
|
||||||
<view class="modal-overlay modal-overlay-bottom" wx:if="{{showPicker}}" bindtap="onClosePicker">
|
<view class="modal-overlay modal-overlay-bottom" wx:if="{{showPicker}}" bindtap="onClosePicker">
|
||||||
<view class="picker-modal" catchtap="noop" catchtouchmove="noop">
|
<view class="picker-modal" catchtap="noop" catchtouchmove="noop">
|
||||||
<view class="picker-handle"></view>
|
<view class="picker-handle"></view>
|
||||||
<text class="picker-title">⏱ 选择训练时长</text>
|
<text class="picker-title">⏱ 选择训练时长</text>
|
||||||
<view class="preset-grid">
|
<view class="preset-grid">
|
||||||
<view
|
<view
|
||||||
class="preset-item {{customDuration === item ? 'selected' : ''}}"
|
class="preset-item {{customDuration === item ? 'selected' : ''}}"
|
||||||
wx:for="{{presets}}"
|
wx:for="{{presets}}"
|
||||||
wx:key="*this"
|
wx:key="*this"
|
||||||
data-value="{{item}}"
|
data-value="{{item}}"
|
||||||
bindtap="onSelectPreset"
|
bindtap="onSelectPreset"
|
||||||
>
|
>
|
||||||
<text class="preset-num">{{item}}</text>
|
<text class="preset-num">{{item}}</text>
|
||||||
<text class="preset-unit">秒</text>
|
<text class="preset-unit">秒</text>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="custom-input-row">
|
||||||
|
<text class="custom-label">自定义:</text>
|
||||||
|
<input
|
||||||
|
class="custom-input"
|
||||||
|
type="number"
|
||||||
|
placeholder="输入秒数"
|
||||||
|
value="{{customInput}}"
|
||||||
|
bindinput="onCustomInput"
|
||||||
|
/>
|
||||||
|
<text class="custom-label">秒</text>
|
||||||
|
</view>
|
||||||
|
<button class="picker-confirm btn-primary" bindtap="onConfirmFree">
|
||||||
|
开始自由训练
|
||||||
|
</button>
|
||||||
|
<text class="picker-cancel" bindtap="onClosePicker">取消</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="custom-input-row">
|
|
||||||
<text class="custom-label">自定义:</text>
|
|
||||||
<input
|
|
||||||
class="custom-input"
|
|
||||||
type="number"
|
|
||||||
placeholder="输入秒数"
|
|
||||||
value="{{customInput}}"
|
|
||||||
bindinput="onCustomInput"
|
|
||||||
/>
|
|
||||||
<text class="custom-label">秒</text>
|
|
||||||
</view>
|
|
||||||
<button class="picker-confirm btn-primary" bindtap="onConfirmFree">
|
|
||||||
开始自由训练
|
|
||||||
</button>
|
|
||||||
<text class="picker-cancel" bindtap="onClosePicker">取消</text>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|||||||
@@ -20,6 +20,7 @@ Page({
|
|||||||
},
|
},
|
||||||
|
|
||||||
onLoad() {
|
onLoad() {
|
||||||
|
themeMod.applyThemeToPage(this)
|
||||||
this.refresh()
|
this.refresh()
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -21,6 +21,14 @@ Page({
|
|||||||
|
|
||||||
onLoad(options) {
|
onLoad(options) {
|
||||||
themeMod.applyThemeToPage(this)
|
themeMod.applyThemeToPage(this)
|
||||||
|
this._init(options)
|
||||||
|
},
|
||||||
|
|
||||||
|
onShow() {
|
||||||
|
themeMod.applyThemeToPage(this)
|
||||||
|
},
|
||||||
|
|
||||||
|
_init(options) {
|
||||||
|
|
||||||
let target
|
let target
|
||||||
let planDay = 1
|
let planDay = 1
|
||||||
|
|||||||
Reference in New Issue
Block a user