feat: 首页按钮样式调整(小圆角/并排/高度对齐)

- 主按钮与自由/循环训练按钮圆角统一为 16rpx(直角→折中方案)
- 自由训练/循环训练两个次按钮改为并排一行,文字精简为「自由训练」「循环训练」
- 两个次按钮 size 由 md 改为 xl,与主按钮高度一致
- 新增 preview-buttons.html 对照预览
- 更新工作记忆
This commit is contained in:
2026-08-03 17:04:05 +08:00
parent 6ff70971d8
commit bce796d893
5 changed files with 224 additions and 91 deletions
+25 -16
View File
@@ -89,25 +89,32 @@
text="{{todayDone ? '再次训练' : '开始训练'}}"
icon-src="{{icons.playWhite}}"
bindtap="onStartTrain"
custom-style="border-radius:16rpx;"
></ui-btn>
<ui-btn
variant="ghost"
size="md"
block
text="自由训练 · 自定义时长"
icon-src="{{icons.timeFill}}"
bindtap="onFreeTrain"
></ui-btn>
<view class="action-row">
<ui-btn
class="action-cell"
variant="ghost"
size="xl"
block
text="自由训练"
icon-src="{{icons.timeFill}}"
bindtap="onFreeTrain"
custom-style="border-radius:16rpx;"
></ui-btn>
<ui-btn
variant="ghost"
size="md"
block
text="循环训练 · 分组练习"
icon-src="{{icons.repeatFill}}"
bindtap="onCircuitTrain"
></ui-btn>
<ui-btn
class="action-cell"
variant="ghost"
size="xl"
block
text="循环训练"
icon-src="{{icons.repeatFill}}"
bindtap="onCircuitTrain"
custom-style="border-radius:16rpx;"
></ui-btn>
</view>
</view>
<!-- 时间选择弹窗 -->
@@ -148,6 +155,7 @@
block
text="开始自由训练"
bindtap="onConfirmFree"
custom-style="border-radius:16rpx;"
></ui-btn>
<text class="picker-cancel" bindtap="onClosePicker">取消</text>
</ui-modal>
@@ -203,6 +211,7 @@
block
text="保存并开始"
bindtap="onConfirmCircuit"
custom-style="border-radius:16rpx;"
></ui-btn>
<text class="picker-cancel" bindtap="onCloseCircuitPicker">取消</text>
</ui-modal>
+11
View File
@@ -313,6 +313,17 @@
margin: 8rpx 0 8rpx;
}
/* 自由训练 / 循环训练 并排一行 */
.action-row {
display: flex;
gap: 16rpx;
}
.action-row .action-cell {
flex: 1;
min-width: 0; /* 防止图标+文字在窄屏撑破 flex 项 */
}
/* ---- picker ---- */
.picker-title {
font-size: 34rpx;